2 column picker WIP
[plstackapi.git] / planetstack / core / xoslib / templates / xosAdmin.html
1 <!-- Error and Success templates -->
2
3 <script type="text/template" id="xos-error-response">
4   <h5>Error</h5>
5   <table>
6   <tr><td>error:</td><td><%= error %></td></tr>
7   <tr><td>check:</td><td><%= specific_error %></td></tr>
8   </table>
9   <h5>Details:</h5>
10       <table>
11       <tbody>
12       <% _.each(reasons, function(element, index) { %>
13           <tr><td><%= index %></td><td><%= element %></td></tr>
14       <% }); %>
15       </tbody>
16       </table>
17 </script>
18
19 <script type="text/template" id="xos-error-rawresponse">
20   <h5>Error</h5>
21   <pre>The server returned:
22 "<%= responseText %>"</pre>
23 </script>
24
25 <script type="text/template" id="xos-error-template">
26   <button id="close-error-box">Close Error Message</button>
27   <h3>An error has occurred.</h3>
28   <table class="test-error-table">
29   <tr><td>Code:</td><td><%= status %></td></tr>
30   <tr><td>Message:</td><td><%= statusText %></td></tr>
31   </table>
32 </script>
33
34 <script type="text/template" id="xos-success-template">
35   <button id="close-success-box">Close Success Message</button>
36   <h3>Success!</h3>
37   <table class="test-success-table">
38   <tr><td>Code:</td><td><%= status %></td></tr>
39   <tr><td>Message:</td><td><%= statusText %></td></tr>
40   </table>
41 </script>
42
43 <script type="text/template" id="xos-navbutton-old">
44   <button class="btn btn-default btn-xosnav" onclick="<%= router %>.navigate('<%= routeUrl %>', {trigger: true})"><%= name %></button><br>
45 </script>
46
47 <script type="text/template" id="xos-status-template">
48   <div class="xos-status xos-<%= statusclass %>"><%= what %>: <%= statusText %> (<%= status %>)</div>
49 </script>
50
51 <script type="text/template" id="xos-tabs-template">
52   <ul class="xos-nav-list">
53   <% _.each(tabs, function(tab) { %>
54       <li class="xos-nav-item" id="xos-nav-<%= tab["region"] %>"><%= tab["name"] %></li>
55   <% }); %>
56   </ul>
57 </script>
58
59 <script type="text/template" id="xos-title-list">
60   <h3><img src="/static/img/brokencircle.gif" height=16 width=16 id="xos-list-title-spinner"> <%= title %></h3>
61 </script>
62
63 <script type="text/template" id="xos-title-detail">
64   <h3><%= title %></h3>
65 </script>
66
67 <script type="text/template" id="xos-navbutton">
68   <li>
69       <a href="<%= routeUrl %>">
70           <i class="<%= iconClass %>"></i>
71           <%= name %>
72       </a>
73   </li>
74 </script>
75
76 <script type="text/template" id="xos-inline-detail-buttons-template">
77     <tr>
78        <td colspan=2><button class="btn js-submit btn-xos-detail btn-xos-save-leave">Save</button>
79            <button class="btn js-submit btn-xos-detail btn-xos-save-continue">Save and Continue Editing</button>
80            <button class="btn js-submit btn-xos-detail btn-xos-save-another">Save and Add Another</button>
81            <button class="btn js-submit btn-xos-detail btn-xos-delete">Delete</button>
82        </td>
83     </tr>
84 </script>
85
86 <script type="text/template" id="xos-backend-status-icon-template">
87     <% if ((enacted) && (enacted >= updated)) { %>
88         <span style="min-width:16px;"><img src="/static/admin/img/icon_success.gif"></span>
89     <% } else { %>
90         <% if ((backend_status == "Provisioning in progress") || (!backend_status)) { %>
91             <span style="min-width:16px;" title="<%= _.escape(backend_status) %>"><img src="/static/admin/img/icon_clock.gif"></span>
92         <% } else { %>
93             <span style="min-width:16px;" title="<%= _.escape(backend_status) %>"><img src="/static/admin/img/icon_error.gif"></span>
94         <% } %>
95     <% } %>
96 </script>
97
98 <script type="text/template" id="xos-backend-status-text-template">
99     <%= xosBackendStatusIconTemplate.apply(this,arguments) %>
100     <% if ((enacted) && (enacted >= updated)) { %>
101         Successfully enacted
102     <% } else { %>
103         <%= _.escape(backend_status) %>
104     <% } %>
105 </script>
106
107 <script type="text/template" id="xos-list-header-template">
108     <button class="btn js-submit btn-xos-list btn-xos-add">Add</button>
109     <button class="btn js-submit btn-xos-list btn-xos-refresh">Refresh</button>
110 </script>
111
112 <script type="text/template" id="xos-list-footer-template">
113     <% if (addChildHash) { %>
114         <a href="<%= addChildHash %>">Add...</a>
115     <% } %>
116 </script>
117
118 <script type="text/template" id="xos-delete-button-template">
119     <a href="#delete<%= firstCharUpper(modelName) %>/<%= id %>">delete</a>
120 </script>
121
122 <script type="text/template" id="xos-detail-link-template">
123     <a href="#<%= collectionName %>/<%= id %>"><%= text %></a>
124 </script>
125
126 <script type="text/template" id="xos-add-template">
127   <h3 class="xos-detail-title">Add Object: <%= modelName %></h3>
128   <form>
129   <table>\r
130   <% args = arguments; %>\r
131   <% _.each(addFields, function(fieldName) { %>\r
132      <tr><td><%= fieldNameToHumanReadable(fieldName) %>:</td>\r
133         <% readOnly = $.inArray(fieldName, model.readOnlyFields)>=0 ? " readonly" : "";  %>\r
134         <% if (fieldName in foreignFields) { %>\r
135             <td><%= idToSelect(fieldName, model.attributes[fieldName], foreignFields[fieldName], "humanReadableName", readOnly) %></td>\r
136         <% } else if (inputType[fieldName] == "checkbox") { %>\r
137             <td><input type="checkbox" name="<%= fieldName %>" <% if (model.attributes[fieldName]) print("checked"); %><%= readOnly %>></td>\r
138         <% } else if (fieldName=="backend_status") { %>\r
139             <td><%= xosBackendStatusTextTemplate.apply(this, args) %></td>\r
140         <% } else { %>\r
141             <td><input type="text" name="<%= fieldName %>" value="<%= model.attributes[fieldName] %>"<%= readOnly %>></td>\r
142         <% } %>\r
143      </tr>\r
144   <% }); %>\r
145   <%= xosInlineDetailButtonsTemplate() %>\r
146   </table>\r
147   </form>\r
148 </script>
149
150 <script type="text/template" id="xos-detail-template">
151   <h3 class="xos-detail-title">Edit Object: <%= modelName %></h3>
152   <form>
153   <table>\r
154   <% args = arguments; %>\r
155   <% _.each(detailFields, function(fieldName) { %>\r
156      <tr><td><%= fieldNameToHumanReadable(fieldName) %>:</td>\r
157         <% readOnly = $.inArray(fieldName, model.readOnlyFields)>=0 ? " readonly" : "";  console.log(fieldName + " " + readOnly); console.log(model.readOnlyFields); %>\r
158         <% if (fieldName in foreignFields) { %>\r
159             <td><%= idToSelect(fieldName, model.attributes[fieldName], foreignFields[fieldName], "humanReadableName", readOnly) %></td>\r
160         <% } else if (inputType[fieldName] == "checkbox") { %>\r
161             <td><input type="checkbox" name="<%= fieldName %>" <% if (model.attributes[fieldName]) print("checked"); %><%= readOnly %>></td>\r
162         <% } else if (inputType[fieldName] == "picker") { %>\r
163             <% lookupFunc = makeIdToName(model.m2mFields[fieldName], "humanReadableName"); %>\r
164             <td><%= xosPickerTemplate({pickedItems: model.attributes[fieldName], unpickedItems: model.getChoices(fieldName,true), id: "picker_" + fieldName, detailView: detailView, lookupFunc: lookupFunc}) %></td>\r
165         <% } else if (fieldName=="backend_status") { %>\r
166             <td><%= xosBackendStatusTextTemplate.apply(this, args) %></td>\r
167         <% } else { %>\r
168             <td><input type="text" name="<%= fieldName %>" value="<%= model.attributes[fieldName] %>"<%= readOnly %>></td>\r
169         <% } %>\r
170      </tr>\r
171   <% }); %>\r
172   <%= xosInlineDetailButtonsTemplate() %>\r
173   </table>\r
174   </form>\r
175 </script>
176
177 <script type="text/template" id="xos-list-template">
178   <h3 class="xos-list-title"><%= title %></h3>
179   <%= xosListHeaderTemplate() %>
180   <table class="test-table">
181   <thead>
182   <tr>
183   <% _.each(listFields, function(fieldName) { %>
184       <th><%= fieldNameToHumanReadable(fieldName) %></th>
185   <% }); %>
186   <th>delete</th>
187   </tr></thead>
188   <tbody></tbody>
189   </table>
190   <%= xosListFooterTemplate({addChildHash: addChildHash}) %>
191 </script>
192
193 <script type="text/template" id="xos-listitem-template">
194   <% _.each(listFields, function(fieldName) { %>
195       <% if ($.inArray(fieldName, model.detailLinkFields)>=0) { %>
196           <td><%= xosDetailLinkTemplate({collectionName: collectionName, id: id, text: model.attributes[fieldName]}) %></td>
197       <% } else if (fieldName in foreignFields) { %>
198           <td><%= idToName(model.attributes[fieldName], foreignFields[fieldName], "humanReadableName") %></td>
199       <% } else { %>
200       <td><%= model.attributes[fieldName] %></td>
201       <% } %>
202   <% }); %>
203   <td><%= xosDeleteButtonTemplate({modelName: modelName, id: id}) %></td>
204 </script>
205
206 <script type="text/template" id="xos-savebuttons-template">
207   <div class="box save-box">
208     <button class="btn btn-high btn-info btn-xos-contentButtonPanel btn-xos-save-leave">Save</button>
209     <button class="btn btn-high btn-xos-contentButtonPanel btn-xos-save-continue">Save and continue editing</button>
210     <button class="btn btn-high btn-xos-contentButtonPanel btn-xos-save-another">Save and add another</button>
211     <button class="btn btn-danger btn-xos-contentButtonPanel btn-xos-delete">Delete</button>
212   </div>
213 </script>
214
215 <script type="text/template" id="xos-listbuttons-template">
216   <div class="box save-box">
217     <button class="btn btn-high btn-primary btn-xos-contentButtonPanel btn-xos-refresh">Refresh</button>
218     <button class="btn btn-high btn-success btn-xos-contentButtonPanel btn-xos-add">Add</button>
219   </div>
220 </script>
221
222
223 <script type="text/template" id="xos-picker-template">
224     <!-- arguments: unpickedItems, pickedItems -->
225     <div id="<%= id %>">
226     <div class="picker_row">
227     <div class="picker_column">\r
228     <div>Available</div>\r
229     <select name="pickerfrom" class="select-picker-from" multiple size="5">\r
230         <% _.each(unpickedItems, function(item) { %>\r
231            <option value="<%= item %>"><%= lookupFunc? lookupFunc(item) : item %></option>
232         <% });%>\r
233     </select>\r
234     </div>\r
235     <div class="picker_column">\r
236     <br>\r
237     <div class="btn btn-success btn-picker-add">Add &raquo;</div><br><br>\r
238     <div class="btn btn-success btn-picker-remove">&laquo; Remove</div>\r
239     </div>\r
240     <div class="picker_column">\r
241     <div>Selected</div>\r
242     <select name="pickerto" class="select-picker-to" multiple size="5">\r
243         <% _.each(pickedItems, function(item) { %>\r
244            <option value="<%= item %>"><%= lookupFunc ? lookupFunc(item) : item %></option>
245         <% }); %>\r
246     </select>\r
247     </div>\r
248     <div class="picker_column">\r
249     <br>\r
250     <div class="btn btn-success btn-picker-up">Up</div><br><br>\r
251     <div class="btn btn-success btn-picker-down">Down</div>\r
252     </div>\r
253     </div>
254     </div>
255     <% detailView.viewInitializers.push( function() { init_picker("#" + id); } ); %>
256 </script>
257
258 <script>
259 xosInlineDetailButtonsTemplate = _.template($("#xos-inline-detail-buttons-template").html());
260 xosListHeaderTemplate = _.template($("#xos-list-header-template").html());
261 xosListFooterTemplate = _.template($("#xos-list-footer-template").html());
262 xosDeleteButtonTemplate = _.template($("#xos-delete-button-template").html());
263 xosDetailLinkTemplate = _.template($("#xos-detail-link-template").html());
264 xosBackendStatusIconTemplate = _.template($("#xos-backend-status-icon-template").html());
265 xosBackendStatusTextTemplate = _.template($("#xos-backend-status-text-template").html());
266 xosPickerTemplate = _.template($("#xos-picker-template").html());
267 </script>
268