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", |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 14 | detail: "#detail", |
| 15 | linkedObjs1: "#linkedObjs1", |
| 16 | linkedObjs2: "#linkedObjs2", |
| 17 | linkedObjs3: "#linkedObjs3", |
| 18 | linkedObjs4: "#linkedObjs4" |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 19 | }); |
| 20 | |
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 21 | TestApp.hideError = function(result) { |
| 22 | $("#errorBox").hide(); |
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 23 | $("#successBox").hide(); |
| 24 | }; |
| 25 | |
| 26 | TestApp.showSuccess = function(result) { |
| 27 | $("#successBox").show(); |
| 28 | $("#successBox").html(_.template($("#test-success-template").html())(result)); |
| 29 | $('#close-success-box').unbind().bind('click', function() { |
| 30 | $('#successBox').hide(); |
| 31 | }); |
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 32 | }; |
| 33 | |
| 34 | TestApp.showError = function(result) { |
| 35 | $("#errorBox").show(); |
| 36 | $("#errorBox").html(_.template($("#test-error-template").html())(result)); |
| 37 | $('#close-error-box').unbind().bind('click', function() { |
| 38 | $('#errorBox').hide(); |
| 39 | }); |
| 40 | }; |
| 41 | |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 42 | idToName = function(id, collectionName, fieldName) { |
| 43 | linkedObject = xos[collectionName].get(id); |
| 44 | if (linkedObject == undefined) { |
| 45 | return "#" + id; |
| 46 | } else { |
| 47 | return linkedObject.attributes[fieldName]; |
| 48 | } |
| 49 | }; |
| 50 | |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 51 | TestApp.on("start", function() { |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 52 | var objs = ['deployment', 'image', 'networkTemplate', 'network', 'networkSliver', 'node', 'service', 'site', 'slice', 'sliceDeployment', 'slicePrivilege', 'sliver', 'user', 'sliceRole']; |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 53 | |
| 54 | for (var index in objs) { |
| 55 | name = objs[index]; |
| 56 | tr_template = '#test-' + name + '-listitem-template'; |
| 57 | table_template = '#test-' + name + '-list-template'; |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 58 | detail_template = '#test-' + name + '-detail-template'; |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 59 | collection_name = name + "s"; |
| 60 | region_name = name + "List"; |
| 61 | |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 62 | detailClass = Marionette.ItemView.extend({ |
| 63 | template: detail_template,
|
| 64 | tagName: 'div',
|
| 65 |
|
| 66 | events: {"click button.js-submit": "submitClicked",
|
| 67 | "change input": "inputChanged"},
|
| 68 |
|
| 69 | /* inputChanged is watching the onChange events of the input controls. We
|
| 70 | do this to track when this view is 'dirty', so we can throw up a warning
|
| 71 | if the user tries to change his slices without saving first.
|
| 72 | */
|
| 73 |
|
| 74 | inputChanged: function(e) {
|
| 75 | this.dirty = true;
|
| 76 | },
|
| 77 |
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 78 | saveError: function(model, result, xhr) {
|
| 79 | TestApp.showError(result);
|
| 80 | },
|
| 81 |
|
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 82 | saveSuccess: function(model, result, xhr) {
|
| 83 | TestApp.showSuccess({status: xhr.xhr.status, statusText: xhr.xhr.statusText});
|
| 84 | },
|
| 85 |
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 86 | submitClicked: function(e) {
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 87 | TestApp.hideError();
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 88 | e.preventDefault();
|
| 89 | var data = Backbone.Syphon.serialize(this);
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 90 | var thisView = this;
|
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 91 | this.model.save(data, {error: function(model, result, xhr) { thisView.saveError(model, result, xhr); },
|
| 92 | success: function(model, result, xhr) { thisView.saveSuccess(model, result, xhr); }});
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 93 | this.dirty = false;
|
| 94 | },
|
| 95 | }); |
| 96 | |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 97 | itemViewClass = Marionette.ItemView.extend({ |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 98 | detailClass: detailClass, |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 99 | template: tr_template, |
| 100 | tagName: 'tr', |
| 101 | className: 'test-tablerow', |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 102 | |
| 103 | events: {"click": "changeItem"}, |
| 104 |
|
| 105 | changeItem: function(e) {
|
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 106 | TestApp.hideError();
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 107 | e.preventDefault();
|
| 108 | e.stopPropagation();
|
| 109 |
|
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 110 | index=0;
|
| 111 | for (relatedName in this.model.collection.relatedCollections) {
|
| 112 | relatedField = this.model.collection.relatedCollections[relatedName];
|
| 113 |
|
| 114 | relatedListViewClass = TestApp[relatedName + "ListView"].extend({collection: xos[relatedName].filterBy(relatedField,this.model.id)});
|
| 115 | TestApp["linkedObjs" + (index+1)].show(new relatedListViewClass());
|
| 116 | index = index + 1;
|
| 117 | }
|
| 118 |
|
| 119 | while (index<4) {
|
| 120 | TestApp["linkedObjs" + (index+1)].empty();
|
| 121 | index = index + 1;
|
| 122 | }
|
| 123 |
|
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 124 | var detailView = new this.detailClass({
|
| 125 | model: this.model,
|
| 126 | });
|
| 127 | $('#detailBox').show();
|
| 128 | TestApp.detail.show(detailView);
|
| 129 | }, |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 130 | }); |
| 131 | |
| 132 | listViewClass = Marionette.CompositeView.extend({ |
| 133 | childView: itemViewClass, |
| 134 | childViewContainer: 'tbody', |
| 135 | template: table_template, |
| 136 | collection: xos[collection_name], |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 137 | title: name + "s", |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 138 | |
| 139 | initialize: function() { |
| 140 | this.listenTo(this.collection, 'change', this._renderChildren) |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 141 | |
| 142 | // Because many of the templates use idToName(), we need to |
| 143 | // listen to the collections that hold the names for the ids |
| 144 | // that we want to display. |
| 145 | for (i in this.collection.foreignCollections) { |
| 146 | foreignName = this.collection.foreignCollections[i]; |
| 147 | this.listenTo(xos[foreignName], 'change', this._renderChildren); |
| 148 | this.listenTo(xos[foreignName], 'sort', this._renderChildren); |
| 149 | } |
| 150 | }, |
| 151 | |
| 152 | templateHelpers: function() { |
| 153 | return { title: this.title }; |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 154 | }, |
| 155 | }); |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 156 | TestApp[collection_name + "ListView"] = listViewClass; |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 157 | |
| 158 | var listView = new listViewClass(); |
| 159 | |
Scott Baker | 4aee9a1 | 2014-10-30 00:06:16 -0700 | [diff] [blame] | 160 | if (region_name in TestApp.getRegions()) { |
| 161 | TestApp[region_name].show(listView); |
| 162 | } |
Scott Baker | 33c84ac | 2014-10-28 21:40:20 -0700 | [diff] [blame] | 163 | xos[collection_name].fetch(); //startPolling(); |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 164 | } |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 165 | |
Scott Baker | d044c8f | 2014-10-28 14:46:13 -0700 | [diff] [blame] | 166 | $('#close-detail-view').unbind().bind('click', function() { |
Scott Baker | 3df4194 | 2014-10-28 12:44:13 -0700 | [diff] [blame] | 167 | $('#detailBox').hide(); |
| 168 | }); |
Scott Baker | e41c908 | 2014-10-27 23:02:48 -0700 | [diff] [blame] | 169 | }); |
| 170 | |
| 171 | $(document).ready(function(){ |
| 172 | TestApp.start();
|
| 173 | }); |
| 174 | |