couchdb-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From gar...@apache.org
Subject git commit: updated refs/heads/1853-fauxton-route-events to 819caca
Date Tue, 16 Jul 2013 07:47:25 GMT
Updated Branches:
  refs/heads/1853-fauxton-route-events [created] 819cacabd


RouteObject event implementation


Project: http://git-wip-us.apache.org/repos/asf/couchdb/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb/commit/819cacab
Tree: http://git-wip-us.apache.org/repos/asf/couchdb/tree/819cacab
Diff: http://git-wip-us.apache.org/repos/asf/couchdb/diff/819cacab

Branch: refs/heads/1853-fauxton-route-events
Commit: 819cacabdc44553e0a3dc0dfd14c59bdfe4e6903
Parents: 9b64526
Author: Garren Smith <garren.smith@gmail.com>
Authored: Tue Jul 16 09:46:57 2013 +0200
Committer: Garren Smith <garren.smith@gmail.com>
Committed: Tue Jul 16 09:46:57 2013 +0200

----------------------------------------------------------------------
 src/fauxton/app/api.js                      | 69 +++++++++++++++++++++---
 src/fauxton/app/modules/documents/routes.js |  2 +-
 2 files changed, 62 insertions(+), 9 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/couchdb/blob/819cacab/src/fauxton/app/api.js
----------------------------------------------------------------------
diff --git a/src/fauxton/app/api.js b/src/fauxton/app/api.js
index 0f3923e..7e6c97c 100644
--- a/src/fauxton/app/api.js
+++ b/src/fauxton/app/api.js
@@ -225,6 +225,44 @@ function(app, Fauxton) {
     this.addEvents();
   };
 
+  var broadcaster = {};
+  _.extend(broadcaster, Backbone.Events);
+
+  FauxtonAPI.RouteObject.on = function (eventName, fn) {
+    broadcaster.on(eventName, fn); 
+  };
+  
+  /* How Route Object events work
+   To listen to a specific route objects events:
+
+   myRouteObject = FauxtonAPI.RouteObject.extend({
+    events: {
+      "beforeRender": "beforeRenderEvent"
+    },
+
+    beforeRenderEvent: function (view, selector) {
+      console.log('Hey, beforeRenderEvent triggered',arguments);
+
+    },
+   });
+
+    It is also possible to listen to events triggered from all Routeobjects. 
+    This is great for more general things like adding loaders, hooks.
+
+    app.RouteObject.on('beforeRender', function (routeObject, view, selector) {
+      console.log('hey, this will trigger when any routeobject renders a view');
+    });
+
+   Current Events to subscribe to:
+    * beforeFullRender -- before a full render is being done
+    * beforeEstablish -- before the routeobject calls establish
+    * AfterEstablish -- after the routeobject has run establish
+    * beforeRender -- before a view is rendered
+    * afterRender -- a view is finished being rendered
+    * renderComplete -- all rendering is complete
+    
+  */
+
   // Piggy-back on Backbone's self-propagating extend function
   FauxtonAPI.RouteObject.extend = Backbone.Model.extend;
 
@@ -250,14 +288,13 @@ function(app, Fauxton) {
     renderWith: function(route, masterLayout, args) {
       var routeObject = this;
 
-      // TODO: Can look at replacing this with events eg beforeRender, afterRender function
and events
-      this.route.call(this, route, args);
-
       // Only want to redo the template if its a full render
       if (!this.renderedState) {
+        this.triggerBroadcast('beforeFullRender');
+
         masterLayout.setTemplate(this.layout);
-          $('#nav-links li').removeClass('active');
 
+        $('#nav-links li').removeClass('active');
         if (this.selectedHeader) {
           $('#nav-links li[data-nav-name="' + this.selectedHeader + '"]').addClass('active');
         }
@@ -277,24 +314,31 @@ function(app, Fauxton) {
         }));
       }
 
+      this.triggerBroadcast('beforeEstablish');
       FauxtonAPI.when(this.establish()).done(function(resp) {
         if (!this.disableLoader) {
           $('#app-container').removeClass(this.loaderClassname);
         }
+        this.triggerBroadcast('afterEstablish');
         _.each(routeObject.getViews(), function(view, selector) {
           if(view.hasRendered()) { return; }
+
+          this.triggerBroadcast('beforeRender', view, selector);
+
           if (!view.disableLoader){ $(selector).addClass(view.loaderClassname);}
+
           masterLayout.setView(selector, view);
           FauxtonAPI.when(view.establish()).then(function(resp) {
             if (!view.disableLoader) $(selector).removeClass(view.loaderClassname);
             masterLayout.renderView(selector);
-            }, function(resp) {
+          }, function(resp) {
             view.establishError = {
               error: true,
               reason: resp
             };
             masterLayout.renderView(selector);
-          });
+            this.triggerBroadcast('afterRender', view, selector);
+          }.bind(this));
 
           var hooks = masterLayout.hooks[selector];
           var boundRoute = route;
@@ -303,14 +347,23 @@ function(app, Fauxton) {
             if (_.any(hook.routes, function(route){return route == boundRoute;})){
               hook.callback(view);
             }
-          });
-        });
+          }, this);
+        }, this);
       }.bind(this));
 
       if (this.get('apiUrl')) masterLayout.apiBar.update(this.get('apiUrl'));
 
       // Track that we've done a full initial render
       this.renderedState = true;
+      this.triggerBroadcast('renderComplete');
+    },
+
+    triggerBroadcast: function (eventName) {
+      var args = Array.prototype.slice.call(arguments);
+      this.trigger.apply(this, args);
+
+      args.splice(0,1, eventName + ':all', this);
+      broadcaster.trigger.apply(broadcaster, args);
     },
 
     get: function(key) {

http://git-wip-us.apache.org/repos/asf/couchdb/blob/819cacab/src/fauxton/app/modules/documents/routes.js
----------------------------------------------------------------------
diff --git a/src/fauxton/app/modules/documents/routes.js b/src/fauxton/app/modules/documents/routes.js
index a49fa91..1a93164 100644
--- a/src/fauxton/app/modules/documents/routes.js
+++ b/src/fauxton/app/modules/documents/routes.js
@@ -103,7 +103,7 @@ function(app, FauxtonAPI, Documents, Databases) {
     events: {
       "route:updateAllDocs": "updateAllDocsFromView",
       "route:updatePreviewDocs": "updateAllDocsFromPreview",
-      "route:reloadDesignDocs": "reloadDesignDocs"
+      "route:reloadDesignDocs": "reloadDesignDocs",
     },
 
     initialize: function (route, masterLayout, options) {


Mime
View raw message