gerrit.onap Code Review - vfc/nfvo/wfengine.git/blob

   1 <%
   2 /*******************************************************************************
   3  * Copyright (c) 2013 Pascal Hirmer.
   4  * All rights reserved. This program and the accompanying materials
   5  * are made available under the terms of the Eclipse Public License v1.0
   6  * and the Apache License 2.0 which both accompany this distribution,
   7  * and are available at http://www.eclipse.org/legal/epl-v10.html
   8  * and http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Contributors:
  11  *    Pascal Hirmer - initial API and implementation
  12  *******************************************************************************/
  13 %>
  14 <%@tag language="java" pageEncoding="UTF-8" description="This tag is used to create DIVs for the selection dialogs."%>
  15
  16 <%@attribute name="repositoryURL" type="java.lang.String"%>
  17 <%@attribute name="serviceTemplateName" type="java.lang.String"%>
  18 <%@attribute name="topologyTemplateURL" type="java.lang.String"%>
  19
  20 <!--
  21         Topology Completion: chooseRelationshipTemplateDiag.
  22         This dialog serves the user selection of inserted RelationshipTemplates whenever there are several possibilities.
  23 -->
  24 <div class="modal fade" id="chooseRelationshipTemplateDiag">
  25         <div class="modal-dialog">
  26                 <div class="modal-content">
  27                         <div class="modal-header">
  28                                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
  29                                 <h4 class="modal-title">Topology Completion - Relationship Template Selection</h4>
  30                         </div>
  31                         <div class="modal-body"></div>
  32                         <div class="modal-footer"></div>
  33                 </div>
  34         </div>
  35 </div>
  36
  37 <!--
  38         Topology Completion: chooseNodeTemplateDiag.
  39         This dialog serves the user selection of inserted Node and RelationshipTemplates when the user selects "Complete topology step-by-step".
  40 -->
  41 <div class="modal fade" id="chooseNodeTemplateDiag">
  42         <div class="modal-dialog">
  43                 <div class="modal-content">
  44                         <div class="modal-header">
  45                                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
  46                                 <h4 class="modal-title">Topology Completion - Step by Step</h4>
  47                         </div>
  48                         <div class="modal-body"></div>
  49                         <div class="modal-footer">
  50                                 <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
  51                         </div>
  52                 </div>
  53         </div>
  54 </div>
  55
  56 <!--
  57         Topology Completion: chooseTopologyDiag.
  58         This dialog serves the user selection of completed topologies.
  59 -->
  60 <div class="modal fade" id="chooseTopologyDiag">
  61         <div class="modal-dialog">
  62                 <div class="modal-content">
  63                         <div class="modal-header">
  64                                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
  65                                 <h4 class="modal-title">Topology Completion - Choose possible solution </h4>
  66                         </div>
  67                         <div class="modal-body"></div>
  68                         <div class="modal-footer">
  69                                 <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
  70                         </div>
  71                 </div>
  72         </div>
  73 </div>
  74
  75 <!--
  76         Topology Completion: enterCompletionInformationDiag.
  77         This dialog serves the input of information before completing a topology automatically.
  78 -->
  79 <div class="modal fade" id="enterCompletionInformationDiag">
  80         <div class="modal-dialog">
  81                 <div class="modal-content">
  82                         <div class="modal-header">
  83                                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
  84                                 <h4 class="modal-title">Topology Completion</h4>
  85                         </div>
  86                         <div class="modal-body">
  87                                 <form id="enterCompletionInformationForm" enctype="multipart/form-data">
  88                                   <fieldset>
  89                                         <p> Select Save Option: </p>
  90                                         <p> <input type="radio" id="overwriteTopology" name="overwriteTopology" onclick="document.getElementById('topologyNamespace').disabled = true; document.getElementById('topologyName').disabled = true; document.getElementById('openInNewWindow').disabled = true;" checked> Overwrite Topology<br>
  91                                         <input type="radio" id="overwriteTopology" name="overwriteTopology" onclick="document.getElementById('topologyNamespace').disabled = false; document.getElementById('topologyName').disabled = false;document.getElementById('openInNewWindow').disabled = false;"> Create new Topology </p> <p> Name: <input id="topologyName" name="topologyName" disabled="disabled" type="text" size="30" maxlength="30"> </p> <p>Namespace: <input id="topologyNamespace" name="topologyNamespace" disabled="disabled" type="text" size="50" maxlength="60"> </p>
  92                                         <input id="openInNewWindow" name="openInNewWindow" type="checkbox" disabled="disabled" /> Open Topology in new Window <br>
  93                                         <input id="completionStyle" name="completionStyle" type="checkbox" /> Complete Topology Step-by-Step
  94                                   </fieldset>
  95                                 </form>
  96                         </div>
  97                         <div class="modal-footer">
  98                                 <button type="button" class="btn" data-dismiss="modal">Cancel</button>
  99                                 <button type="button" class="btn btn-primary btn-default" id="btnCompleteTopology" onclick="onClickCompleteTopology()">Complete Topology</button>
 100                                 <script>
 101                                         function onClickCompleteTopology() {
 102                                                 var namespace = document.getElementById('topologyNamespace').value;
 103                                                 var validURIregexp = new RegExp("([A-Za-z][A-Za-z0-9+\\-.]*):(?:(//)(?:((?:[A-Za-z0-9\\-._~!$&'()*+,;=:]|%[0-9A-Fa-f]{2})*)@)?((?:\\[(?:(?:(?:(?:[0-9A-Fa-f]{1,4}:){6}|::(?:[0-9A-Fa-f]{1,4}:){5}|(?:[0-9A-Fa-f]{1,4})?::(?:[0-9A-Fa-f]{1,4}:){4}|(?:(?:[0-9A-Fa-f]{1,4}:){0,1}[0-9A-Fa-f]{1,4})?::(?:[0-9A-Fa-f]{1,4}:){3}|(?:(?:[0-9A-Fa-f]{1,4}:){0,2}[0-9A-Fa-f]{1,4})?::(?:[0-9A-Fa-f]{1,4}:){2}|(?:(?:[0-9A-Fa-f]{1,4}:){0,3}[0-9A-Fa-f]{1,4})?::[0-9A-Fa-f]{1,4}:|(?:(?:[0-9A-Fa-f]{1,4}:){0,4}[0-9A-Fa-f]{1,4})?::)(?:[0-9A-Fa-f]{1,4}:[0-9A-Fa-f]{1,4}|(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))|(?:(?:[0-9A-Fa-f]{1,4}:){0,5}[0-9A-Fa-f]{1,4})?::[0-9A-Fa-f]{1,4}|(?:(?:[0-9A-Fa-f]{1,4}:){0,6}[0-9A-Fa-f]{1,4})?::)|[Vv][0-9A-Fa-f]+\\.[A-Za-z0-9\\-._~!$&'()*+,;=:]+)\\]|(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)|(?:[A-Za-z0-9\\-._~!$&'()*+,;=]|%[0-9A-Fa-f]{2})*))(?::([0-9]*))?((?:/(?:[A-Za-z0-9\\-._~!$&'()*+,;=:@]|%[0-9A-Fa-f]{2})*)*)|/((?:(?:[A-Za-z0-9\\-._~!$&'()*+,;=:@]|%[0-9A-Fa-f]{2})+(?:/(?:[A-Za-z0-9\\-._~!$&'()*+,;=:@]|%[0-9A-Fa-f]{2})*)*)?)|((?:[A-Za-z0-9\\-._~!$&'()*+,;=:@]|%[0-9A-Fa-f]{2})+(?:/(?:[A-Za-z0-9\\-._~!$&'()*+,;=:@]|%[0-9A-Fa-f]{2})*)*)|)(?:\\?((?:[A-Za-z0-9\\-._~!$&'()*+,;=:@/?]|%[0-9A-Fa-f]{2})*))?(?:\#((?:[A-Za-z0-9\\-._~!$&'()*+,;=:@/?]|%[0-9A-Fa-f]{2})*))?");
 104                                                 if (!document.getElementById('overwriteTopology').checked && document.getElementById('topologyName').value == "") {
 105                                                         vShowError("Please enter a name for the new topology.");
 106                                                 } else if (!document.getElementById('overwriteTopology').checked && (document.getElementById('topologyNamespace').value == "" || !validURIregexp.test(namespace))) {
 107                                                         vShowError("Please enter a valid name space for the new topology.");
 108                                                 }
 109                                                 else {
 110                                                         $('#enterCompletionInformationDiag').modal('hide');
 111
 112                                                         require(["winery-topologycompletion"], function(completer) {
 113                                                                 completer.complete(document.getElementById('overwriteTopology').checked,document.getElementById('openInNewWindow').checked,document.getElementById('topologyName').value, document.getElementById('topologyNamespace').value, document.getElementById('completionStyle').checked,
 114                                                                 "<%=repositoryURL%>", "<%=serviceTemplateName%>", "<%=topologyTemplateURL%>");
 115                                                         });
 116
 117                                                 }
 118                                         }
 119                                 </script>
 120                         </div>
 121                 </div>
 122         </div>
 123 </div>
 124
 125 <script>
 126         $(function() {
 127                 chooseRelationshipTemplateDiag = $('#chooseRelationshipTemplateDiag');
 128
 129                 chooseRelationshipTemplateDiag.on('show', function() {
 130                         $(this).find('form')[0].reset();
 131                 });
 132
 133                 chooseNodeTemplateDiag = $('#chooseNodeTemplateDiag');
 134
 135                 chooseNodeTemplateDiag.on('show', function() {
 136                         $(this).find('form')[0].reset();
 137                 });
 138
 139                 chooseNodeTemplateDiag.on('hidden.bs.modal', function () {
 140                         for (var i = 0; i < Connections.length; i++) {
 141                                 jsPlumb.detach(Connections[i]);
 142                         }
 143                         $(document.getElementById("nodeTemplateSelector")).remove();
 144                 });
 145
 146                 chooseTopologyDiag = $('#chooseTopologyDiag');
 147
 148                 chooseTopologyDiag.on('show', function() {
 149                         $(this).find('form')[0].reset();
 150                 });
 151
 152                 chooseTopologyDiag.on('hidden.bs.modal', function () {
 153                         for (var i = 0; i < Connections.length; i++) {
 154                                 jsPlumb.detach(Connections[i]);
 155                         }
 156                         $(document.getElementById("topologyTemplateSelector")).remove();
 157                 });
 158
 159                 enterCompletionInformationDiag = $('#enterCompletionInformationDiag');
 160
 161                 enterCompletionInformationDiag.on('show', function() {
 162                         $(this).find('form')[0].reset();
 163                 });
 164         });
 165
 166         /**
 167          * This function is invoked when the button "Complete Topology" is
 168          * selected. It will open a dialog to enter necessary information for the
 169          * completion.
 170          */
 171         function completeTopology() {
 172                 // show the dialog to enter information for the topology completion
 173                 enterCompletionInformationDiag.modal("show");
 174         }
 175 </script>