source: trunk/grails-app/views/templateEditor/template.gsp @ 1425

Last change on this file since 1425 was 1175, checked in by robert@…, 12 years ago

The templateeditor is now capable of adding new items to a stringlist (that is in use), or adding new ontologies to a ontologyterm field that is in use. See ticket #74
  • Property svn:keywords set to Author Date Rev
File size: 4.9 KB
Line 
1<%
2        /**
3        * Template Editor overview template
4        *
5        * @author Jeroen Wesbeek
6        * @since 20100422
7        * @package wizard
8        * @see dbnp.studycapturing.TemplateEditorController
9        *
10        * Revision information:
11        * $Rev: 1175 $
12        * $Author: s.h.sikkema@gmail.com $
13        * $Date: 2010-11-19 10:51:09 +0000 (vr, 19 nov 2010) $
14        */
15%>
16<%@ page contentType="text/html;charset=UTF-8" %>
17<html>
18        <head>
19                <meta name="layout" content="${layout}"/>
20                <title>template editor</title>
21                <script src="${createLinkTo(dir: 'js', file: 'templateEditor.js')}" type="text/javascript"></script>
22                <link rel="stylesheet" href="${createLinkTo(dir: 'css', file: 'templateEditor.css')}" />
23                <g:if env="production">
24                        <script type="text/javascript" src="${resource(dir: 'js', file: 'jquery.ui.autocomplete.html.min.js')}"></script>
25                        <script type="text/javascript" src="${resource(dir: 'js', file: 'ontology-chooser.min.js')}"></script>
26                </g:if><g:else>
27                        <script type="text/javascript" src="${resource(dir: 'js', file: 'jquery.ui.autocomplete.html.js')}"></script>
28                  <script type="text/javascript" src="${resource(dir: 'js', file: 'ontology-chooser.js')}"></script>
29                </g:else>
30
31                <style type="text/css">
32                  #content .templateEditorStep { font-size: 0.8em; }
33                </style>
34        </head>
35        <body>
36
37                <script type="text/javascript">
38                        $(function() {
39                                // Enable sorting of template fields
40                                $("#selectedTemplateFields").sortable({
41                                        placeholder: 'ui-state-highlight',
42                                        items: 'li:not(.domain)',
43                                        cancel: '.empty, input, select, button, textarea, form, label',
44                                        connectWith: '.templateFields',
45                                        update: updateTemplateFieldPosition,
46                                        receive: addTemplateFieldEvent,
47                                        remove: removeTemplateFieldEvent,
48                                        start: savePosition
49                                });
50
51
52                                $("#availableTemplateFields").sortable({
53                                        placeholder: 'ui-state-highlight',
54                                        cancel: '.empty, input, select, button, textarea, form, label',
55                                        connectWith: '.templateFields',
56                                        start: savePosition
57                                });
58
59                                $("#ontologyDialog").dialog({
60                                  autoOpen: false,
61                                  title: 'Search for ontology',
62                                  height: 290,
63                                  width: 350,
64                                  modal: true,
65                                  buttons: {
66                                          'Add': addOntology,
67                                          Cancel: function() {
68                                                  $(this).dialog('close');
69                                          }
70                                  },
71                                  close: function() {
72                                  }
73
74                                });
75
76                        });
77                </script>
78               
79                <g:form action="template" name="templateChoice">
80                        <g:hiddenField name="entity" value="${encryptedEntity}" />
81                        <g:hiddenField name="ontologies" value="${ontologies}" />
82                        <input type="hidden" name="template" id="templateSelect" value="${template?.id}">
83                </g:form>
84
85                <g:if test="${template}">
86                        <div class="templateEditorStep" id="step2_selectedFields">
87                                <h3 class="templateName">${template.name} (<a class="switch" href="${createLink(action:'index',params: [ 'entity': encryptedEntity ] + extraparams )}">switch</a>)</h3>
88
89                                <p>Currently, this template contains the following fields. Drag fields to reorder. Drag fields to the list of available fields to remove the field from the template.</p>
90                                <ol id="domainFields" class="templateFields <g:if test="${template.inUse()}">inUse</g:if>">
91                                        <g:render template="elements/domainField" var="domainField" collection="${domainFields}" model="['template':template]"/>
92                                </ol>
93                                <ol id="selectedTemplateFields" class="templateFields <g:if test="${template.inUse()}">inUse</g:if>">
94                                        <g:render template="elements/selected" var="templateField" collection="${template.fields}" model="['template':template]"/>
95                                        <% /* NB: this empty field should always be the last in the list! */ %>
96                                        <li class="empty ui-state-default" <g:if test="${template.fields?.size() > 0 }">style='display: none;'</g:if>>This template does not yet contain any fields. Drag a field to this list or use the 'Add field button'.</li>
97                                </ol>
98                        </div>
99                        <div class="templateEditorStep" id="step3_availableFields">
100                                <h3>Available fields</h3>
101
102                                <p>These fields are available for adding to the template. Drag a field to the template to add it.</p>
103                                <ol id="availableTemplateFields" class="templateFields">
104                                        <g:render template="elements/available" var="templateField" collection="${allFields - template.fields}" />
105                                        <li class="empty ui-state-default" <g:if test="${allFields.size() > template.fields.size()}">style='display: none;'</g:if>>There are no additional fields that can be added. Use the 'Create new field' button to create new fields.</li>
106                                </ol>
107
108                                <div id="addNew">
109                                        <a href="#" onClick="showTemplateFieldForm( 'templateField_new' ); this.blur(); return false;">
110                                                <b>Create new field</b>
111                                        </a>
112
113                                        <form class="templateField_form" id="templateField_new_form" action="createField">
114                                                <g:render template="elements/fieldForm" model="['templateField': null, 'fieldTypes': fieldTypes, 'encryptedEntity': encryptedEntity, 'is_new': true]"/>
115                                        </form>
116                                </div>
117                        </div>
118                </g:if>
119                <br clear="all" />
120                <div id="ontologyDialog">
121                  <g:render template="ontologyDialog" />
122                </div>
123
124                <div id="wait" class="wait">
125                  &nbsp;
126                </div>
127                <div class="wait_text wait">
128                  <img src="<g:resource dir="images" file="spinner.gif" />"> Please wait
129                </div>
130                </body>
131</html>
Note: See TracBrowser for help on using the repository browser.