History and missing show loading

UI/History/HistoryLayout.js

@@ -3,7 +3,8 @@ define([
     'app',
     'History/Collection',
     'Series/Index/Table/AirDateCell',
-    'Shared/Toolbar/ToolbarLayout'
+    'Shared/Toolbar/ToolbarLayout',
+    'Shared/LoadingView'
 ],
     function () {
         NzbDrone.History.HistoryLayout = Backbone.Marionette.Layout.extend({
@@ -56,7 +57,7 @@ define([
                 }
             ],
 
-            showTable: function () {
+            _showTable: function () {
 
                 this.history.show(new Backgrid.Grid(
                     {
@@ -72,13 +73,17 @@ define([
                 }));
             },
 
-            initialize: function () {
+            onShow: function () {
+                var self = this;
+
+                this.history.show(new NzbDrone.Shared.LoadingView());
+
                 this.historyCollection = new NzbDrone.History.Collection();
-                this.historyCollection.fetch();
+                this.historyCollection.fetch()
-            },
+                                      .done(function () {
+                                          self._showTable();
+                                      });
 
-            onShow: function () {
-                this.showTable();
                 //this.toolbar.show(new NzbDrone.Shared.Toolbar.ToolbarLayout({right: [ viewButtons], context: this}));
             }
 

UI/Missing/MissingLayout.js

@@ -4,7 +4,8 @@ define([
     'Missing/Collection',
     'Series/Index/Table/AirDateCell',
     'Series/Index/Table/SeriesStatusCell',
-    'Shared/Toolbar/ToolbarLayout'
+    'Shared/Toolbar/ToolbarLayout',
+    'Shared/LoadingView'
 ],
     function () {
         NzbDrone.Missing.MissingLayout = Backbone.Marionette.Layout.extend({
@@ -48,7 +49,7 @@ define([
                 }
             ],
 
-            showTable: function () {
+            _showTable: function () {
                 this.missing.show(new Backgrid.Grid(
                     {
                         row       : NzbDrone.Missing.Row,
@@ -63,17 +64,16 @@ define([
                 }));
             },
 
-            initialize: function () {
-                this.missingCollection = new NzbDrone.Missing.Collection();
-                this.missingCollection.fetch();
-            },
-
             onShow: function () {
-                this.showTable();
+                var self = this;
-                //this.toolbar.show(new NzbDrone.Shared.Toolbar.ToolbarLayout({right: [ viewButtons], context: this}));
-            }
 
-        })
+                this.missing.show(new NzbDrone.Shared.LoadingView());
-        ;
+
-    })
+                this.missingCollection = new NzbDrone.Missing.Collection();
-;
+                this.missingCollection.fetch()
+                                      .done(function () {
+                                          self._showTable();
+                                      });
+            }
+        });
+    });

UI/Series/Index/SeriesIndexLayout.js

@@ -7,7 +7,8 @@ define([
     'Series/Index/Table/AirDateCell',
     'Series/Index/Table/SeriesStatusCell',
     'Shared/Toolbar/ToolbarLayout',
-    'Config'
+    'Config',
+    'Shared/LoadingView'
 ],
     function () {
         NzbDrone.Series.Index.SeriesIndexLayout = Backbone.Marionette.Layout.extend({
@@ -63,6 +64,32 @@ define([
                 }
             ],
 
+            leftSideButtons: {
+                type      : 'default',
+                storeState: false,
+                items     : [
+                    {
+                        title: 'Add Series',
+                        icon : 'icon-plus',
+                        route: 'series/add'
+                    },
+                    {
+                        title         : 'RSS Sync',
+                        icon          : 'icon-rss',
+                        command       : 'rsssync',
+                        successMessage: 'RSS Sync Completed',
+                        errorMessage  : 'RSS Sync Failed!'
+                    },
+                    {
+                        title         : 'Update Library',
+                        icon          : 'icon-refresh',
+                        command       : 'refreshseries',
+                        successMessage: 'Library was updated!',
+                        errorMessage  : 'Library update failed!'
+                    }
+                ]
+            },
+
             showTable: function () {
 
                 this.series.show(new Backgrid.Grid(
@@ -93,6 +120,10 @@ define([
 
             onShow: function () {
 
+                //This gets cleared immediately because of the viewButton callback
+                this.series.show(new NzbDrone.Shared.LoadingView());
+
+                //TODO: Move this outside of the function - 'this' is not available for the call back though (use string like events?)
                 var viewButtons = {
                     type         : 'radio',
                         storeState   : true,
@@ -120,41 +151,12 @@ define([
                     ]
                 };
 
-
-                var leftSideButtons = {
-                    type      : 'default',
-                    storeState: false,
-                    items     : [
-                        {
-                            title: 'Add Series',
-                            icon : 'icon-plus',
-                            route: 'series/add'
-                        },
-                        {
-                            title         : 'RSS Sync',
-                            icon          : 'icon-rss',
-                            command       : 'rsssync',
-                            successMessage: 'RSS Sync Completed',
-                            errorMessage  : 'RSS Sync Failed!'
-                        },
-                        {
-                            title         : 'Update Library',
-                            icon          : 'icon-refresh',
-                            command       : 'refreshseries',
-                            successMessage: 'Library was updated!',
-                            errorMessage  : 'Library update failed!'
-                        }
-                    ]
-                };
-
                 this.toolbar.show(new NzbDrone.Shared.Toolbar.ToolbarLayout({
                     right  : [ viewButtons],
-                    left   : [ leftSideButtons],
+                    left   : [ this.leftSideButtons],
                     context: this
                 }));
             }
 
-        })
+        });
-        ;
+    });
-    })
-;