Merge pull request #301 from grycap/addons

Addons. Implements #302

app/__init__.py

@@ -24,6 +24,7 @@
 import io
 import os
 import logging
+import copy
 from requests.exceptions import Timeout
 from werkzeug.middleware.proxy_fix import ProxyFix
 from flask_dance.consumer import OAuth2ConsumerBlueprint
@@ -49,7 +50,7 @@ def create_app(oidc_blueprint=None):
     app = Flask(__name__)
     app.wsgi_app = ProxyFix(app.wsgi_app, x_for=1, x_proto=1, x_host=1, x_port=1, x_prefix=1)
     app.secret_key = "8210f566-4981-11ea-92d1-f079596e599b"
-    app.config.from_json('config.json')
+    app.config.from_file("config.json", load=json.load)
     settings = Settings(app.config)
     if settings.vault_url:
         cred = VaultCredentials(settings.vault_url)
@@ -162,22 +163,25 @@ def home():
         if "filter" in session:
             template_filter = session["filter"]
 
+        templates = {}
+        for name, tosca in toscaInfo.items():
+            if "parents" not in tosca["metadata"]:
+                templates[name] = tosca
+
         if template_filter:
             session["filter"] = template_filter
             templates = {}
             for k, v in toscaInfo.items():
                 if 'description' and v['description']:
-                    if v['description'].find(template_filter) != -1:
+                    if v['description'].find(template_filter) != -1 and "parents" not in tosca["metadata"]:
                         templates[k] = v
-        else:
-            templates = toscaInfo
 
         if settings.debug_oidc_token:
             session["vos"] = None
             session['userid'] = "a_very_long_user_id_00000000000000000000000000000000000000000000@egi.es"
             session['username'] = "username"
             session['gravatar'] = ""
-            return render_template('portfolio.html', templates=templates)
+            return render_template('portfolio.html', templates=templates, parent=None)
         else:
             if not oidc_blueprint.session.authorized:
                 return redirect(url_for('login'))
@@ -225,7 +229,7 @@ def home():
                 else:
                     session['gravatar'] = utils.avatar(account_info_json['sub'], 26)
 
-                return render_template('portfolio.html', templates=templates)
+                return render_template('portfolio.html', templates=templates, parent=None)
             else:
                 flash("Error getting User info: \n" + account_info.text, 'error')
                 return render_template('home.html', oidc_name=settings.oidcName)
@@ -592,6 +596,9 @@ def infoutputs(infid=None):
     def configure():
         selected_tosca = None
         inf_id = request.args.get('inf_id', None)
+        childs = request.args.get('childs', None)
+        if childs:
+            childs = childs.split(",")
 
         inputs = {}
         infra_name = ""
@@ -619,6 +626,8 @@ def configure():
                             inputs[input_name] = input_value["default"]
                 if 'filename' in data['metadata'] and data['metadata']['filename']:
                     selected_tosca = data['metadata']['filename']
+                if 'childs' in data['metadata'] and data['metadata']['childs']:
+                    childs = data['metadata']['childs']
             except Exception as ex:
                 flash("Error getting TOSCA template inputs: \n%s" % ex, "error")
 
@@ -635,7 +644,24 @@ def configure():
             flash("InvalidTOSCA template name: %s" % selected_tosca, "error")
             return redirect(url_for('home'))
 
-        app.logger.debug("Template: " + json.dumps(toscaInfo[selected_tosca]))
+        child_templates = {}
+        selected_template = copy.deepcopy(toscaInfo[selected_tosca])
+        if "childs" in toscaInfo[selected_tosca]["metadata"]:
+            if childs is not None:
+                for child in childs:
+                    if child in toscaInfo:
+                        child_templates[child] = toscaInfo[child]
+                        if "inputs" in toscaInfo[child]:
+                            selected_template["inputs"].update(toscaInfo[child]["inputs"])
+                        if "tabs" in toscaInfo[child]:
+                            selected_template["tabs"].extend(toscaInfo[child]["tabs"])
+            else:
+                for child in toscaInfo[selected_tosca]["metadata"]["childs"]:
+                    if child in toscaInfo:
+                        child_templates[child] = toscaInfo[child]
+                return render_template('portfolio.html', templates=child_templates, parent=selected_tosca)
+        else:
+            app.logger.debug("Template: " + json.dumps(toscaInfo[selected_tosca]))
 
         try:
             creds = cred.get_creds(get_cred_id(), 1)
@@ -645,10 +671,10 @@ def configure():
         utils.get_project_ids(creds)
 
         return render_template('createdep.html',
-                               template=toscaInfo[selected_tosca],
+                               template=selected_template,
                                selectedTemplate=selected_tosca,
                                creds=creds, input_values=inputs,
-                               infra_name=infra_name)
+                               infra_name=infra_name, child_templates=child_templates)
 
     @app.route('/vos')
     def getvos():
@@ -824,6 +850,14 @@ def add_ssh_keys_to_template(template):
 
         return template
 
+    def _merge_templates(template, new_template):
+        for item in ["inputs", "node_templates", "outputs"]:
+            if item in new_template["topology_template"]:
+                if item not in template["topology_template"]:
+                    template["topology_template"][item] = {}
+                template["topology_template"][item].update(new_template["topology_template"][item])
+        return template
+
     @app.route('/submit', methods=['POST'])
     @authorized_with_valid_token
     def createdep():
@@ -832,6 +866,9 @@ def createdep():
 
         app.logger.debug("Form data: " + json.dumps(request.form.to_dict()))
 
+        childs = []
+        if 'extra_opts.childs' in form_data:
+            childs = form_data['extra_opts.childs'].split(",")
         cred_id = form_data['extra_opts.selectedCred']
         cred_data = cred.get_cred(cred_id, get_cred_id())
         access_token = oidc_blueprint.session.token['access_token']
@@ -871,9 +908,14 @@ def createdep():
         with io.open(settings.toscaDir + request.args.get('template')) as stream:
             template = yaml.full_load(stream)
 
+        for child in childs:
+            with io.open(settings.toscaDir + child) as stream:
+                template = _merge_templates(template, yaml.full_load(stream))
+
         if 'metadata' not in template:
             template['metadata'] = {}
         template['metadata']['filename'] = request.args.get('template')
+        template['metadata']['childs'] = childs
 
         if priv_network_id and pub_network_id:
             template = add_network_id_to_template(template, priv_network_id, pub_network_id)

app/templates/advanced_config.html

@@ -86,7 +86,7 @@ <h5>Cloud Provider:</h5>
             loadImages();
             loadSiteImages();
             loadSiteInfo();
-        } else if (cred_type == 'OpenStack') {
+        } else if (cred_type == 'OpenStack' || cred_type == 'CH') {
             $('#cloudImages').hide();
             $('#fedcloudImages').hide();
             $('#siteImages').show();

app/templates/createdep.html

@@ -15,6 +15,19 @@ <h4 class="font-weight-bold text-primary">
             {% else %}
             Template: {{selectedTemplate}}
             {% endif %}
+            {% if child_templates %}
+             + 
+            {% for name, child_template in child_templates.items() %}
+                {%- if 'metadata' in child_template and 'name' in child_template['metadata'] and child_template['metadata']['name'] -%}
+                {{ child_template['metadata']['name'] }}
+                {%- else -%}
+                {{ name }}
+                {%- endif -%}
+                {%- if loop.index != loop.length -%}
+                ,
+                {% endif -%}
+            {% endfor %}
+            {% endif %}
             </h4>
         </div>
 
@@ -28,6 +41,9 @@ <h4 class="font-weight-bold text-primary">
 
             <form id="depSubmit" action="{{ url_for('createdep', template=selectedTemplate) }}" method="post" onsubmit="return onSubmit();">
                 <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
+                {% if child_templates %}
+                <input type="hidden" name="extra_opts.childs" value="{{ ','.join(child_templates.keys()) }}"/>
+                {% endif %}
                 <div class="form-group">
                     <label for="additional_description">Infrastructure Name</label>
                     <input type="text" class="form-control" id="infra_name" name="infra_name" placeholder="description" value="{{ infra_name }}" maxlength="60" required>
@@ -58,7 +74,7 @@ <h4 class="font-weight-bold text-primary">
 
 function onSubmit() {
 {% if g.analytics_tag %}
-    gtag('event', 'submit', {'event_category' : '{{selectedTemplate}}', 'event_label' : 'Submit'});
+    gtag('event', 'submit', {'event_category' : '{{selectedTemplate}},{{ ",".join(child_templates.keys()) }}', 'event_label' : 'Submit'});
 {% endif %}
     return true;
 }

app/templates/modal_creds.html

@@ -262,6 +262,34 @@
           </div>
         </div>
 
+{% elif cred_type == "CH" %}
+        <div class="row form-group">
+          <div class="col">
+              <input placeholder="Username" name="username" class="col-sm-12" type="text" id="username" value="{{ creds['username'] if creds else '' }}" required/>
+          </div>
+          <div class="col">
+              <input placeholder="Password" name="password" class="col-sm-12" type="password" id="password"/>
+          </div>
+        </div>
+
+        <div class="row form-group">
+          <div class="col">
+            <input placeholder="Tenant" name="tenant" class="col-sm-12" type="text" id="tenant" value="{{ creds['tenant'] if creds else '' }}" required/>
+        </div>
+          <div class="col">
+            <div class="col">
+              <input placeholder="Region" name="region" class="col-sm-12" type="text" id="region" value="{{ creds['region'] if creds else '' }}" required/>
+          </div>
+          </div>
+        </div>
+
+        <div class="row form-group">
+          <div class="col">
+              <input placeholder="Tenant ID" name="tenant_id" class="col-sm-12" type="text" id="tenant_id" value="{{ creds['tenant_id'] if creds else '' }}"/>
+          </div>
+          <div class="col">
+          </div>
+        </div>
 {% else %}
 
 

app/templates/portfolio.html

@@ -2,6 +2,26 @@
 {% block title %}Portfolio{% endblock %}
 {% block content %}
 
+<script>
+  let selected_templates = Array();
+  function AddChild(link, template) {
+    if (selected_templates.includes(template)) {
+      document.getElementById(template).classList.remove("selected-addon");
+      pos = selected_templates.indexOf(template);
+      selected_templates.splice(pos, 1)
+      link.innerHTML = "<span class='fas fa-plus mr-2'></span>Add";
+      link.classList.remove("badge-danger");
+      link.classList.add("badge-primary");
+    } else {
+      document.getElementById(template).classList.add("selected-addon");
+      selected_templates.push(template);
+      link.innerHTML = "<span class='fas fa-minus mr-2'></span>Remove";
+      link.classList.remove("badge-primary");
+      link.classList.add("badge-danger");
+    }
+  } 
+</script>
+
 <div class="container mt-2" id="cardsContainer" xmlns="http://www.w3.org/1999/html">
   {% include 'flashed_messages.html' %}
     <div class="input-group mb-4">
@@ -10,6 +30,13 @@
       </div>
       <input id="cardFilter" class="form-control py-2 border" type="text" onkeyup="cardFilter()" placeholder="Search...">
     </div>
+    {% if parent %}
+    <div class="input-group mb-4">
+      <h5 class="font-weight-bold text-primary">
+        Select Optional Features:
+      </h5>
+    </div>
+    {% endif %}
 
   <div class="card-deck">
 
@@ -18,7 +45,7 @@
     <div class="card-group">
     {% endif %}
 
-        <div class="card mb-4" style="width: 20rem; max-height: 25rem;">
+        <div class="card mb-4" style="width: 20rem; max-height: 25rem;" id="{{tosca_filename}}">
             <div class="card-body">
                 <h5 class="card-title text-center">
 		  <strong>{% if tosca['metadata']['display_name'] is defined %}{{tosca['metadata']['display_name']}}{% else %}{{tosca_filename}}{% endif %}</strong>
@@ -46,7 +73,13 @@ <h5>
 		</h5>
                 <p id="toscaDescription" class="card-text tosca-descr"><small>{{tosca['description']}}</small></p>
                 <a selector="toscaDescription" class="text-left badge badge-pill badge-info read_more" tabindex="0" data-toggle="popover" title="Full description" data-trigger="focus" data-content="{{tosca['description']}}">Read More</a>
+                {% if parent %}
+                <a href="#" onclick="AddChild(this, '{{tosca_filename}}')" class="badge badge-pill badge-primary"><span class='fas fa-plus mr-2'></span>Add</a>
+                {% elif 'link' in tosca['metadata'] %}
+                <a href="{{ url_for('configure', selected_tosca=tosca['metadata']['link']['parent'], childs=tosca['metadata']['link']['childs']) }}" class="badge badge-pill badge-primary">Configure</a>
+                {% else %}
                 <a href="{{ url_for('configure', selected_tosca=tosca_filename) }}" class="badge badge-pill badge-primary">Configure</a>
+                {% endif %}
             </div>
         </div>
     {% if loop.index % 3 == 0 %}
@@ -57,7 +90,15 @@ <h5>
     </div>
     {% endif %}
 
+
   </div>
+  {% if parent %}
+  <div class="input-group mb-4 justify-content-center align-items-center">
+    <button type=button class="btn btn-outline-secondary" onclick="history.back()"><span class="fas fa-arrow-left mr-2"></span> Back</button>
+    &nbsp;
+    <button type=button class='btn btn-primary' onclick='location.href="{{ url_for('configure', selected_tosca=parent) }}&childs=" + selected_templates'>Configure <span class="fas fa-arrow-right mr-2"></span></button>
+</div>
+  {% endif %}
 </div>
 
 <script>
@@ -95,6 +136,10 @@ <h5>
 
 <style>
 
+.selected-addon {
+  background-color: rgb(9, 139, 179, 0.5);
+}
+
 .wrapper {
   position: relative;
   overflow: hidden;
@@ -217,7 +262,7 @@ <h5>
     cardContainer = document.getElementById("cardsContainer");
     cards = cardContainer.getElementsByClassName("card");
     for (i = 0; i < cards.length; i++) {
-        title = cards[i].querySelector(".card-body .card-title");
+        title = cards[i].querySelector(".card-text");
         if (title.innerText.toUpperCase().indexOf(filter) > -1) {
             cards[i].style.display = "";
         } else {

app/templates/service_creds.html

@@ -30,6 +30,7 @@ <h4 class="font-weight-bold text-primary">Cloud Credentials</h4>
                 <a class="dropdown-item" data-id="" data-type="Kubernetes" data-toggle="modal" data-target="#newModal" href="#"><img src="{{ url_for('static', filename='images/KubernetesRow.png') }}"/></a>
                 <a class="dropdown-item" data-id="" data-type="InfrastructureManager" data-toggle="modal" data-target="#newModal" href="#"><img src="{{ url_for('static', filename='images/InfrastructureManagerRow.png') }}"/></a>
                 <a class="dropdown-item" data-id="" data-type="OSCAR" data-toggle="modal" data-target="#newModal" href="#"><img src="{{ url_for('static', filename='images/OSCARRow.png') }}"/></a>
+                <a class="dropdown-item" data-id="" data-type="CH" data-toggle="modal" data-target="#newModal" href="#"><img src="{{ url_for('static', filename='images/CHRow.png') }}"/></a>
               </div>
             </div>
           </div> <!-- / .row -->
@@ -79,6 +80,9 @@ <h4 class="font-weight-bold text-primary">Cloud Credentials</h4>
                         {% if 'project' in cred%}
                         <strong>Project: </strong> {{cred["project"]}}
                         {% endif %}
+                        {% if 'region' in cred%}
+                        <strong>Region: </strong> {{cred["region"]}}
+                        {% endif %}
                       </td>
                       <td>
                         <button {{ 'disabled' if cred['type']=='fedcloud' else '' }} type=button id="updateBtn" data-id="{{cred['id']}}" data-type="{{cred['host']}}" class="btn btn-small btn-info" data-toggle="modal" data-target="#newModal"><i class='far fa-edit m-1'></i></button>