winery/org.eclipse.winery.topologymodeler/src/main/webapp/WEB-INF/tags/common/topologycompletion/nodeTemplateSelector.tag

   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 render Node and Relationship Templates for selection in a dialog."%>
  15
  16 <%-- attributes for the NodeTemplate selection --%>
  17 <%@attribute name="templateURL" type="java.lang.String"%>
  18 <%@attribute name="topologyName" type="java.lang.String"%>
  19 <%@attribute name="topologyNamespace" type="java.lang.String"%>
  20 <%@attribute name="repositoryURL" type="java.lang.String" %>
  21 <%@attribute name="stName" type="java.lang.String" %>
  22 <%@attribute name="choices" type="java.util.Map<org.eclipse.winery.model.tosca.TNodeTemplate, java.util.Map<org.eclipse.winery.model.tosca.TNodeTemplate, java.util.List<org.eclipse.winery.model.tosca.TEntityTemplate>>>"%>
  23
  24 <%@tag import="java.util.ArrayList"%>
  25 <%@tag import="java.util.HashMap"%>
  26 <%@tag import="java.util.List"%>
  27 <%@tag import="java.util.Map"%>
  28 <%@tag import="java.util.UUID"%>
  29 <%@tag import="javax.xml.namespace.QName"%>
  30 <%@tag import="org.eclipse.winery.model.tosca.TEntityTemplate"%>
  31 <%@tag import="org.eclipse.winery.model.tosca.TNodeTemplate"%>
  32 <%@tag import="org.eclipse.winery.model.tosca.TRelationshipTemplate"%>
  33 <%@tag import="org.eclipse.winery.model.tosca.TRelationshipType"%>
  34 <%@tag import="org.eclipse.winery.repository.client.WineryRepositoryClientFactory"%>
  35 <%@tag import="org.eclipse.winery.repository.client.IWineryRepositoryClient"%>
  36 <%@tag import="org.eclipse.winery.common.Util"%>
  37
  38 <%@taglib prefix="ntrq" tagdir="/WEB-INF/tags/common/templates/nodetemplates/reqscaps" %>
  39 <%@taglib prefix="nt"   tagdir="/WEB-INF/tags/common/templates/nodetemplates" %>
  40
  41 <div id="nodeTemplateSelector">
  42         <p> There are several possible Node Templates to be inserted. <br> Please select your desired NodeTemplate: </p>
  43
  44         <%
  45                 // the pixel distance between the displayed NodeTemplates
  46                 final int NODE_TEMPLATE_DISTANCE = 150;
  47
  48                 IWineryRepositoryClient client = WineryRepositoryClientFactory.getWineryRepositoryClient();
  49                 client.addRepository(repositoryURL);
  50
  51                 // instantiate  variables
  52                 Map<String, String> idMap = new HashMap<String, String>();
  53                 List<TRelationshipTemplate> possibleConnections = new ArrayList<TRelationshipTemplate>();
  54                 String sourceId = "";
  55                 String randomId = "";
  56                 String id = "";
  57
  58                 // a counter used for an ID
  59                 int counter = 0;
  60
  61                 // used for the position of the NodeTemplate in the EditorArea
  62                 int topCounter = 0;
  63         %>
  64         <script>
  65                 // array to collect the created IDs
  66                 IDs = new Array();
  67
  68                 // save all created connections in an array to be able to detach them after the selection
  69                 Connections = new Array();
  70         </script>
  71         <%
  72                 // render a topology for every choice to be displayed in the dialog
  73                 for (TNodeTemplate nt: choices.keySet()) {
  74
  75                         Map<TNodeTemplate, List<TEntityTemplate>> entityTemplates = choices.get(nt);
  76
  77                         for (TNodeTemplate choice: entityTemplates.keySet()) {
  78                                 id = "choice" + Integer.toString(counter);
  79
  80                                 %>
  81                                 <div id="proposalEditorArea">
  82                                 <div id="proposaldrawingarea">
  83                                 <%
  84
  85                                 topCounter = 0;
  86                         %>
  87                         <nt:nodeTemplateRenderer client="<%=client%>" relationshipTypes="<%=client.getAllTypes(TRelationshipType.class)%>" repositoryURL='<%=repositoryURL%>' nodeTemplate="<%=nt%>" top="<%=Integer.toString(topCounter)%>" left='<%="0"%>'/>
  88                         <script>
  89
  90                                 //Map IDs here. ID mapping is necessary to avoid conflict with the modelled NodeTemplates in the background.
  91                                 <%
  92                                         randomId = UUID.randomUUID().toString();
  93                                 %>
  94                                         document.getElementById("<%=nt.getId()%>").id = "<%=randomId%>";
  95                                         IDs.push("<%=randomId%>");
  96                                 <%
  97                                         idMap.put(nt.getId(), randomId);
  98                                 %>
  99                         </script>
 100                         <%
 101
 102                         topCounter = topCounter + NODE_TEMPLATE_DISTANCE;
 103                         %>
 104                         <!-- use the nodeTemplateRenderer tag to render NodeTemplates-->
 105                         <nt:nodeTemplateRenderer client="<%=client%>" relationshipTypes="<%=client.getAllTypes(TRelationshipType.class)%>" repositoryURL='<%=repositoryURL%>' nodeTemplate="<%=choice%>" top="<%=Integer.toString(topCounter)%>" left='<%="0"%>'/>
 106                         <script>
 107                             //Map IDs here
 108                                 <%
 109                                         randomId = UUID.randomUUID().toString();
 110                                 %>
 111                                         document.getElementById("<%=choice.getId()%>").id = "<%=randomId%>";
 112                                         IDs.push("<%=randomId%>");
 113                                 <%
 114                                         idMap.put(choice.getId(), randomId);
 115                                 %>
 116                         </script>
 117                         </div>
 118                         </div>
 119                         <% if (entityTemplates.get(choice).size() > 1) { %>
 120                                 <p> There are several possible Relationship Templates to connect the Node Templates <%=nt.getName()%> and <%=choice.getName()%>. Please choose at least one connection: </p>
 121                         <%}
 122                         for (TEntityTemplate rtChoice: entityTemplates.get(choice)) {
 123
 124                                 TRelationshipTemplate connector = (TRelationshipTemplate) rtChoice;
 125                                 if (entityTemplates.get(choice).size() > 1) {
 126                                 %>
 127                                         <input checked="checked" id="<%=connector.getName()%>" name="<%=connector.getName()%>" type="checkbox" value="<%=connector.getName()%>">        <%=connector.getName()%> <br/>
 128                                 <%
 129                                 }
 130                                 sourceId = ((TNodeTemplate) connector.getSourceElement().getRef()).getId();
 131                                 String targetId = ((TNodeTemplate) connector.getTargetElement().getRef()).getId();
 132                                 QName type = connector.getType();
 133                                 String visualSourceId = idMap.get(sourceId);
 134                                 String visualTargetId = idMap.get(targetId);
 135                                 %>
 136                                 <script>
 137                                         // connect the rendered NodeTemplates
 138                                         require(["winery-common-topologyrendering"], function(wct) {
 139                                                 wct.initNodeTemplate(jsPlumb.getSelector(".NodeTemplateShape:not('.hidden')"), true);
 140                                         });
 141                                         var c;
 142                                         require(["jsplumb"], function(_jsPlumb) {
 143                                                 _jsPlumb.ready(function() {
 144                                                         c = _jsPlumb.connect({
 145                                                                 source:"<%=visualSourceId%>",
 146                                                                 target:"<%=visualTargetId%>",
 147                                                                 endpoint:"Blank",
 148                                                                 type: "<%=type%>"
 149                                                         });
 150                                                         Connections.push(c);
 151                                                 })
 152                                         });
 153
 154                                 </script>
 155                         <%}
 156                 %>
 157                 <br>
 158                 <button type="button" class="btn btn-primary btn-default" data-dismiss="modal" id="<%=id%>" value='<%=choice.getName()%>' onclick="onSelected<%=choice.getName()%>()">Use Template: <%=choice.getName()%></button>
 159                 <script>
 160
 161                         /**
 162                          * Handles a click on the "Select" button.
 163                          *
 164                          * This selection handler method is created for every NodeTemplate that can be chosen by the user.
 165                          * This is realized by inserting the unique names of the NodeTemplate choices in the method name via JSP scriptlet.
 166                          */
 167                         function onSelected<%=choice.getName()%>() {
 168
 169                                 SelectedRTs = new Array();
 170
 171                                 for (var i = 0; i < Connections.length; i++) {
 172                                         jsPlumb.detach(Connections[i]);
 173                                 }
 174
 175                                 <%
 176                                 if (entityTemplates.get(choice).size() == 1) {
 177                                 %>
 178                                         SelectedRTs.push("<%=((TRelationshipTemplate) entityTemplates.get(choice).get(0)).getName()%>");
 179                                 <%
 180                                 } else if (entityTemplates.get(choice).size() > 1) {
 181                                         for (TEntityTemplate rtChoice: entityTemplates.get(choice)) {
 182                                         TRelationshipTemplate connector = (TRelationshipTemplate) rtChoice;
 183                                         %>
 184                                         if (document.getElementById("<%=connector.getName()%>").checked) {
 185                                                 SelectedRTs.push(document.getElementById("<%=connector.getName()%>").value);
 186                                         }
 187                                 <%
 188                                 }}
 189                                 %>
 190                                 SelectedItems = new Array();
 191                                 SelectedItems.push(document.getElementById("<%=id%>").value);
 192
 193                                 if (SelectedItems.length == 0) {
 194                                         vShowError("Please selected at least one Relationship Template.");
 195                                 } else {
 196                                         // add the selected Templates to the topology and restart the completion
 197                                         var selectedNodeTemplates = JSON.stringify(SelectedItems);
 198                                         var selectedRelationshipTemplates = JSON.stringify(SelectedRTs);
 199                                         $.post("jsp/topologyCompletion/selectionHandler.jsp", {topology: topology, allChoices: choices, selectedNodeTemplates: selectedNodeTemplates, selectedRelationshipTemplates: selectedRelationshipTemplates},
 200                                                 function(data){
 201                                                         require(["winery-topologycompletion"], function(completer) {
 202                                                                 completer.restartCompletion(data, document.getElementById('overwriteTopology').checked,document.getElementById('openInNewWindow').checked,
 203                                                                         document.getElementById('topologyName').value, document.getElementById('topologyNamespace').value, true, "<%=stName%>",
 204                                                                         "<%=templateURL%>", "<%=repositoryURL%>");
 205                                                         });
 206                                                 }
 207                                         );
 208                                 }
 209                         }
 210                 </script>
 211                 <%
 212                 counter++;
 213                 }
 214         }%>
 215         <br>
 216         <br>
 217         <br>
 218         <button type="button" class="btn btn-primary btn-default" data-dismiss="modal" id="cancel" onclick="onSelectedCancel()">Cancel Automatic Completion</button>
 219         <p><i> Press this button if you want to continue the completion manually.</i> </p>
 220         <script>
 221                 // save topology and refresh the page
 222                 function onSelectedCancel() {
 223                         $.post("jsp/topologyCompletion/topologySaver.jsp", {topology: topology, templateURL: "<%=templateURL%>", repositoryURL: "<%=repositoryURL%>", topologyName: "<%=topologyName%>", topologyNamespace: "<%=topologyNamespace%>", overwriteTopology: "true"},
 224                                 function(callback){
 225                                         document.location.reload(true);
 226                                 }
 227                         );
 228                 }
 229         </script>
 230 </div>