Merge pull request #8 from maricaantonacci/devel

Bootstrap 4

app/routes.py

@@ -28,6 +28,34 @@ def avatar(email, size):
             if name[0] != '.': 
                toscaTemplates.append( os.path.relpath(os.path.join(path, name), toscaDir ))
 
+import_metadata = False
+tosca_metadata_dir = app.config.get('TOSCA_METADATA_DIR')
+if tosca_metadata_dir:
+    import_metadata = True
+    metadata_dict = {}
+    tosca_metadata_path = tosca_metadata_dir + "/"
+
+    for tosca in toscaTemplates:
+        # Assign default metadata vaules
+        metadata_dict[tosca] = dict(name=tosca,
+                                    icon=app.root_path+"/static/defaults/default_app.svg")
+        # Search for metadata file
+        for mpath, msubs, mnames in os.walk(tosca_metadata_path):
+            for mname in mnames:
+                if fnmatch(mname, '*.metadata.yml') or fnmatch(mname, '*.metadata.yaml'):
+                    # skip hidden files
+                    if mname[0] != '.':
+                        tosca_metadata_file = os.path.join(mpath, mname)
+                        with io.open(tosca_metadata_file) as metadata_file:
+                            metadata = yaml.load(metadata_file)
+                            template_metadata = metadata["template_metadata"]
+                            if(tosca == template_metadata["name"]):
+                                metadata_dict[tosca] = template_metadata
+
+    toscaTemplates = metadata_dict
+
+tosca_pars_dir = app.config.get('TOSCA_PARAMETERS_DIR')
+
 orchestratorUrl = app.config.get('ORCHESTRATOR_URL')
 slamUrl = app.config.get('SLAM_URL')
 cmdbUrl = app.config.get('CMDB_URL')
@@ -66,7 +94,7 @@ def get_slas(access_token):
 
     url = slamUrl + "/rest/slam/preferences/" + session['organisation_name']
     verify = True
-    if slam_cert: 
+    if slam_cert:
         verify = slam_cert
     response = requests.get(url, headers=headers, timeout=20, verify=verify)
     app.logger.info("SLA response status: " + str(response.status_code))
@@ -101,10 +129,9 @@ def getslas():
   return render_template('sla.html', slas=slas)
 
 
-@app.route('/dashboard/<page>')
-@app.route('/<page>')
+@app.route('/dashboard/')
 @app.route('/')
-def home(page=0):
+def home():
 
   if not iam_blueprint.session.authorized:
      return redirect(url_for('login'))
@@ -120,19 +147,18 @@ def home(page=0):
 
         headers = {'Authorization': 'bearer %s' % (access_token)}
 
-        url = orchestratorUrl +  "/deployments?createdBy=me&page=" + str(page)
+        url = orchestratorUrl +  "/deployments?createdBy=me&page=0&size=9999"
         response = requests.get(url, headers=headers)
 
         deployments = {}
         if not response.ok:
             flash("Error retrieving deployment list: \n" + response.text, 'warning')
         else:
             deployments = response.json()["content"]
-            pages=response.json()['page']['totalPages']
-            app.logger.debug(pages)
-        return render_template('deployments.html', deployments=deployments, tot_pages=pages, current_page=page)
-  except Exception:
-      app.logger.info("error")
+            app.logger.debug("Deployments: " + str(deployments))
+        return render_template('deployments.html', deployments=deployments)
+  except Exception as e:
+      app.logger.info("Error: " + str(e))
       return redirect(url_for('logout'))
 
 
@@ -179,7 +205,7 @@ def depcreate():
      access_token = iam_blueprint.session.token['access_token']
 
      if request.method == 'GET':
-        return render_template('createdep.html', templates=toscaTemplates, inputs={})
+        return render_template('createdep.html', templates=toscaTemplates, inputs={}, import_metadata=import_metadata)
      else:
         selected_tosca = request.form.get('tosca_template')
 
@@ -192,26 +218,53 @@ def depcreate():
            inputs={}
            if 'inputs' in template['topology_template']:
               inputs = template['topology_template']['inputs']
-
+
+           ## add parameters code here
+           enable_config_form = False
+           tabs={}
+           if tosca_pars_dir:
+               tosca_pars_path = tosca_pars_dir + "/"  # this has to be reassigned here because is local.
+               for fpath, subs, fnames in os.walk(tosca_pars_path):
+                   for fname in fnames:
+                       if fnmatch(fname, os.path.splitext(selected_tosca)[0] + '.parameters.yml') or \
+                               fnmatch(fname, os.path.splitext(selected_tosca)[0] + '.parameters.yaml'):
+                           # skip hidden files
+                           if fname[0] != '.':
+                               tosca_pars_file = os.path.join(fpath, fname)
+                               with io.open(tosca_pars_file) as pars_file:
+                                   enable_config_form = True
+                                   pars_data = yaml.load(pars_file)
+                                   inputs = pars_data["inputs"]
+                                   if "tabs" in pars_data:
+                                       tabs = pars_data["tabs"]
            description = "N/A"
            if 'description' in template:
               description = template['description']
 
-           slas = get_slas(access_token)
-           return render_template('createdep.html', templates=toscaTemplates, selectedTemplate=selected_tosca, description=description,  inputs=inputs, slas=slas)
+           try:
+               slas = get_slas(access_token)
+
+           except Exception as e:
+               flash("Error retrieving SLAs list: \n" + str(e), 'warning')
+               return redirect(url_for('home'))
+
+           return render_template('createdep.html', 
+                                  templates=toscaTemplates,
+                                  selectedTemplate=selected_tosca,
+                                  import_metadata=import_metadata,
+                                  description=description,
+                                  inputs=inputs,
+                                  slas=slas,
+                                  enable_config_form=enable_config_form,
+                                  tabs=tabs)
 
 def add_sla_to_template(template, sla_id):
     # Add the placement policy
 
-    nodes=template['topology_template']['node_templates']
-    compute_nodes = []
-#    for key, dict in nodes.items():
-#        node_type=dict["type"]
-#        if node_type == "tosca.nodes.indigo.Compute" or node_type == "tosca.nodes.indigo.Container.Application.Docker.Chronos" :
-#            compute_nodes.append(key)
-#    template['topology_template']['policies']=[{ "deploy_on_specific_site": { "type": "tosca.policies.Placement", "properties": { "sla_id": sla_id }, "targets": compute_nodes  } }]
-    template['topology_template']['policies']=[{ "deploy_on_specific_site": { "type": "tosca.policies.Placement", "properties": { "sla_id": sla_id } } }]
-    app.logger.info(yaml.dump(template,default_flow_style=False))
+    template['topology_template']['policies'] = [
+        {"deploy_on_specific_site": {"type": "tosca.policies.Placement", "properties": {"sla_id": sla_id}}}]
+    app.logger.info(yaml.dump(template, default_flow_style=False))
+
     return template
 #        
 # 
@@ -246,11 +299,9 @@ def createdep():
 
          payload = { "template" : yaml.dump(template,default_flow_style=False), "parameters": inputs }
 
-     #body= json.dumps(payload)
 
      url = orchestratorUrl +  "/deployments/"
      headers = {'Content-Type': 'application/json', 'Authorization': 'bearer %s' % (access_token)}
-     #response = requests.post(url, data=body, headers=headers)
      response = requests.post(url, json=payload, params=params, headers=headers)
 
      if not response.ok:
@@ -269,5 +320,3 @@ def logout():
    iam_blueprint.session.get("/logout")
 #   del iam_blueprint.session.token
    return redirect(url_for('login'))
-
-

app/static/images/favicon_io/site.webmanifest

@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

app/templates/base.html

@@ -1,46 +1,73 @@
 <html>
-    <head>
-      <meta charset="utf-8">
-      <meta name="viewport" content="width=device-width, initial-scale=1">
-      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
-      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
-      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
-      <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet">
-      <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
-      <script src="static/bootstrap/Bootstrap-Confirmation-2/bootstrap-confirmation.js"></script>
-    </head>
-    <body>
-        <nav class="navbar navbar-inverse">
-          <div class="container-fluid">
-             <div class="navbar-header">
-		<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
-                  <span class="icon-bar"></span>
-                  <span class="icon-bar"></span>
-                  <span class="icon-bar"></span>
-		</button>
-                <a class="navbar-brand" href="">PaaS Orchestrator Dashboard</a>
-             </div>
-	     <div class="collapse navbar-collapse" id="myNavbar">
-	       <ul class="nav navbar-nav">
-		 <li class="active"><a href="{{ url_for("home") }}">Home</a></li>
-	       </ul>	 
-	       {% if session['username'] %}
-	       <ul class="nav navbar-nav">
-		 <li class="active"><a href="{{ url_for("getslas") }}">SLAs</a></li>
-                 <li class="active"><a href="{{ url_for("show_settings") }}">Settings</a></li>
-               </ul>
-               <ul class="nav navbar-nav navbar-right">
-	         <li class="dropdown">
-			 <a class="dropdown-toggle" data-toggle="dropdown" href="#"><img class="img-circle" src="{{ session['gravatar'] }}"</src> {{ session['username'] }}<span class="caret"></span></a>
-		       <ul class="dropdown-menu">
-                         <li><a href="{{ url_for("logout") }}">Logout</a></li>
-		       </ul>
-	         </li>
-               </ul>
-	       {% endif %}
-             </div>
-	  </div>
-        </nav>
-        {% block content %}{% endblock %}
-    </body>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- BS4-->
+    <!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">-->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+    <!-- DataTables -->
+    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css"/>
+    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/responsive/2.2.2/css/responsive.bootstrap4.min.css"/>
+    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/scroller/2.0.0/css/scroller.bootstrap4.min.css"/>
+    <script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
+    <script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
+    <script type="text/javascript" src="https://cdn.datatables.net/responsive/2.2.2/js/dataTables.responsive.min.js"></script>
+    <script type="text/javascript" src="https://cdn.datatables.net/responsive/2.2.2/js/responsive.bootstrap4.min.js"></script>
+    <script type="text/javascript" src="https://cdn.datatables.net/scroller/2.0.0/js/dataTables.scroller.min.js"></script>
+    <!-- Select2 -->
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
+    <!-- Toggle -->
+    <link href="https://cdn.jsdelivr.net/gh/gitbrent/[email protected]/css/bootstrap4-toggle.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/gh/gitbrent/[email protected]/js/bootstrap4-toggle.min.js"></script>
+    <!-- Latest compiled and minified JavaScript -->
+    <script src="https://unpkg.com/[email protected]/dist/bootstrap-show-password.min.js"></script>
+    <!-- FontAwesome-->
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
+    <!-- Add favicon -->
+    <link rel="apple-touch-icon" sizes="180x180" href="static/images/favicon_io/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="static/images/favicon_io/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="static/images/favicon_io/favicon-16x16.png">
+    <link rel="manifest" href="static/images/favicon_io/site.webmanifest">
+</head>
+<body>
+    <nav class="navbar navbar-dark bg-dark navbar-expand-md">
+        <div class="container-fluid">
+            <a class="navbar-brand" href="">PaaS Orchestrator Dashboard</a>
+            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#myNavbar">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+	    <div class="collapse navbar-collapse" id="myNavbar">
+                <ul class="navbar-nav mr-auto">
+                    {% if session['username'] %}
+                    <li class="nav-item active"><a class="nav-link" href="{{ url_for("home") }}">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="{{ url_for("getslas") }}">SLAs</a></li>
+                    <li class="nav-item"><a class="nav-link" href="{{ url_for("show_settings") }}">Settings</a></li>
+                    {% if session['userrole'] == 'admin' %}
+                    <li class="nav-item"><a class="nav-link" href="{{ url_for('show_users') }}">Users</a></li>
+                    {% endif %}
+                    {% endif %}
+                </ul>
+                {% if session['username'] %}
+                <ul class="navbar-nav ml-auto">
+	            <li class="nav-item dropdown">
+                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">
+                            <img class="rounded-circle" src="{{ session['gravatar'] }}"</src> {{ session['username'] }}<span class="caret"></span>
+                        </a>
+                        <div class="dropdown-menu">
+                            <a class="dropdown-item" href="{{ url_for("logout") }}">Logout</a>
+                        </div>
+	            </li>
+                </ul>
+	        {% endif %}
+            </div>
+        </div>
+    </nav>
+    {% block content %}{% endblock %}
+</body>
 </html>

app/templates/config_form.html

@@ -0,0 +1,51 @@
+<!-- start tabs creation section -->
+<ul class="nav nav-tabs">
+{% if tabs|length > 0 %}
+  {% for tab in tabs %}
+    {% if loop.first %}
+      <li class="nav-item"><a class="nav-link active" data-toggle="tab" href=#{{tab}}>{{tab}}</a></li>
+    {% else %}
+      <li class="nav-item"><a class="nav-link" data-toggle="tab" href=#{{tab}}>{{tab}}</a></li>
+    {% endif %}
+  {% endfor %}
+{% else %}
+  <li class="nav-item"><a class="nav-link" data-toggle="tab" href=#InputValues>Input Values</a></li>
+{% endif %}
+<li class="nav-item"><a class="nav-link" data-toggle="tab" href=#Advanced>Advanced</a></li> <!-- always create advanced tab -->
+</ul>
+  <!-- end tab creation section -->
+
+<div class="tab-content">
+  <!-- inputs -->
+  {% if tabs|length > 0 %}
+    {% for tab in tabs %}
+      {% if loop.first %}
+        <div id={{tab}} class="tab-pane fade show active">
+      {% else %}
+        <div id={{tab}} class="tab-pane fade">
+      {% endif %}
+
+      <br>
+      {% for key, value in inputs.items() %}
+        {% if value.tab == tab %}
+          {% include 'input_types.html' %}
+        {% endif %}
+      {% endfor %}
+      </div>
+    {% endfor %}
+
+  {% else %} <!-- no tabs -->
+    <div id=InputValues class="tab-pane fade in active">
+      {% for key, value in inputs.items() %}
+        {% include 'input_types.html' %}
+      {% endfor %}
+    </div>
+  {% endif %}
+  <!-- end inputs -->
+
+  <!-- scheduling -->
+  <br>
+  <div id="Advanced" class="tab-pane fade">
+    {% include 'scheduling.html' %}
+  </div>
+</div>