Handle erorrs occurred on views by hook the router alert() to view error events.

Author: trantorLiu

public/javascripts/router.js

@@ -46,7 +46,7 @@ define('router', [
 
       collection.fetch({
         success: function(collection, res) {
-          view = new PostListView({ collection: collection });
+          view = new PostListView({collection: collection});
           that.appView.show(view);
         },
         error: that.alert
@@ -64,13 +64,14 @@ define('router', [
       });
       model.fetch({
         success: function(model, res) {
-          view = new PostShowView({ model: model });
+          view = new PostShowView({model: model});
           that.appView.show(view);
 
-          view.model.on('success', function() {
+          view.on('success', function() {
             delete view;
-            that.navigate('#/post/list', { trigger: true });
+            that.navigate('#/post/list', {trigger: true});
           });
+          view.on('router:alert', that.alert);
         },
         error: that.alert
       });
@@ -83,14 +84,11 @@ define('router', [
       });
 
       this.appView.show(view);
-      view.on('back', function() {
+      view.on('success', function(id) {
         delete view;
-        that.navigate('#/post/list', { trigger: true });
-      });
-      view.model.on('success', function(id) {
-        delete view;
-        that.navigate('#/post/' + id, { trigger: true });
+        that.navigate('#/post/' + id, {trigger: true});
       });
+      view.on('router:alert', that.alert);
     },
     editPost: function(id) {
       var that, view, post;
@@ -103,17 +101,14 @@ define('router', [
       });
       post.fetch({
         success: function(model, res) {
-          view = new PostEditView({ model: model });
+          view = new PostEditView({model: model});
           that.appView.show(view);
 
-          view.on('back', function() {
-            delete view;
-            that.navigate('#/post/' + id, { trigger: true });
-          });
-          view.model.on('success', function() {
+          view.on('success', function() {
             delete view;
-            that.navigate('#/post/' + id, { trigger: true });
+            that.navigate('#/post/' + id, {trigger: true});
           });
+          view.on('router:alert', that.alert);
         },
         error: that.alert
       });

public/javascripts/templates/post/show.html

@@ -1,4 +1,5 @@
 <h3 class="title"><%= post.title %></h3>
 <p class="author"><%= post.author %></p>
 <p class="body"><%= post.body %></p>
-<a href="#/post/<%= post._id %>/edit">Edit</a>&nbsp;|&nbsp;<span class="link delete">Delete</span>
+<a href="#/post/<%= post._id %>/edit">Edit</a>
+<button id="delete">Delete</button>

public/javascripts/views/post/add.js

@@ -34,14 +34,10 @@ define('PostAddView', [
         body    : body
       }, {
         success: function(model, res) {
-          if (res && res.error) {
-            // TODO
-          } else {
-            model.trigger('success', model.id);
-          }
+          that.trigger('success', model.id);
         },
         error: function(model, res) {
-          // TODO
+          that.trigger('router:alert');
         }
       });
     },

public/javascripts/views/post/edit.js

@@ -39,14 +39,10 @@ define('PostEditView', [
         silent  : false,
         sync    : true,
         success : function(model, res) {
-          if (res && res.error) {
-            // TODO
-          } else {
-            model.trigger('success', model.id);
-          }
+          that.trigger('success', model.id);
         },
         error: function(model, res) {
-          // TODO
+          that.trigger('router:alert');
         }
       });
     },

public/javascripts/views/post/show.js

@@ -21,14 +21,15 @@ define('PostShowView', [
       'click #delete': 'delete'
     },
     delete: function(e) {
+      var that = this;
       e.preventDefault();
       this.model.destroy({
         sync: true,
         success: function(model) {
-          model.trigger('success');
+          that.trigger('success');
         },
         error: function() {
-          // TODO handle 404 and 500
+          that.trigger('router:alert');
         }
       });
     }

public/stylesheets/style.css

@@ -6,11 +6,6 @@ body {
 a {
   color: #00B7FF;
 }
-span.link {
-  color: #00B7FF;
-  text-decoration: underline;
-  cursor: pointer;
-}
 
 /* header view */
 #header-view ul {