cc539cec1ba41019412be704fbb50fef87cf7b81
[plstackapi.git] / planetstack / core / xoslib / dashboards / test.html
1 <script src="{{ STATIC_URL }}/js/vendor/underscore-min.js"></script>
2 <script src="{{ STATIC_URL }}/js/vendor/backbone.js"></script>
3 <script src="{{ STATIC_URL }}/js/vendor/backbone.syphon.js"></script>
4 <script src="{{ STATIC_URL }}/js/vendor/backbone.wreqr.js"></script>
5 <script src="{{ STATIC_URL }}/js/vendor/backbone.babysitter.js"></script>
6 <script src="{{ STATIC_URL }}/js/vendor/backbone.marionette.js"></script>
7
8 <link rel="stylesheet" type="text/css" href="{% static 'css/test.css' %}" media="all" >
9
10 <script src="{{ STATIC_URL }}/js/xoslib/xos-backbone.js"></script>
11 <script src="{{ STATIC_URL }}/js/test.js"></script>
12
13 <p>This shows all of the things you can see using xosLib</p>
14
15 <div id="deploymentList">
16 </div>
17
18 <div id="imageList">
19 </div>
20
21 <div id="networkTemplateList">
22 </div>
23
24 <div id="networkList">
25 </div>
26
27 <div id="nodeList">
28 </div>
29
30 <div id="serviceList">
31 </div>
32
33 <div id="siteList">
34 </div>
35
36 <div id="sliceList">
37 </div>
38
39 <div id="sliverList">
40 </div>
41
42 <div id="userList">
43 </div>
44
45 <div id="rightSide">
46 <div id="successBox">
47 </div>
48 <div id="errorBox">
49 </div>
50
51 <div id="detailBox">
52 <button id="close-detail-view">Close Detail View</button>
53 <div id="detail"></div>\r
54 <div id="linkedObjs1"></div>
55 <div id="linkedObjs2"></div>
56 <div id="linkedObjs3"></div>
57 <div id="linkedObjs4"></div>
58 </div>
59 </div>
60
61 <script type="text/template" id="test-error-template">
62   <button id="close-error-box">Close Error Message</button>
63   <h3>An error has occurred.</h3>
64   <table class="test-error-table">
65   <tr><td>Code:</td><td><%= status %></td></tr>
66   <tr><td>Message:</td><td><%= statusText %></td></tr>
67   </table>
68 </script>
69
70 <script type="text/template" id="test-success-template">
71   <button id="close-success-box">Close Success Message</button>
72   <h3>Success!</h3>
73   <table class="test-success-table">
74   <tr><td>Code:</td><td><%= status %></td></tr>
75   <tr><td>Message:</td><td><%= statusText %></td></tr>
76   </table>
77 </script>
78
79 <!-- Deployment -->
80
81 <script type="text/template" id="test-deployment-list-template">
82   <h3><%= title %></h3>
83   <table class="test-table">
84   <thead><tr>
85      <th>id</th>
86      <th>name</th>
87      <th>backend</th>
88      <th>admin_tenant</th>
89      <th># sites</th>
90   </tr></thead>
91   <tbody></tbody>
92   </table>
93 </script>
94
95
96 <script type="text/template" id="test-deployment-listitem-template">
97   <td class="objectLink"><%= id %></td>
98   <td class="objectLink"><%= name %></td>
99   <td><%= backend_type %></td>
100   <td><%= admin_tenant %></td>
101   <td><%= sites.length %></td>
102 </script>
103
104 <script type="text/template" id="test-deployment-detail-template">
105   <h3>Detail View: Deployment</h3>
106   <form>\r
107   <table>\r
108   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
109   <tr><td>Backend:</td><td><input type="text" name="backend_type" value="<%= backend_type %>"></td></tr>\r
110   <tr><td>Admin Tenant:</td><td><input type="text" name="admin_tenant" value="<%= admin_tenant %>"></td></tr>\r
111   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
112   </table>\r
113   </form>\r
114 </script>
115
116 <!-- Image -->
117
118 <script type="text/template" id="test-image-list-template">
119   <h3><%= title %></h3>
120   <table class="test-table">
121   <thead><tr>
122      <th>id</th>
123      <th>name</th>
124      <th>disk_format</th>
125      <th>container_format</th>
126      <th>path</th>
127   </tr></thead>
128   <tbody></tbody>
129   </table>
130 </script>
131
132 <script type="text/template" id="test-image-listitem-template">
133   <td class="objectLink"><%= id %></td>
134   <td class="objectLink"><%= name %></td>
135   <td><%= disk_format %></td>
136   <td><%= container_format %></td>
137   <td><%= path %></td>
138 </script>
139
140 <script type="text/template" id="test-image-detail-template">
141   <h3>Detail View: Image</h3>
142   <form>\r
143   <table>\r
144   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
145   <tr><td>Disk Format:</td><td><input type="text" name="backend_type" value="<%= disk_format %>"></td></tr>\r
146   <tr><td>Container Format:</td><td><input type="text" name="admin_tenant" value="<%= container_format %>"></td></tr>\r
147   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
148   </table>\r
149   </form>\r
150 </script>
151
152 <!-- NetworkTemplate -->
153
154 <script type="text/template" id="test-networkTemplate-list-template">
155   <h3><%= title %></h3>
156   <table class="test-table">
157   <thead><tr>
158      <th>id</th>
159      <th>name</th>
160      <th>description</th>
161      <th>visibility</th>
162      <th>translation</th>
163      <th>sharedNetworkName</th>
164      <th>sharedNetworkId</th>
165   </tr></thead>
166   <tbody></tbody>
167   </table>
168 </script>
169
170
171 <script type="text/template" id="test-networkTemplate-listitem-template">
172   <td class="objectLink"><%= id %></td>
173   <td class="objectLink"><%= name %></td>
174   <td><%= description %></td>
175   <td><%= visibility %></td>
176   <td><%= translation %></td>
177   <td><%= sharedNetworkName %></td>
178   <td><%= sharedNetworkId %></td>
179 </script>
180
181 <script type="text/template" id="test-networkTemplate-detail-template">
182   <h3>Detail View: NetworkTemplate</h3>
183   <form>\r
184   <table>\r
185   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
186   <tr><td>description:</td><td><input type="text" name="description" value="<%= description %>"></td></tr>\r
187   <tr><td>Visibility:</td><td><input type="text" name="visibility" value="<%= visibility %>"></td></tr>\r
188   <tr><td>Translation:</td><td><input type="text" name="translation" value="<%= translation %>"></td></tr>\r
189   <tr><td>Shared Network Name:</td><td><input type="text" name="sharedNetworkName" value="<%= sharedNetworkName %>"></td></tr>\r
190   <tr><td>Shared Network Id:</td><td><input type="text" name="sharedNetworkId" value="<%= sharedNetworkId %>"></td></tr>\r
191   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
192   </table>\r
193   </form>\r
194 </script>
195
196 <!-- Network -->
197
198 <script type="text/template" id="test-network-list-template">
199   <h3><%= title %></h3>
200   <table class="test-table">
201   <thead><tr>
202      <th>id</th>
203      <th>name</th>
204      <th>template</th>
205      <th>ports</th>
206      <th>labels</th>
207      <th>owner</th>
208   </tr></thead>
209   <tbody></tbody>
210   </table>
211 </script>
212
213 <script type="text/template" id="test-network-listitem-template">
214   <td class="objectLink"><%= id %></td>
215   <td class="objectLink"><%= name %></td>
216   <td><%= template %></td>
217   <td><%= ports %></td>
218   <td><%= labels %></td>
219   <td><%= idToName(owner,"slivers","name") %></td>
220 </script>
221
222 <script type="text/template" id="test-network-detail-template">
223   <h3>Detail View: Network</h3>
224   <form>\r
225   <table>\r
226   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
227   <tr><td>Template:</td><td><input type="text" name="template" value="<%= template %>"></td></tr>\r
228   <tr><td>Ports:</td><td><input type="text" name="ports" value="<%= ports %>"></td></tr>\r
229   <tr><td>Labels:</td><td><input type="text" name="labels" value="<%= labels %>"></td></tr>\r
230   <tr><td>Owner:</td><td><input type="text" name="owner" value="<%= owner %>"></td></tr>\r
231   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
232   </table>\r
233   </form>\r
234 </script>
235
236 <!-- NetworkSliver -->
237
238 <script type="text/template" id="test-networkSliver-list-template">
239   <h3><%= title %></h3>
240   <table class="test-table">
241   <thead><tr>
242      <th>id</th>
243      <th>network</th>
244      <th>sliver</th>
245      <th>ip</th>
246      <th>port_id</th>
247   </tr></thead>
248   <tbody></tbody>
249   </table>
250 </script>
251
252 <script type="text/template" id="test-networkSliver-listitem-template">
253   <td class="objectLink"><%= id %></td>
254   <td><%= idToName(network,"networks","name") %></td>
255   <td><%= idToName(sliver,"slivers","name") %></td>
256   <td><%= ip %></td>
257   <td><%= port_id %></td>
258 </script>
259
260 <script type="text/template" id="test-networkSliver-detail-template">
261   <h3>Detail View: Network</h3>
262   <form>\r
263   <table>\r
264   <tr><td>Network:</td><td><input type="text" name="network" value="<%= network %>"></td></tr>\r
265   <tr><td>Sliver:</td><td><input type="text" name="sliver" value="<%= sliver %>"></td></tr>\r
266   <tr><td>Ip:</td><td><input type="text" name="ip" value="<%= ip %>"></td></tr>\r
267   <tr><td>Port_id:</td><td><input type="text" name="port_id" value="<%= port_id %>"></td></tr>\r
268   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
269   </table>\r
270   </form>\r
271 </script>
272
273 <!-- Node -->
274
275 <script type="text/template" id="test-node-list-template">
276   <h3><%= title %></h3>
277   <table class="test-table">
278   <thead><tr>
279      <th>id</th>
280      <th>name</th>
281      <th>site</th>
282      <th>deployment</th>
283   </tr></thead>
284   <tbody></tbody>
285   </table>
286 </script>
287
288
289 <script type="text/template" id="test-node-listitem-template">
290   <td class="objectLink"><%= id %></td>
291   <td class="objectLink"><%= name %></td>
292   <td><%= idToName(site,"sites","name") %></td>
293   <td><%= idToName(deployment,"deployments","name") %></td>
294 </script>
295
296 <script type="text/template" id="test-node-detail-template">
297   <h3>Detail View: Node</h3>
298   <form>\r
299   <table>\r
300   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
301   <tr><td>Site:</td><td><input type="text" name="site" value="<%= site %>"></td></tr>\r
302   <tr><td>Deployment:</td><td><input type="text" name="deployment" value="<%= deployment %>"></td></tr>\r
303   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
304   </table>\r
305   </form>\r
306 </script>
307
308 <!-- SliceRole -->
309
310 <script type="text/template" id="test-sliceRole-list-template">
311   <h3><%= title %></h3>
312   <table class="test-table">
313   <thead><tr>
314      <th>id</th>
315      <th>role</th>
316   </tr></thead>
317   <tbody></tbody>
318   </table>
319 </script>
320
321
322 <script type="text/template" id="test-sliceRole-listitem-template">
323   <td class="objectLink"><%= id %></td>
324   <td><%= role %></td>
325 </script>
326
327 <script type="text/template" id="test-sliceRole-detail-template">
328   <h3>Detail View: Service</h3>
329   <form>\r
330   <table>\r
331   <tr><td>Role:</td><td><input type="text" name="role" value="<%= role %>"></td></tr>\r
332   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
333   </table>\r
334   </form>\r
335 </script>
336
337 <!-- Service -->
338
339 <script type="text/template" id="test-service-list-template">
340   <h3><%= title %></h3>
341   <table class="test-table">
342   <thead><tr>
343      <th>id</th>
344      <th>name</th>
345      <th>description</th>
346      <th>enabled</th>
347      <th>versionNumber</th>
348      <th>published</th>
349   </tr></thead>
350   <tbody></tbody>
351   </table>
352 </script>
353
354
355 <script type="text/template" id="test-service-listitem-template">
356   <td class="objectLink"><%= id %></td>
357   <td class="objectLink"><%= name %></td>
358   <td><%= description %></td>
359   <td><%= enabled %></td>
360   <td><%= versionNumber %></td>
361   <td><%= published %></td>
362 </script>
363
364 <script type="text/template" id="test-service-detail-template">
365   <h3>Detail View: Service</h3>
366   <form>\r
367   <table>\r
368   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
369   <tr><td>description:</td><td><input type="text" name="description" value="<%= description %>"></td></tr>\r
370   <tr><td>Version Number:</td><td><input type="text" name="versionNumber" value="<%= versionNumber %>"></td></tr>\r
371   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
372   </table>\r
373   </form>\r
374 </script>
375
376 <!-- Site -->
377
378 <script type="text/template" id="test-site-list-template">
379   <h3><%= title %></h3>
380   <table class="test-table">
381   <thead><tr>
382      <th>id</th>
383      <th>name</th>
384      <th>url</th>
385      <th>enabled</th>
386      <th>login_base</th>
387      <th>is_public</th>
388      <th>abbreviated_name</th>
389   </tr></thead>
390   <tbody></tbody>
391   </table>
392 </script>
393
394 <script type="text/template" id="test-site-listitem-template">
395   <td class="objectLink"><%= id %></td>
396   <td class="objectLink"><%= name %></td>
397   <td><%= site_url %></td>
398   <td><%= enabled %></td>
399   <td><%= login_base %></td>
400   <td><%= is_public %></td>
401   <td><%= abbreviated_name %></td>
402 </script>
403
404 <script type="text/template" id="test-site-detail-template">
405   <h3>Detail View: Site</h3>
406   <form>\r
407   <table>\r
408   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
409   <tr><td>url:</td><td><input type="text" name="site_url" value="<%= site_url %>"></td></tr>\r
410   <tr><td>login_base:</td><td><input type="text" name="login_base" value="<%= login_base %>"></td></tr>\r
411   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
412   </table>\r
413   </form>\r
414 </script>
415
416 <!-- Slice -->
417
418 <script type="text/template" id="test-slice-list-template">
419   <h3><%= title %></h3>
420   <table class="test-table">
421   <thead><tr>
422      <th>id</th>
423      <th>name</th>
424      <th>enabled</th>
425      <th>omf_friendly</th>
426      <th>description</th>
427      <th>slice_url</th>
428      <th>site</th>
429      <th>max_slivers</th>
430      <th>service</th>
431   </tr></thead>
432   <tbody></tbody>
433   </table>
434 </script>
435
436 <script type="text/template" id="test-slice-listitem-template">
437   <td class="objectLink"><%= id %></td>
438   <td class="objectLink"><%= name %></td>
439   <td><%= enabled %></td>
440   <td><%= omf_friendly %></td>
441   <td><%= description %></td>
442   <td><%= slice_url %></td>
443   <td><%= idToName(site,"sites","name") %></td>
444   <td><%= max_slivers %></td>
445   <td><%= idToName(service,"services","name") %></td>
446 </script>
447
448 <script type="text/template" id="test-slice-detail-template">
449   <h3>Detail View: Slice</h3>
450   <form>\r
451   <table>\r
452   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
453   <tr><td>Enabled:</td><td><input type="checkbox" name="enabled" <% if (enabled) print("checked"); %>></td></tr>\r
454   <tr><td>Description:</td><td><input type="text" name="description" value="<%= description %>"></td></tr>\r
455   <tr><td>Url:</td><td><input type="text" name="slice_url" value="<%= slice_url %>"></td></tr>\r
456   <tr><td>Max Slivers:</td><td><input type="text" name="max_slivers" value="<%= max_slivers %>"></td></tr>\r
457   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
458   </table>\r
459   </form>\r
460 </script>
461
462 <!-- SlicDeployment -->
463
464 <script type="text/template" id="test-sliceDeployment-list-template">
465   <h3><%= title %></h3>
466   <table class="test-table">
467   <thead><tr>
468      <th>id</th>
469      <th>slice</th>
470      <th>deployment</th>
471      <th>tenant_id</th>
472   </tr></thead>
473   <tbody></tbody>
474   </table>
475 </script>
476
477 <script type="text/template" id="test-sliceDeployment-listitem-template">
478   <td class="objectLink"><%= id %></td>
479   <td><%= idToName(slice,"slices","name") %></td>
480   <td><%= idToName(deployment,"deployments","name") %></td>
481   <td><%= tenant_id %></td>
482 </script>
483
484 <script type="text/template" id="test-sliceDeployment-detail-template">
485   <h3>Detail View: Slice Deployment</h3>
486   <form>\r
487   <table>\r
488   <tr><td>Slice:</td><td><input type="text" name="slice" value="<%= slice %>"></td></tr>\r
489   <tr><td>Deployment:</td><td><input type="text" name="deployment" value="<%= deployment %>"></td></tr>\r
490   <tr><td>Tenant Id:</td><td><input type="text" name="tenant_id" value="<%= tenant_id %>"></td></tr>\r
491   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
492   </table>\r
493   </form>\r
494 </script>
495
496 <!-- SlicePrivilege -->
497
498 <script type="text/template" id="test-slicePrivilege-list-template">
499   <h3><%= title %></h3>
500   <table class="test-table">
501   <thead><tr>
502      <th>id</th>
503      <th>user</th>
504      <th>slice</th>
505      <th>role</th>
506   </tr></thead>
507   <tbody></tbody>
508   </table>
509 </script>
510
511 <script type="text/template" id="test-slicePrivilege-listitem-template">
512   <td class="objectLink"><%= id %></td>
513   <td><%= idToName(user,"users","username") %></td>
514   <td><%= idToName(slice,"slices","name") %></td>
515   <td><%= idToName(role,"sliceRoles","role") %></td>
516 </script>
517
518 <script type="text/template" id="test-slicePrivilege-detail-template">
519   <h3>Detail View: Slice Privilege</h3>
520   <form>\r
521   <table>\r
522   <tr><td>User:</td><td><input type="text" name="user" value="<%= user %>"></td></tr>\r
523   <tr><td>Slice:</td><td><input type="text" name="slice" value="<%= slice %>"></td></tr>\r
524   <tr><td>Role:</td><td><input type="text" name="role" value="<%= role %>"></td></tr>\r
525   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
526   </table>\r
527   </form>\r
528 </script>
529
530 <!-- Sliver -->
531
532 <script type="text/template" id="test-sliver-list-template">
533   <h3><%= title %></h3>
534   <table class="test-table">
535   <thead><tr>
536      <th>id</th>
537      <th>name</th>
538      <th>instance_id</th>
539      <th>instance_name</th>
540      <th>image</th>
541      <th>creator</th>
542      <th>slice</th>
543      <th>node</th>
544      <th>deploymentNetwork</th>
545      <th>flavor</th>
546      <th>userData</th>
547   </tr></thead>
548   <tbody></tbody>
549   </table>
550 </script>
551
552
553 <script type="text/template" id="test-sliver-listitem-template">
554   <td class="objectLink"><%= id %></td>
555   <td class="objectLink"><%= name %></td>
556   <td><%= instance_id %></td>
557   <td><%= instance_name %></td>
558   <td><%= idToName(image,"images","name") %></td>
559   <td><%= idToName(creator,"users","name") %></td>
560   <td><%= idToName(slice,"slices","name") %></td>
561   <td><%= idToName(node,"nodes","name") %></td>
562   <td><%= idToName(deploymentNetwork,"deployments","name") %></td>
563   <td><%= flavor %></td>
564   <td><%= userData %></td>
565 </script>
566
567 <script type="text/template" id="test-sliver-detail-template">
568   <h3>Detail View: Sliver</h3>
569   <form>\r
570   <table>\r
571   <tr><td>Name:</td><td><input type="text" name="name" value="<%= name %>"></td></tr>\r
572   <tr><td>instance_id:</td><td><input type="text" name="instance_id" value="<%= instance_id %>"></td></tr>\r
573   <tr><td>instance_name:</td><td><input type="text" name="instance_name" value="<%= instance_name %>"></td></tr>\r
574   <tr><td>Image:</td><td><input type="text" name="image" value="<%= image %>"></td></tr>\r
575   <tr><td>Creator:</td><td><input type="text" name="creator" value="<%= creator %>"></td></tr>\r
576   <tr><td>Slice:</td><td><input type="text" name="slice" value="<%= slice %>"></td></tr>\r
577   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
578   </table>\r
579   </form>\r
580 </script>
581
582 <!-- User -->
583
584 <script type="text/template" id="test-user-list-template">
585   <h3><%= title %></h3>
586   <table class="test-table">
587   <thead><tr>
588      <th>id</th>
589      <th>username</th>
590      <th>firstname</th>
591      <th>lastname</th>
592      <th>phone</th>
593      <th>user_url</th>
594      <th>site</th>
595   </tr></thead>
596   <tbody></tbody>
597   </table>
598 </script>
599
600
601 <script type="text/template" id="test-user-listitem-template">
602   <td class="objectLink"><%= id %></td>
603   <td class="objectLink"><%= username %></td>
604   <td><%= firstname %></td>
605   <td><%= lastname %></td>
606   <td><%= phone %></td>
607   <td><%= user_url %></td>
608   <td><%= site %></td>
609 </script>
610
611 <script type="text/template" id="test-user-detail-template">
612   <h3>Detail View: User</h3>
613   <form>\r
614   <table>\r
615   <tr><td>User Name:</td><td><input type="text" name="username" value="<%= username %>"></td></tr>\r
616   <tr><td>First Name:</td><td><input type="text" name="firstname" value="<%= firstname %>"></td></tr>\r
617   <tr><td>Last Name:</td><td><input type="text" name="lastname" value="<%= lastname %>"></td></tr>\r
618   <tr><td>Phone:</td><td><input type="text" name="phone" value="<%= phone %>"></td></tr>\r
619   <tr><td>Url:</td><td><input type="text" name="user_url" value="<%= user_url %>"></td></tr>\r
620   <tr><td>Site:</td><td><input type="text" name="site" value="<%= site %>"></td></tr>\r
621   <tr><td colspan=2><button class="btn js-submit">Save</button></td></tr>\r
622   </table>\r
623   </form>\r
624 </script>
625
626 </script>
627