Working database pagination
Project: http://git-wip-us.apache.org/repos/asf/couchdb/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb/commit/be90939a Tree: http://git-wip-us.apache.org/repos/asf/couchdb/tree/be90939a Diff: http://git-wip-us.apache.org/repos/asf/couchdb/diff/be90939a Branch: refs/heads/route-events Commit: be90939a9b5fb5843cca238241f6d5945439ca64 Parents: 53e5188 Author: Russell Branca <[email protected]> Authored: Thu Apr 4 16:18:47 2013 -0700 Committer: Garren Smith <[email protected]> Committed: Thu May 9 09:59:57 2013 +0200 ---------------------------------------------------------------------- src/fauxton/app/modules/databases/resources.js | 2 +- src/fauxton/app/modules/databases/routes.js | 2 +- src/fauxton/app/modules/databases/views.js | 17 +++++++++++++++-- src/fauxton/app/templates/databases/list.html | 17 +++++++++++++++++ 4 files changed, 34 insertions(+), 4 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb/blob/be90939a/src/fauxton/app/modules/databases/resources.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/modules/databases/resources.js b/src/fauxton/app/modules/databases/resources.js index 59dd179..6927fd5 100644 --- a/src/fauxton/app/modules/databases/resources.js +++ b/src/fauxton/app/modules/databases/resources.js @@ -135,7 +135,7 @@ function(app, FauxtonAPI, Documents) { parse: function(resp) { // TODO: pagination! - return _.map(_.first(resp, 10), function(database) { + return _.map(resp, function(database) { return { id: encodeURIComponent(database), name: database http://git-wip-us.apache.org/repos/asf/couchdb/blob/be90939a/src/fauxton/app/modules/databases/routes.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/modules/databases/routes.js b/src/fauxton/app/modules/databases/routes.js index 12edd0e..2ba59d7 100644 --- a/src/fauxton/app/modules/databases/routes.js +++ b/src/fauxton/app/modules/databases/routes.js @@ -63,7 +63,7 @@ function(app, FauxtonAPI, Databases) { Databases.Routes = { "": allDbsCallback, "index.html": allDbsCallback, - "_all_dbs": allDbsCallback + "_all_dbs(:params)": allDbsCallback }; return Databases; http://git-wip-us.apache.org/repos/asf/couchdb/blob/be90939a/src/fauxton/app/modules/databases/views.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/modules/databases/views.js b/src/fauxton/app/modules/databases/views.js index 322cd5a..afaee07 100644 --- a/src/fauxton/app/modules/databases/views.js +++ b/src/fauxton/app/modules/databases/views.js @@ -32,6 +32,7 @@ function(app, FauxtonAPI) { Views.List = FauxtonAPI.View.extend({ dbLimit: 10, + perPage: 10, template: "templates/databases/list", events: { "click button.all": "selectAll", @@ -39,12 +40,18 @@ function(app, FauxtonAPI) { }, initialize: function(options) { + var params = app.getParams(); this.collection.on("add", this.render, this); + this.page = params.page ? parseInt(params.page, 10) : 1; }, serialize: function() { return { - databases: this.collection + databases: this.collection, + page: this.page, + perPage: this.perPage, + totalDbs: this.collection.length, + totalPages: Math.ceil(this.collection.length / this.perPage) }; }, @@ -61,8 +68,14 @@ function(app, FauxtonAPI) { } }, + paginated: function() { + var start = (this.page - 1) * this.perPage; + var end = this.page * this.perPage - 1; + return this.collection.slice(start, end); + }, + beforeRender: function() { - this.collection.each(function(database) { + _.each(this.paginated(), function(database) { this.insertView("table.databases tbody", new Views.Item({ model: database })); http://git-wip-us.apache.org/repos/asf/couchdb/blob/be90939a/src/fauxton/app/templates/databases/list.html ---------------------------------------------------------------------- diff --git a/src/fauxton/app/templates/databases/list.html b/src/fauxton/app/templates/databases/list.html index ba871b5..a2e70f1 100644 --- a/src/fauxton/app/templates/databases/list.html +++ b/src/fauxton/app/templates/databases/list.html @@ -27,3 +27,20 @@ the License. <tbody> </tbody> </table> +<div class="pagination pagination-centered"> + <ul> + <% if (page > 1) { %> + <li><a href="#/_all_dbs?page=<%= page - 1 %>">«</a></li> + <% } else { %> + <li class="disabled"><a href="#/_all_dbs?page=<%= page %>">«</a></li> + <% } %> + <% _.each(_.range(1, totalPages+1), function(i) { %> + <li <% if (page == i) { %>class="active"<% } %>><a href="#/_all_dbs?page=<%= i %>"><%= i %></a></li> + <% }) %> + <% if (page < totalPages) { %> + <li><a href="#/_all_dbs?page=<%= page + 1 %>">»</a></li> + <% } else { %> + <li class="disabled"><a href="#/_all_dbs?page=<%= page %>">»</a></li> + <% } %> + </ul> +</div>
