Proof of concept route events
Project: http://git-wip-us.apache.org/repos/asf/couchdb/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb/commit/f2023730 Tree: http://git-wip-us.apache.org/repos/asf/couchdb/tree/f2023730 Diff: http://git-wip-us.apache.org/repos/asf/couchdb/diff/f2023730 Branch: refs/heads/route-events Commit: f2023730e7f85b32063b51020a7d2b47a89c2102 Parents: cf534b6 Author: Russell Branca <[email protected]> Authored: Fri Apr 26 17:09:56 2013 -0700 Committer: Garren Smith <[email protected]> Committed: Thu May 9 09:59:59 2013 +0200 ---------------------------------------------------------------------- src/fauxton/app/api.js | 2 +- src/fauxton/app/main.js | 24 +++++++++++----- src/fauxton/app/modules/documents/routes.js | 13 +++++++++ src/fauxton/app/router.js | 8 +++++- src/fauxton/app/templates/documents/sidebar.html | 4 +- 5 files changed, 39 insertions(+), 12 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb/blob/f2023730/src/fauxton/app/api.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/api.js b/src/fauxton/app/api.js index 09fad0b..a7496f4 100644 --- a/src/fauxton/app/api.js +++ b/src/fauxton/app/api.js @@ -185,7 +185,7 @@ function(app, Fauxton) { }); if (this.get('apiUrl')) masterLayout.apiBar.update(this.get('apiUrl')); - + // Track that we've done a full initial render this.renderedState = true; }, http://git-wip-us.apache.org/repos/asf/couchdb/blob/f2023730/src/fauxton/app/main.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/main.js b/src/fauxton/app/main.js index d3f8ac2..99ea803 100644 --- a/src/fauxton/app/main.js +++ b/src/fauxton/app/main.js @@ -23,16 +23,24 @@ function(app, Router) { // Get the absolute root. var root = location.protocol + "//" + location.host + app.root; - // Ensure the root is part of the anchor href, meaning it's relative. - if (href.prop && href.prop.slice(0, root.length) === root) { - // Stop the default event to ensure the link will not cause a page - // refresh. + var routeEvent = $(this).attr("route-event"); + if (routeEvent) { evt.preventDefault(); - - // `Backbone.history.navigate` is sufficient for all Routers and will - // trigger the correct events. The Router's internal `navigate` method - // calls this anyways. The fragment is sliced from the root. + app.router.triggerRouteEvent("route:"+routeEvent, href); + // TODO:: change to false when route events are functional Backbone.history.navigate(href.attr, true); + } else { + // Ensure the root is part of the anchor href, meaning it's relative. + if (href.prop && href.prop.slice(0, root.length) === root) { + // Stop the default event to ensure the link will not cause a page + // refresh. + evt.preventDefault(); + + // `Backbone.history.navigate` is sufficient for all Routers and will + // trigger the correct events. The Router's internal `navigate` method + // calls this anyways. The fragment is sliced from the root. + Backbone.history.navigate(href.attr, true); + } } }); }); http://git-wip-us.apache.org/repos/asf/couchdb/blob/f2023730/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 fa6164c..519ad7f 100644 --- a/src/fauxton/app/modules/documents/routes.js +++ b/src/fauxton/app/modules/documents/routes.js @@ -182,6 +182,11 @@ function(app, FauxtonAPI, Documents, Databases) { var DocumentsRouteObject = FauxtonAPI.RouteObject.extend({ layout: "with_tabs_sidebar", + events: { + "route:all_docs": "allDocs", + "route:all_design_docs": "allDesignDocs" + }, + crumbs: function () { return [ {"name": "Databases", "link": "/_all_dbs"}, @@ -189,6 +194,14 @@ function(app, FauxtonAPI, Documents, Databases) { ]; }, + allDocs: function() { + console.log("TRIGGERING all_docs ROUTE EVENT", arguments); + }, + + allDesignDocs: function() { + console.log("TRIGGERING all_design_docs ROUTE EVENT", arguments); + }, + routes: ["database/:database/_all_docs(:extra)", "database/:database/_design/:ddoc/_view/:view"], apiUrl: function() { http://git-wip-us.apache.org/repos/asf/couchdb/blob/f2023730/src/fauxton/app/router.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/router.js b/src/fauxton/app/router.js index 5d97a13..dc04be3 100644 --- a/src/fauxton/app/router.js +++ b/src/fauxton/app/router.js @@ -119,7 +119,6 @@ function(req, app, Initialize, FauxtonAPI, Fauxton, Layout, Databases, Documents routeObject.render(route, masterLayout, Array.prototype.slice.call(arguments)); - self.activeRouteObject = routeObject; }); }, this); }, @@ -175,6 +174,13 @@ function(req, app, Initialize, FauxtonAPI, Fauxton, Layout, Databases, Documents this.masterLayout.render(); app.footer.render(); + }, + + triggerRouteEvent: function(event, args) { + if (this.activeRouteObject) { + console.log("CALLING ROUTE EVENT ON", this.activeRouteObject, arguments); + this.activeRouteObject.trigger.apply(this.activeRouteObject, [event].concat(args)); + } } }); http://git-wip-us.apache.org/repos/asf/couchdb/blob/f2023730/src/fauxton/app/templates/documents/sidebar.html ---------------------------------------------------------------------- diff --git a/src/fauxton/app/templates/documents/sidebar.html b/src/fauxton/app/templates/documents/sidebar.html index 40daec8..9c61adc 100644 --- a/src/fauxton/app/templates/documents/sidebar.html +++ b/src/fauxton/app/templates/documents/sidebar.html @@ -19,8 +19,8 @@ the License. </div> <hr> <ul class="nav nav-list"> - <li class="active"><a id="all-docs" href="#<%= database.url('index') %>?limit=100" class="toggle-view"><i class="icon-list"></i> All documents</a></li> - <li><a id="design-docs" href='#<%= database.url("index") %>?limit=100&startkey="_design"&endkey="_e"' class="toggle-view"><i class="icon-list"></i> All design docs</a></li> + <li class="active"><a route-event="all_docs" id="all-docs" href="#<%= database.url('index') %>?limit=100" class="toggle-view"><i class="icon-list"></i> All documents</a></li> + <li><a route-event="all_design_docs" id="design-docs" href='#<%= database.url("index") %>?limit=100&startkey="_design"&endkey="_e"' class="toggle-view"><i class="icon-list"></i> All design docs</a></li> </ul> <ul class="nav nav-list views"> <li class="nav-header">Secondary Indexes</li>
