adding loading indicator

Author: spikebrehm

app/app.js

@@ -1,15 +1,22 @@
 var BaseApp = require('rendr/shared/app');
 
-var handlebarsHelpers = require('./helpers/handlebars_helpers');
-_.each(handlebarsHelpers, function(value, key) {
-  Handlebars.registerHelper(key, value);
-});
-
 module.exports = BaseApp.extend({
   defaults: {
     loading: false
   },
 
+  // @shared
+  postInitialize: function() {
+    this.initHandlebarsHelpers();
+  },
+
+  initHandlebarsHelpers: function() {
+    var handlebarsHelpers = require('./helpers/handlebars_helpers');
+    _.each(handlebarsHelpers, function(value, key) {
+      Handlebars.registerHelper(key, value);
+    });
+  },
+
   // @client
   start: function() {
     // Show a loading indicator when the app is fetching.

app/templates/__layout.hbs

@@ -18,6 +18,7 @@
               <li class="active"><a href="/">Home</a></li>
             </ul>
           </div>
+          <div class="loading-indicator">Loading&hellip;</div>
         </div>
       </div>
     </div>

app/views/app_view.js

@@ -1,7 +1,11 @@
 var BaseAppView = require('rendr/shared/base/app_view');
 
+var $body = $('body');
+
 module.exports = BaseAppView.extend({
-  render: function() {
-    return this;
+  postInitialize: function() {
+    this.app.on('change:loading', function(app, loading) {
+      $body.toggleClass('loading', loading);
+    }, this);
   }
 });

assets/stylesheets/index.styl

@@ -4,3 +4,13 @@
 body
   background-color: whitesmoke
   padding-top: 50px
+
+  &.loading
+    .loading-indicator
+      display: block
+
+.loading-indicator
+  display: none
+  float: right
+  color: white
+  line-height: 40px

package.json

@@ -22,7 +22,7 @@
     "underscore": "1.4.4",
     "async": "0.1.22",
     "request": "~2.16",
-    "rendr": "git+ssh://[email protected]:airbnb/rendr.git#26f15871736f3ae922b9911da553724e48968901",
+    "rendr": "git+ssh://[email protected]:airbnb/rendr.git#f52d6a1821e9c244ddaa98356964fc2f2350ec27",
     "asset-compiler": "git+ssh://[email protected]:airbnb/node-asset-compiler.git#397d5591ed9e307dbae8d46863c1a174b4b13be7",
     "debug": "*"
   },