Merge pull request #1 from samply/develop

Revised the style of the page and made it dynamic

app.py

@@ -1,36 +1,38 @@
-from os import environ
 from flask import Flask, render_template, url_for
 from os import environ
 from importlib import import_module
 from common import ServiceType
 
 app = Flask(__name__)
 
-def prepare_vars(vars):
-    missingvars = []
-    for var in vars:
-        env = environ.get(var)
-        if env == None:
-            missingvars.append(var)
+
+def prepare_vars(required_vars):
+    missing_vars = [var for var in required_vars if not environ.get(var)]
+    if missing_vars:
+        raise Exception(f"Please define variables: {', '.join(missing_vars)}")
+
+    for var in required_vars:
         globals()[var] = environ.get(var)
 
-    if(len(missingvars) > 0):
-        raise Exception("Please define variables: %s" % (", ".join(missingvars)) )
+
+prepare_vars(["PROJECT", "SITE_NAME", "HOST", "ENVIRONMENT"])
+project = import_module(f"projects.{PROJECT.lower()}")
+
 
 @app.route("/")
 def page():
     return render_template('page.template',
-        site_name=SITE_NAME,
-        thishostname=HOST,
-        project=PROJECT,
-        projectname=project.projectname_friendly,
-        logo=url_for("static", filename="%s.svg" % (PROJECT)),
-        centralservices=[service for service in project.services if service.type==ServiceType.CENTRAL],
-        localservices=[service for service in project.services if service.type==ServiceType.BRIDGEHEAD])
-
-prepare_vars(["PROJECT", "SITE_NAME", "HOST"])
+                           site_name=SITE_NAME,
+                           ENVIRONMENT=environ.get("ENVIRONMENT"),
+                           thishostname=HOST,
+                           project=PROJECT,
+                           projectname=project.projectname_friendly,
+                           logo=url_for("static", filename="%s.svg" % (PROJECT)),
+                           centralservices=[service for service in project.services if
+                                            service.type == ServiceType.CENTRAL],
+                           localservices=[service for service in project.services if
+                                          service.type == ServiceType.BRIDGEHEAD])
 
-project = import_module("projects.%s" % (PROJECT.lower()) )
 
 if __name__ == '__main__':
-    app.run()
+    app.run()

common.py

@@ -1,20 +1,22 @@
 from enum import Enum
 
+
 class ServiceType(Enum):
     CENTRAL = 1
     BRIDGEHEAD = 2
 
+
 class ServiceGroup(Enum):
     PSEUDONYMIZATION = 1
     SEARCH = 2
     PERSISTENCE = 3
     OPERATIONS = 4
     NEGOTIATION = 5
 
+
 class Service:
     def __init__(self, group, name, url, type):
         self.group = group
         self.name = name
         self.url = url
         self.type = type
-

projects/bbmri.py

@@ -1,12 +1,20 @@
+import os
 from common import Service, ServiceGroup, ServiceType
 
 projectname_friendly = "BBMRI-ERIC/GBN"
 
-services = [
-    Service(ServiceGroup.SEARCH, "Sample Locator (bbmri.de)", "https://samplelocator.bbmri.de", ServiceType.CENTRAL),
-    Service(ServiceGroup.SEARCH, "Sample Locator (BBMRI-ERIC)", "https://locator.bbmri-eric.eu", ServiceType.CENTRAL),
+services = []
+
+if os.environ.get("FLASK_ENV") == "production":
+    services.append(Service(ServiceGroup.SEARCH, "Sample Locator (bbmri.de)", "https://samplelocator.bbmri.de", ServiceType.CENTRAL))
+    services.append(Service(ServiceGroup.SEARCH, "Sample Locator (BBMRI-ERIC)", "https://locator.bbmri-eric.eu", ServiceType.CENTRAL))
+else:
+    services.append(Service(ServiceGroup.SEARCH, "Sample Locator (bbmri.de)", "https://samplelocator.test.bbmri.de", ServiceType.CENTRAL))
+    services.append(Service(ServiceGroup.SEARCH, "Sample Locator (BBMRI-ERIC)", "https://locator-dev.bbmri-eric.eu", ServiceType.CENTRAL))
+
+services.extend([
     Service(ServiceGroup.NEGOTIATION, "Negotiator", "https://negotiator.bbmri-eric.eu", ServiceType.CENTRAL),
     Service(ServiceGroup.OPERATIONS, "Zentrales Monitoring", "https://monitoring.verbis.dkfz.de/icingaweb2/dashboard", ServiceType.CENTRAL),
     Service(ServiceGroup.OPERATIONS, "Reverse Proxy (Traefik)", "https://<THISHOST>/dashboard/", ServiceType.BRIDGEHEAD),
     Service(ServiceGroup.PERSISTENCE, "FHIR-Server (Blaze)", "https://<THISHOST>/bbmri-localdatamanagement/fhir", ServiceType.BRIDGEHEAD),
-]
+])

projects/minimal.py

@@ -3,5 +3,6 @@
 projectname_friendly = "Minimal"
 
 services = [
-    Service(ServiceGroup.OPERATIONS, "Reverse Proxy (Traefik)", "https://<THISHOST>/dashboard/", ServiceType.BRIDGEHEAD),
+    Service(ServiceGroup.OPERATIONS, "Reverse Proxy (Traefik)", "https://<THISHOST>/dashboard/",
+            ServiceType.BRIDGEHEAD),
 ]

templates/page.template

@@ -3,7 +3,7 @@
           <tr>
             <td>{{ projectname }}</td>
             <td>{{ service.group.name | capitalize }}</td>
-            <td><a href="{{ service.url | replace("<THISHOST>",thishostname) }}">{{ service.name }}</td>
+            <td><a href="{{ service.url | replace("<THISHOST>",thishostname) }}">{{ service.name }}</a></td>
           </tr>
 {% endfor %}
 {% endmacro %}
@@ -15,24 +15,103 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="description" content="">
   <title>{{ project }} Bridgehead Overview</title>
+
   <!-- Bootstrap core CSS -->
-  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
-    integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
-  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
-    integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
-    crossorigin="anonymous"></script>
+  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
+  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
+
+{% if ENVIRONMENT == "production" %}
+  <style>
+    div .modal-body{
+    font-size: 20px;
+    }
+    body {
+      font-family: Arial, sans-serif;
+      background-color: #f8f9fa;
+    }
+    nav {
+      background-color: #66b2b2;
+      padding: 20px;
+      text-align: center;
+    }
+    nav h1, nav h2 {
+      color: white;
+      margin: 0;
+    }
+    .table th, .table td {
+      vertical-align: middle;
+    }
+    footer {
+      background-color: #66b2b2;
+      padding: 20px;
+      text-align: center;
+    }
+    footer img {
+      max-width: 300px;
+      margin-bottom: 10px;
+    }
+    footer .btn {
+      margin-left: 10px;
+    }
+  </style>
+  {% else %}
+    <style>
+    div .modal-body{
+    font-size: 20px;
+    }
+    body {
+      font-family: Arial, sans-serif;
+      background-color: #f8f9fa;
+    }
+    nav {
+      background-color: #808b96;
+      padding: 20px;
+      text-align: center;
+    }
+    nav h1, nav h2 {
+      color: #034f84;
+      margin: 0;
+    }
+    .table th, .table td {
+      vertical-align: middle;
+    }
+    footer {
+      background-color: #808b96;
+      padding: 20px;
+      text-align: center;
+    }
+    footer img {
+      max-width: 300px;
+      margin-bottom: 10px;
+    }
+    footer .btn {
+      margin-left: 10px;
+    }
+  </style>
+  {% endif %}
 </head>
 
 <body class="d-flex flex-column min-vh-100">
-
-  <nav class="navbar navbar-light" style="background-color: #aad7f6;">
-    <h2 class="pb-2 border-bottom">Bridgehead for {{ projectname }} in {{ site_name }}</h2>
+{% if ENVIRONMENT == "production" %}
+  <nav>
+    <h1>Bridgehead for {{ projectname }}</h1>
+    <h2>in {{ site_name }}</h2>
   </nav>
-  <div class="container px-4 py-5" id="featured-3">
-    <div>
-      <h2>Components</h2>
+  {% else %}
+    <nav>
+    <h1>Bridgehead for {{ projectname }}</h1>
+    <h2>in {{ site_name }}</h2>
+    <h3 style="color:#7b241c">Test</h3>
+  </nav>
+    {% endif %}
+  <div class="container py-5">
+    <div class="mb-4">
+      <h2 class="text-center">Components</h2>
+    </div>
+
+    <div class="mb-5">
       <h3>Central</h3>
-      <table class="table">
+      <table class="table table-striped table-bordered">
         <thead class="thead-dark">
           <tr>
             <th style="width: 25%">Project</th>
@@ -41,14 +120,14 @@
           </tr>
         </thead>
         <tbody>
-{{ servicelist(centralservices) }}
+          {{ servicelist(centralservices) }}
         </tbody>
       </table>
     </div>
 
-    <div>
+    <div class="mb-5">
       <h3>Local</h3>
-      <table class="table">
+      <table class="table table-striped table-bordered">
         <thead class="thead-dark">
           <tr>
             <th style="width: 25%">Project</th>
@@ -57,13 +136,54 @@
           </tr>
         </thead>
         <tbody>
-{{ servicelist(localservices) }}
+          {{ servicelist(localservices) }}
         </tbody>
       </table>
     </div>
-    <footer class="footer mt-auto py-3">
-     <img src="{{ logo }}" style="max-width: 30%; height: auto;"><span style="float: right;"><a href="https://github.com/samply/bridgehead"><button type="button" class="btn btn-primary">Documentation</button></a></span>
-    </footer>
+  </div>
+
+  <footer class="footer mt-auto py-3">
+    <img src="{{ logo }}" alt="Logo">
+    <div>
+      <a href="https://github.com/samply/bridgehead">
+        <button type="button" class="btn btn-primary">Documentation</button>
+      </a>
+      <!-- Button trigger modal -->
+<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#contactModal">
+  Contact
+</button>
+
+<!-- Modal -->
+<div class="modal fade" id="contactModal" tabindex="-1" aria-labelledby="ContactModalLabel" aria-hidden="true">
+  <div class="modal-dialog modal-lg modal-dialog-centered">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="ContactModalLabel">Contact</h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+      </div>
+      <div class="modal-body">
+        Need help, contact us under:<br>
+      {% if project == "ccp" %}
+        CCP Support Mail: <a href="mailto:[email protected]">[email protected]</a><br>
+        For general Information visit our <a href="https://wiki.verbis.dkfz.de/display/CCPIT/Zentrale+CCP+Ansprechpartner*innen">Wiki</a>
+        {% elif project == "minimal" %}
+        Minimal Support Mail: <a href="mailto:[email protected]">[email protected]</a>
+        {% elif project == "bbmri" %}
+        BBMRI Support Mail: <a href="mailto:[email protected]">[email protected]</a><br>
+        For general Information visit our <a href="https://wiki.verbis.dkfz.de/pages/viewpage.action?pageId=104960110">Wiki</a>
+        {% else %}
+        No contact information provided.
+       {% endif %}
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+      </div>
+    </div>
+  </div>
+</div>
+    </div>
+  </footer>
+
 </body>
 
 </html>