planetstack/core/xoslib/static/js/test.js

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