Added loading indicators.

Closes #154.
prose · Jul 3, 2012 · bf9a0ba · bf9a0ba
1 parent 71ba9f3
commit bf9a0ba
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 2 deletions.
diff --git a/_includes/styles/style.css b/_includes/styles/style.css
@@ -171,7 +171,15 @@ body.post #header {
   padding-bottom: 60px; /* must be same height as the footer */
   }
 
-#post .inner  {
+#main .loading {
+  margin: 0 auto;
+  width: 960px;
+  padding: 100px 0;
+  font-size: 20px;
+  text-align: center;
+  }
+
+#post .inner {
   position: relative;
   }
 

diff --git a/_includes/vendor/github.js b/_includes/vendor/github.js
@@ -1,4 +1,4 @@
-// Github.js 0.6.0
+// Github.js 0.6.1
 // (c) 2012 Michael Aufreiter, Development Seed
 // Github.js is freely distributable under the MIT license.
 // For all details and documentation:

diff --git a/_includes/views/application.js b/_includes/views/application.js
@@ -68,17 +68,21 @@ views.Application = Backbone.View.extend({
   },
 
   posts: function (user, repo, branch, path) {
+    this.loading('Loading posts ...');
     loadPosts(user, repo, branch, path, _.bind(function (err, data) {
+      this.loaded();
       if (err) return this.notify('error', 'The requested resource could not be found.');
       this.header.render();
       this.replaceMainView("posts", new views.Posts({ model: data, id: 'posts' }).render());
     }, this));
   },
 
   post: function (user, repo, branch, path, file, preview) {
+    this.loading('Loading post ...');
     loadPosts(user, repo, branch, path, _.bind(function (err, data) {
       if (err) return this.notify('error', 'The requested resource could not be found.');
       loadPost(user, repo, branch, path, file, _.bind(function (err, data) {
+        this.loaded();
         this.header.render();
         if (err) return this.notify('error', 'The requested resource could not be found.');
         data.preview = preview;
@@ -91,8 +95,10 @@ views.Application = Backbone.View.extend({
   },
 
   newPost: function (user, repo, branch, path) {
+    this.loading('Creating post ...');
     loadPosts(user, repo, branch, path, _.bind(function (err, data) {
       emptyPost(user, repo, branch, path, _.bind(function(err, data) {
+        this.loaded();
         data.jekyll = _.jekyll(path, data.file);
         data.preview = false;
         data.markdown = _.markdown(data.file);
@@ -108,7 +114,9 @@ views.Application = Backbone.View.extend({
     var that = this;
     app.state.title = username;
     this.header.render();
+    this.loading('Loading profile ...');
     loadRepos(username, function(err, data) {
+      that.loaded();
       data.authenticated = window.authenticated;
       that.replaceMainView("start", new views.Profile({id: "start", model: data}).render());
     });
@@ -128,7 +136,16 @@ views.Application = Backbone.View.extend({
   notify: function(type, message) {
     this.header.render();
     this.replaceMainView("notification", new views.Notification(type, message).render());
+  },
+
+  loading: function(msg) {
+    $('#main').html('<div class="loading">'+ msg || 'Loading ...' +'</div>');
+  },
+
+  loaded: function() {
+    $('#main .loading').remove();
   }
+
 });
 
 }).apply(this, window.args);