From f1df6303d29f7013cb9674ccb781d1bf5059b3c1 Mon Sep 17 00:00:00 2001 From: Scott Baker Date: Tue, 18 Nov 2014 17:02:07 -0800 Subject: [PATCH] refresh button working, spinning circle, navigate function, tolerate sites==undefined, delete button WIP --- .../xoslib/dashboards/xosAdminDashboard.html | 2 ++ .../core/xoslib/static/css/xosAdminSite.css | 8 +++++ .../core/xoslib/static/js/xosAdminSite.js | 13 +++++-- .../xoslib/static/js/xoslib/xos-backbone.js | 23 ++++++++++++ .../core/xoslib/static/js/xoslib/xosHelper.js | 36 ++++++++++++++----- .../core/xoslib/templates/xosAdmin.html | 6 ++-- 6 files changed, 76 insertions(+), 12 deletions(-) diff --git a/planetstack/core/xoslib/dashboards/xosAdminDashboard.html b/planetstack/core/xoslib/dashboards/xosAdminDashboard.html index 6d60535..99050e1 100644 --- a/planetstack/core/xoslib/dashboards/xosAdminDashboard.html +++ b/planetstack/core/xoslib/dashboards/xosAdminDashboard.html @@ -34,8 +34,10 @@ +
+
diff --git a/planetstack/core/xoslib/static/css/xosAdminSite.css b/planetstack/core/xoslib/static/css/xosAdminSite.css index d1b4275..118a7b0 100644 --- a/planetstack/core/xoslib/static/css/xosAdminSite.css +++ b/planetstack/core/xoslib/static/css/xosAdminSite.css @@ -66,6 +66,8 @@ text-decoration:none; } +/* these are for the inline list and detail titles */ + .xos-list-title { display: none; } @@ -74,6 +76,12 @@ display: none; } +/* this one goes with contenttitle */ + +#xos-list-title-spinner { + display: none; +} + /* undo what planetstack.css does to the progressbar */ #xos-startup-progress .ui-progressbar-value { background-color: rgb(204,204,204) !important; diff --git a/planetstack/core/xoslib/static/js/xosAdminSite.js b/planetstack/core/xoslib/static/js/xosAdminSite.js index b5d0f6c..ceb2589 100644 --- a/planetstack/core/xoslib/static/js/xosAdminSite.js +++ b/planetstack/core/xoslib/static/js/xosAdminSite.js @@ -26,6 +26,17 @@ XOSAdminApp.navigateToModel = function(app, detailClass, detailNavLink, model) { XOSAdminApp.Router.navigate(detailNavLink + "/" + model.id, {trigger: true}); }; +XOSAdminApp.navigate = function(what, modelName, modelId) { + collection_name = modelName + "s"; + if (what=="list") { + XOSAdminApp.Router.navigate(collection_name, {trigger: true}) + } else if (what=="detail") { + XOSAdminApp.Router.navigate(collection_name + "/" + modelId, {trigger: true}) + } else if (what=="add") { + XOSAdminApp.Router.navigate("add" + firstCharUpper(modelName), {trigger: true}) + } +} + ICON_CLASSES = {home: "icon-home", deployments: "icon-deployment", sites: "icon-site", slices: "icon-slice", users: "icon-user"}; XOSAdminApp.updateNavigationPanel = function() { @@ -56,12 +67,10 @@ XOSAdminApp.buildViews = function() { collection_name = name + "s"; region_name = name + "List"; detailNavLink = collection_name; - listNavLink = collection_name; detailClass = XOSDetailView.extend({ template: detail_template, app: XOSAdminApp, - listNavLink: listNavLink, }); XOSAdminApp[collection_name + "DetailView"] = detailClass; diff --git a/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js b/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js index 36df6eb..f615c30 100644 --- a/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js +++ b/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js @@ -116,21 +116,27 @@ if (! window.XOSLIB_LOADED ) { }, fetchSuccess: function(collection, response, options) { + //console.log("fetch succeeded " + collection.modelName); this.failedLoad = false; + this.fetching = false; if (!this.isLoaded) { this.isLoaded = true; Backbone.trigger("xoslib:collectionLoadChange", this); } + this.trigger("fetchStateChange"); if (options["orig_success"]) { options["orig_success"](collection, response, options); } }, fetchFailure: function(collection, response, options) { + //console.log("fetch failed " + collection.modelName); + this.fetching = false; if ((!this.isLoaded) && (!this.failedLoad)) { this.failedLoad=true; Backbone.trigger("xoslib:collectionLoadChange", this); } + this.trigger("fetchStateChange"); if (options["orig_failure"]) { options["orig_failure"](collection, response, options); } @@ -138,10 +144,13 @@ if (! window.XOSLIB_LOADED ) { fetch: function(options) { var self=this; + this.fetching=true; + //console.log("fetch " + this.modelName); if (!this.startedLoad) { this.startedLoad=true; Backbone.trigger("xoslib:collectionLoadChange", this); } + this.trigger("fetchStateChange"); if (options == undefined) { options = {}; } @@ -161,6 +170,20 @@ if (! window.XOSLIB_LOADED ) { } }, + refresh: function(refreshRelated) { + if (!this.fetching) { + this.fetch(); + } + if (refreshRelated) { + for (related in this.relatedCollections) { + related = xos[related]; + if (!related.fetching) { + related.fetch(); + } + } + } + }, + maybeFetch: function(options){ // Helper function to fetch only if this collection has not been fetched before. if(this._fetched){ diff --git a/planetstack/core/xoslib/static/js/xoslib/xosHelper.js b/planetstack/core/xoslib/static/js/xoslib/xosHelper.js index 89d0d3b..6de351b 100644 --- a/planetstack/core/xoslib/static/js/xoslib/xosHelper.js +++ b/planetstack/core/xoslib/static/js/xoslib/xosHelper.js @@ -128,7 +128,7 @@ XOSApplication = Marionette.Application.extend({ return function() { model = new xos[collection_name].model(); detailViewClass = app[detailName]; - detailView = new detailViewClass({model: model}); + detailView = new detailViewClass({model: model, collection:xos[collection_name]}); app[regionName].show(detailView); $("#xos-detail-button-box").show(); $("#xos-listview-button-box").hide(); @@ -203,14 +203,14 @@ XOSDetailView = Marionette.ItemView.extend({ console.log("saveLeave"); e.preventDefault(); this.save(); - this.app.Router.navigate(this.listNavLink, {trigger: true}); - console.log("route to " + this.listNavLink); + this.app.navigate("list", this.model.modelName); }, submitAddAnotherClicked: function(e) { console.log("saveAnother"); e.preventDefault(); this.save(); + this.app.navigate("add", this.model.modelName); }, save: function() { @@ -218,8 +218,14 @@ XOSDetailView = Marionette.ItemView.extend({ var infoMsgId = this.app.showInformational( {what: "save " + this.model.__proto__.modelName, status: "", statusText: "in progress..."} ); var data = Backbone.Syphon.serialize(this); var that = this; + var isNew = !this.model.id; this.model.save(data, {error: function(model, result, xhr) { that.saveError(model,result,xhr,infoMsgId);}, success: function(model, result, xhr) { that.saveSuccess(model,result,xhr,infoMsgId);}}); + if (isNew) { + console.log(this.model); + this.collection.add(this.model); + this.collection.sort(); + } this.dirty = false; }, @@ -320,16 +326,30 @@ XOSListView = Marionette.CompositeView.extend({ childViewContainer: 'tbody', events: {"click button.btn-xos-add": "addClicked", - }, - + "click button.btn-xos-refresh": "refreshClicked", + }, + + _fetchStateChange: function() { + if (this.collection.fetching) { + $("#xos-list-title-spinner").show(); + } else { + $("#xos-list-title-spinner").hide(); + } + }, + addClicked: function(e) { - console.log("add"); e.preventDefault(); this.app.Router.navigate("add" + firstCharUpper(this.collection.modelName), {trigger: true}); }, - initialize: function() { - this.listenTo(this.collection, 'change', this._renderChildren) + refreshClicked: function(e) { + e.preventDefault(); + this.collection.refresh(refreshRelated=true); + }, + + initialize: function() { + this.listenTo(this.collection, 'change', this._renderChildren) + this.listenTo(this.collection, 'fetchStateChange', this._fetchStateChange); // Because many of the templates use idToName(), we need to // listen to the collections that hold the names for the ids diff --git a/planetstack/core/xoslib/templates/xosAdmin.html b/planetstack/core/xoslib/templates/xosAdmin.html index d543502..bc6ac02 100644 --- a/planetstack/core/xoslib/templates/xosAdmin.html +++ b/planetstack/core/xoslib/templates/xosAdmin.html @@ -35,7 +35,7 @@ @@ -89,7 +91,7 @@ <%= name %> <%= backend_type %> <%= admin_tenant %> - <%= sites.length %> + <%= typeof sites != 'undefined' && sites.length || 0 %>