Return-Path: X-Original-To: apmail-couchdb-commits-archive@www.apache.org Delivered-To: apmail-couchdb-commits-archive@www.apache.org Received: from mail.apache.org (hermes.apache.org [140.211.11.3]) by minotaur.apache.org (Postfix) with SMTP id AACB6107FC for ; Tue, 16 Jul 2013 07:47:38 +0000 (UTC) Received: (qmail 98371 invoked by uid 500); 16 Jul 2013 07:47:36 -0000 Delivered-To: apmail-couchdb-commits-archive@couchdb.apache.org Received: (qmail 98310 invoked by uid 500); 16 Jul 2013 07:47:29 -0000 Mailing-List: contact commits-help@couchdb.apache.org; run by ezmlm Precedence: bulk List-Help: List-Unsubscribe: List-Post: List-Id: Reply-To: dev@couchdb.apache.org Delivered-To: mailing list commits@couchdb.apache.org Received: (qmail 98269 invoked by uid 99); 16 Jul 2013 07:47:26 -0000 Received: from tyr.zones.apache.org (HELO tyr.zones.apache.org) (140.211.11.114) by apache.org (qpsmtpd/0.29) with ESMTP; Tue, 16 Jul 2013 07:47:26 +0000 Received: by tyr.zones.apache.org (Postfix, from userid 65534) id B0EA08A8D2F; Tue, 16 Jul 2013 07:47:25 +0000 (UTC) Content-Type: text/plain; charset="us-ascii" MIME-Version: 1.0 Content-Transfer-Encoding: 7bit From: garren@apache.org To: commits@couchdb.apache.org Message-Id: X-Mailer: ASF-Git Admin Mailer Subject: git commit: updated refs/heads/1853-fauxton-route-events to 819caca Date: Tue, 16 Jul 2013 07:47:25 +0000 (UTC) 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 Authored: Tue Jul 16 09:46:57 2013 +0200 Committer: Garren Smith 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) {