Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 1 | TestApp = new Marionette.Application(); |
| 2 | |
| 3 | TestApp.addRegions({ |
| 4 | deploymentList: "#deploymentList", |
| 5 | imageList: "#imageList", |
| 6 | networkTemplateList: "#networkTemplateList", |
| 7 | networkList: "#networkList", |
| 8 | nodeList: "#nodeList", |
| 9 | serviceList: "#serviceList", |
| 10 | siteList: "#siteList", |
| 11 | sliceList: "#sliceList", |
| 12 | sliverList: "#sliverList", |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 13 | userList: "#userList", |
| 14 | detail: "#detail" |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 15 | }); |
| 16 | |
| 17 | // ---- Deployment ---- |
| 18 | |
| 19 | TestApp.DeploymentListItemView = Marionette.ItemView.extend({ |
| 20 | template: '#test-deployment-listitem-template', |
| 21 | tagName: 'tr', |
| 22 | className: 'test-tablerow', |
| 23 | }); |
| 24 | |
| 25 | TestApp.DeploymentListView = Marionette.CompositeView.extend({ |
| 26 | childView: TestApp.DeploymentListItemView, |
| 27 | childViewContainer: 'tbody', |
| 28 | template: '#test-deployment-list-template', |
| 29 | |
| 30 | initialize: function() { |
| 31 | this.listenTo(this.collection, 'change', this._renderChildren) |
| 32 | }, |
| 33 | }); |
| 34 | |
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 35 | TestApp.hideError = function(result) { |
| 36 | $("#errorBox").hide(); |
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 37 | $("#successBox").hide(); |
| 38 | }; |
| 39 | |
| 40 | TestApp.showSuccess = function(result) { |
| 41 | $("#successBox").show(); |
| 42 | $("#successBox").html(_.template($("#test-success-template").html())(result)); |
| 43 | $('#close-success-box').unbind().bind('click', function() { |
| 44 | $('#successBox').hide(); |
| 45 | }); |
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 46 | }; |
| 47 | |
| 48 | TestApp.showError = function(result) { |
| 49 | $("#errorBox").show(); |
| 50 | $("#errorBox").html(_.template($("#test-error-template").html())(result)); |
| 51 | $('#close-error-box').unbind().bind('click', function() { |
| 52 | $('#errorBox').hide(); |
| 53 | }); |
| 54 | }; |
| 55 | |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 56 | TestApp.on("start", function() { |
Scott Baker | 6cea3a1 | 2014-10-28 15:06:54 -0700 | [diff] [blame] | 57 | var objs = ['deployment', 'image', 'networkTemplate', 'network', 'node', 'service', 'site', 'slice', 'sliver', 'user']; |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 58 | |
| 59 | for (var index in objs) { |
| 60 | name = objs[index]; |
| 61 | tr_template = '#test-' + name + '-listitem-template'; |
| 62 | table_template = '#test-' + name + '-list-template'; |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 63 | detail_template = '#test-' + name + '-detail-template'; |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 64 | collection_name = name + "s"; |
| 65 | region_name = name + "List"; |
| 66 | |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 67 | detailClass = Marionette.ItemView.extend({ |
| 68 | template: detail_template,
|
| 69 | tagName: 'div',
|
| 70 |
|
| 71 | events: {"click button.js-submit": "submitClicked",
|
| 72 | "change input": "inputChanged"},
|
| 73 |
|
| 74 | /* inputChanged is watching the onChange events of the input controls. We
|
| 75 | do this to track when this view is 'dirty', so we can throw up a warning
|
| 76 | if the user tries to change his slices without saving first.
|
| 77 | */
|
| 78 |
|
| 79 | inputChanged: function(e) {
|
| 80 | this.dirty = true;
|
| 81 | },
|
| 82 |
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 83 | saveError: function(model, result, xhr) {
|
| 84 | TestApp.showError(result);
|
| 85 | },
|
| 86 |
|
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 87 | saveSuccess: function(model, result, xhr) {
|
| 88 | TestApp.showSuccess({status: xhr.xhr.status, statusText: xhr.xhr.statusText});
|
| 89 | },
|
| 90 |
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 91 | submitClicked: function(e) {
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 92 | TestApp.hideError();
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 93 | e.preventDefault();
|
| 94 | var data = Backbone.Syphon.serialize(this);
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 95 | var thisView = this;
|
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 96 | this.model.save(data, {error: function(model, result, xhr) { thisView.saveError(model, result, xhr); },
|
| 97 | success: function(model, result, xhr) { thisView.saveSuccess(model, result, xhr); }});
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 98 | this.dirty = false;
|
| 99 | },
|
| 100 | }); |
| 101 | |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 102 | itemViewClass = Marionette.ItemView.extend({ |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 103 | detailClass: detailClass, |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 104 | template: tr_template, |
| 105 | tagName: 'tr', |
| 106 | className: 'test-tablerow', |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 107 | |
| 108 | events: {"click": "changeItem"}, |
| 109 |
|
| 110 | changeItem: function(e) {
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 111 | TestApp.hideError();
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 112 | e.preventDefault();
|
| 113 | e.stopPropagation();
|
| 114 |
|
| 115 | var detailView = new this.detailClass({
|
| 116 | model: this.model,
|
| 117 | });
|
| 118 | $('#detailBox').show();
|
| 119 | TestApp.detail.show(detailView);
|
| 120 | }, |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 121 | }); |
| 122 | |
| 123 | listViewClass = Marionette.CompositeView.extend({ |
| 124 | childView: itemViewClass, |
| 125 | childViewContainer: 'tbody', |
| 126 | template: table_template, |
| 127 | collection: xos[collection_name], |
| 128 | |
| 129 | initialize: function() { |
| 130 | this.listenTo(this.collection, 'change', this._renderChildren) |
| 131 | }, |
| 132 | }); |
| 133 | |
| 134 | var listView = new listViewClass(); |
| 135 | |
| 136 | TestApp[region_name].show(listView); |
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 137 | xos[collection_name].fetch(); //startPolling(); |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 138 | } |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 139 | |
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 140 | $('#close-detail-view').unbind().bind('click', function() { |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 141 | $('#detailBox').hide(); |
| 142 | }); |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 143 | }); |
| 144 | |
| 145 | $(document).ready(function(){ |
| 146 | TestApp.start();
|
| 147 | }); |
| 148 | |