progress bar on startup, and make sure stuff is loaded before we display it

diff --git a/planetstack/core/xoslib/dashboards/xosAdminDashboard.html b/planetstack/core/xoslib/dashboards/xosAdminDashboard.html
index d8e083a..78eb8e2 100644 (file)
--- a/planetstack/core/xoslib/dashboards/xosAdminDashboard.html
+++ b/planetstack/core/xoslib/dashboards/xosAdminDashboard.html
@@ -5,6 +5,7 @@
 <script src="{{ STATIC_URL }}/js/vendor/backbone.babysitter.js"></script>
 <script src="{{ STATIC_URL }}/js/vendor/backbone.marionette.js"></script>
 
+<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
 <link rel="stylesheet" type="text/css" href="{% static 'css/xosAdminDashboard.css' %}" media="all" >
 <link rel="stylesheet" type="text/css" href="{% static 'css/xosAdminSite.css' %}" media="all" >
 

diff --git a/planetstack/core/xoslib/dashboards/xosAdminWholePage.html b/planetstack/core/xoslib/dashboards/xosAdminWholePage.html
index ddcd683..da9f364 100644 (file)
--- a/planetstack/core/xoslib/dashboards/xosAdminWholePage.html
+++ b/planetstack/core/xoslib/dashboards/xosAdminWholePage.html
@@ -5,6 +5,7 @@
 <script src="{{ STATIC_URL }}/js/vendor/backbone.babysitter.js"></script>
 <script src="{{ STATIC_URL }}/js/vendor/backbone.marionette.js"></script>
 
+<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
 <link rel="stylesheet" type="text/css" href="{% static 'css/xosAdminWholePage.css' %}" media="all" >
 <link rel="stylesheet" type="text/css" href="{% static 'css/xosAdminSite.css' %}" media="all" >
 

diff --git a/planetstack/core/xoslib/static/css/xosAdminSite.css b/planetstack/core/xoslib/static/css/xosAdminSite.css
index f5942de..5ecaa8e 100644 (file)
--- a/planetstack/core/xoslib/static/css/xosAdminSite.css
+++ b/planetstack/core/xoslib/static/css/xosAdminSite.css
@@ -65,3 +65,20 @@
     display: none;
 }
 
+/* undo what planetstack.css does to the progressbar */
+#xos-startup-progress .ui-progressbar-value {
+    background-color: rgb(204,204,204) !important;
+    background-image: url(http://code.jquery.com/ui/1.11.2/themes/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png) !important;
+    border-top: 1px !important;
+    border-right: 1px !important;
+    border-left: 1px !important;
+}
+
+#xos-detail-button-box {
+    display: none;
+}
+
+#xos-listview-button-box {
+    display: none;
+}
+

diff --git a/planetstack/core/xoslib/static/js/xosAdminSite.js b/planetstack/core/xoslib/static/js/xosAdminSite.js
index 99cf851..212c1b4 100644 (file)
--- a/planetstack/core/xoslib/static/js/xosAdminSite.js
+++ b/planetstack/core/xoslib/static/js/xosAdminSite.js
@@ -134,6 +134,24 @@ XOSAdminApp.rewriteLinks = function () {
     });\r
 };\r
 \r
+XOSAdminApp.startNavigation = function() {\r
+    Backbone.history.start();\r
+    XOSAdminApp.navigationStarted = true;\r
+}\r
+\r
+XOSAdminApp.collectionLoadChange = function() {\r
+    stats = xos.getCollectionStatus();\r
+\r
+    if (!XOSAdminApp.navigationStarted) {\r
+        if (stats["isLoaded"] + stats["failedLoad"] >= stats["startedLoad"]) {\r
+            XOSAdminApp.startNavigation();\r
+        } else {\r
+            $("#detail").html("<h3>Loading...</h3><div id='xos-startup-progress'></div>");\r
+            $("#xos-startup-progress").progressbar({value: stats["completedLoad"], max: stats["startedLoad"]});\r
+        }\r
+    }\r
+};\r
+\r
 XOSAdminApp.on("start", function() {\r
      XOSAdminApp.buildViews();
 
@@ -143,10 +161,11 @@ XOSAdminApp.on("start", function() {
 
      XOSAdminApp.rewriteLinks();
 
-     if (Backbone.history) {
-         console.log("history start");
-         Backbone.history.start();
-     }
+     // fire it once to initially show the progress bar
+     XOSAdminApp.collectionLoadChange();
+
+     // fire it each time the collection load status is updated
+     Backbone.on("xoslib:collectionLoadChange", XOSAdminApp.collectionLoadChange);
 });
 
 $(document).ready(function(){

diff --git a/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js b/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js
index 75a3e45..36df6eb 100644 (file)
--- a/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js
+++ b/planetstack/core/xoslib/static/js/xoslib/xos-backbone.js
@@ -78,6 +78,8 @@ if (! window.XOSLIB_LOADED ) {
 
         initialize: function(){
           this.isLoaded = false;
+          this.failedLoad = false;
+          this.startedLoad = false;
           this.sortVar = 'name';\r
           this.sortOrder = 'asc';\r
           this.on( "sort", this.sorted );\r
@@ -87,7 +89,7 @@ if (! window.XOSLIB_LOADED ) {
         foreignCollections: [],\r
 \r
         sorted: function() {\r
-            this.isLoaded = true;\r
+            //console.log("sorted " + this.modelName);\r
         },\r
 \r
         simpleComparator: function( model ){\r
@@ -113,6 +115,43 @@ if (! window.XOSLIB_LOADED ) {
             }\r
         },\r
 \r
+        fetchSuccess: function(collection, response, options) {\r
+            this.failedLoad = false;\r
+            if (!this.isLoaded) {\r
+                this.isLoaded = true;\r
+                Backbone.trigger("xoslib:collectionLoadChange", this);\r
+            }\r
+            if (options["orig_success"]) {\r
+                options["orig_success"](collection, response, options);\r
+            }\r
+        },\r
+\r
+        fetchFailure: function(collection, response, options) {\r
+            if ((!this.isLoaded) && (!this.failedLoad)) {\r
+                this.failedLoad=true;\r
+                Backbone.trigger("xoslib:collectionLoadChange", this);\r
+            }\r
+            if (options["orig_failure"]) {\r
+                options["orig_failure"](collection, response, options);\r
+            }\r
+        },\r
+\r
+        fetch: function(options) {\r
+            var self=this;\r
+            if (!this.startedLoad) {\r
+                this.startedLoad=true;\r
+                Backbone.trigger("xoslib:collectionLoadChange", this);\r
+            }\r
+            if (options == undefined) {\r
+                options = {};\r
+            }\r
+            options["orig_success"] = options["success"];\r
+            options["orig_failure"] = options["failure"];\r
+            options["success"] = function(collection, response, options) { self.fetchSuccess.call(self, collection, response, options); };\r
+            options["failure"] = this.fetchFailure;\r
+            Backbone.Collection.prototype.fetch.call(this, options);\r
+        },\r
+\r
         startPolling: function() {\r
             if (!this._polling) {\r
                 var collection=this;
@@ -229,10 +268,12 @@ if (! window.XOSLIB_LOADED ) {
         lib[collectionName] = new lib[collectionClassName]();
 
         lib.allCollectionNames.push(collectionName);
+        lib.allCollections.push(lib[collectionName]);
     };
 
     function xoslib() {
         this.allCollectionNames = [];
+        this.allCollections = [];
 
         define_model(this, {urlRoot: SLIVER_API,
                             relatedCollections: {"networkSlivers": "sliver"},
@@ -303,6 +344,24 @@ if (! window.XOSLIB_LOADED ) {
                             modelName: "slicePlus"});
 
         this.listObjects = function() { return this.allCollectionNames; };
+
+        this.getCollectionStatus = function() {
+            stats = {isLoaded: 0, failedLoad: 0, startedLoad: 0};
+            for (index in this.allCollections) {
+                collection = this.allCollections[index];
+                if (collection.isLoaded) {
+                    stats["isLoaded"] = stats["isLoaded"] + 1;
+                }
+                if (collection.failedLoad) {
+                    stats["failedLoad"] = stats["failedLoad"] + 1;
+                }
+                if (collection.startedLoad) {
+                    stats["startedLoad"] = stats["startedLoad"] + 1;
+                }
+            }
+            stats["completedLoad"] = stats["failedLoad"] + stats["isLoaded"];
+            return stats;
+        };
     };
 
     xos = new xoslib();

diff --git a/planetstack/core/xoslib/static/js/xoslib/xosHelper.js b/planetstack/core/xoslib/static/js/xoslib/xosHelper.js
index 0fc9496..b8e0347 100644 (file)
--- a/planetstack/core/xoslib/static/js/xoslib/xosHelper.js
+++ b/planetstack/core/xoslib/static/js/xoslib/xosHelper.js
@@ -138,40 +138,19 @@ XOSApplication = Marionette.Application.extend({
     detailShower: function(detailName, collection_name, regionName, title) {\r
         var app=this;\r
         showModelId = function(model_id) {\r
-            showModel = function(model) {\r
-                detailViewClass = app[detailName];\r
-                detailView = new detailViewClass({model: model});\r
-                app[regionName].show(detailView);\r
-                detailView.showLinkedItems();\r
-                $("#xos-detail-button-box").show();\r
-                $("#xos-listview-button-box").hide();\r
-            }\r
-\r
             $("#contentTitle").html(templateFromId("#xos-title-detail")({"title": title}));\r
 \r
             collection = xos[collection_name];\r
             model = collection.get(model_id);\r
             if (model == undefined) {\r
-                if (!collection.isLoaded) {\r
-                    // If the model cannot be found, then maybe it's because\r
-                    // we haven't finished loading the collection yet. So wait for\r
-                    // the sort event to complete, then try again.\r
-                    collection.once("sort", function() {\r
-                        collection = xos[collection_name];\r
-                        model = collection.get(model_id);\r
-                        if (model == undefined) {\r
-                            // We tried. It's not here. Complain to the user.\r
-                            app[regionName].show(new HTMLView({html: "failed to load object " + model_id + " from collection " + collection_name}));\r
-                        } else {\r
-                            showModel(model);\r
-                        }\r
-                    });\r
-                } else {\r
-                    // The collection was loaded, the user must just be asking for something we don't have.\r
-                    app[regionName].show(new HTMLView({html: "failed to load object " + model_id + " from collection " + collection_name}));\r
-                }\r
+                app[regionName].show(new HTMLView({html: "failed to load object " + model_id + " from collection " + collection_name}));\r
             } else {\r
-                showModel(model);\r
+                detailViewClass = app[detailName];\r
+                detailView = new detailViewClass({model: model});\r
+                app[regionName].show(detailView);\r
+                detailView.showLinkedItems();\r
+                $("#xos-detail-button-box").show();\r
+                $("#xos-listview-button-box").hide();\r
             }\r
         }\r
         return showModelId;\r