2 /*******************************************************************************
3 * Copyright (c) 2012-2013 University of Stuttgart.
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
11 * Uwe Breitenbücher - initial API and implementation and/or initial documentation
12 * Oliver Kopp - improvements to fit updated index.jsp
13 * Yves Schubert - switch to bootstrap 3
14 *******************************************************************************/
17 <%@tag language="java" pageEncoding="UTF-8" description="Renders the properies of one node tempate on the right"%>
19 <%@attribute name="repositoryURL" required="true" type="java.lang.String" description="The repository URL"%>
21 <%@taglib prefix="ct" tagdir="/WEB-INF/tags/common" %>
24 <link rel="stylesheet" href="css/propertiesview.css" />
26 <div id="NTPropertiesView" class="propertiesView" style="display: none;">
28 <div id="nodeTemplateInformationSection">
30 If this is layouted strangely, maybe a <form> wrapper has to be added
31 Be aware that nested buttons then trigger a submission of the form (-> ct:spinnerwithinphty)
34 <div class="form-group">
35 <label for="nodetemplateid">Id</label>
36 <input id="nodetemplateid" disabled="disabled" class="form-control"></input>
38 <div class="form-group">
39 <label for="nodetemplatename" class="control-label">Name</label>
40 <input id="nodetemplatename" name="name" class="form-control"/>
42 <div class="form-group">
43 <label for="nodetemplateType">Type</label>
44 <%-- filled by fillInformationSection --%>
45 <a id="nodetemplateType" target="_blank" href="#" class="form-control"></a>
47 <ct:spinnerwithinphty min="0" width="10" changedfunction="minInstancesChanged" label="min" id="minInstances" />
48 <ct:spinnerwithinphty min="1" width="10" changedfunction="maxInstancesChanged" label="max" id="maxInstances" withinphty="true" />
55 function minInstancesChanged(event, ui) {
57 if (ui === undefined) {
58 val = $("#minInstances").val();
65 function maxInstancesChanged(event, ui) {
67 if (ui === undefined) {
68 val = $("#maxInstances").val();
75 // the name input field of the properties section
76 var nameInput = $("#nodetemplatename");
78 // the min/max fields of the currently selected node template
82 function fillInformationSection(nodeTemplate) {
83 require(["winery-support-common"], function(wsc) {
84 // currently doesn't help for a delayed update
85 //informationSection.slideDown();
87 $("#nodetemplateid").val(nodeTemplate.attr("id"));
89 var headerContainer = nodeTemplate.children("div.headerContainer");
92 var nameField = headerContainer.children("div.name");
93 var name = nameField.text();
97 var typeQName = headerContainer.children("span.typeQName").text();
98 var href = wsc.makeNodeTypeURLFromQName("${repositoryURL}", typeQName);
99 var type = headerContainer.children("div.type").text();
100 $("#nodetemplateType").attr("href", href).text(type);
102 // we could use jQuery-typing, but it is not possible to replace key events there
103 nameInput.off("keyup");
104 nameInput.on("keyup", function() {
105 nameField.text($(this).val());
108 // handling of min and max
109 ntMin = nodeTemplate.children(".headerContainer").children(".minMaxInstances").children(".minInstances");
110 $("#minInstances").val(ntMin.text());
111 ntMax = nodeTemplate.children(".headerContainer").children(".minMaxInstances").children(".maxInstances");
112 $("#maxInstances").val(ntMax.text());
116 function showViewOnTheRight() {
117 $("#NTPropertiesView").fadeIn();
120 function hideViewOnTheRight() {
121 $("#NTPropertiesView").fadeOut();
125 winery.events.register(
126 winery.events.name.SELECTION_CHANGED,
128 // min/max instances do not lost focus if other shape is clicked
130 if ($("#minInstances").is(":focus")) {
131 minInstancesChanged();
133 if ($("#maxInstances").is(":focus")) {
134 maxInstancesChanged();
136 var nodeTemplate = $("div.NodeTemplateShape.selected");
137 var numSelected = nodeTemplate.length;
138 if (numSelected == 1) {
139 fillInformationSection(nodeTemplate);
140 showViewOnTheRight();
142 hideViewOnTheRight();