You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@couchdb.apache.org by cm...@apache.org on 2008/08/29 17:25:20 UTC
svn commit: r690297 - in /incubator/couchdb/trunk/share/www:
browse/index.html script/browse.js
Author: cmlenz
Date: Fri Aug 29 08:25:19 2008
New Revision: 690297
URL: http://svn.apache.org/viewvc?rev=690297&view=rev
Log:
Provide pagination for the database index page in Futon.
Modified:
incubator/couchdb/trunk/share/www/browse/index.html
incubator/couchdb/trunk/share/www/script/browse.js
Modified: incubator/couchdb/trunk/share/www/browse/index.html
URL: http://svn.apache.org/viewvc/incubator/couchdb/trunk/share/www/browse/index.html?rev=690297&r1=690296&r2=690297&view=diff
==============================================================================
--- incubator/couchdb/trunk/share/www/browse/index.html [utf-8] (original)
+++ incubator/couchdb/trunk/share/www/browse/index.html [utf-8] Fri Aug 29 08:25:19 2008
@@ -28,7 +28,15 @@
<script>
var page = new CouchIndexPage();
$(document).ready(function() {
+ var dbsPerPage = $.cookies.get("perpage");
+ if (dbsPerPage) $("#perpage").val(dbsPerPage);
+ $("#perpage").change(function() {
+ page.updateDatabaseListing();
+ $.cookies.set("perpage", this.value);
+ });
+
page.updateDatabaseListing();
+
$("#toolbar button.add").click(function() {
page.addDatabase();
});
@@ -57,7 +65,19 @@
</tbody>
<tbody class="footer">
<tr>
- <td colspan="4"></td>
+ <td colspan="4">
+ <div id="paging">
+ <a class="prev">← Previous Page</a> |
+ <label>Rows per page: <select id="perpage">
+ <option selected>10</option>
+ <option>25</option>
+ <option>50</option>
+ <option>100</option>
+ </select></label> |
+ <a class="next">Next Page →</a>
+ </div>
+ <span></span>
+ </td>
</tr>
</tbody>
</table>
Modified: incubator/couchdb/trunk/share/www/script/browse.js
URL: http://svn.apache.org/viewvc/incubator/couchdb/trunk/share/www/script/browse.js?rev=690297&r1=690296&r2=690297&view=diff
==============================================================================
--- incubator/couchdb/trunk/share/www/script/browse.js [utf-8] (original)
+++ incubator/couchdb/trunk/share/www/script/browse.js [utf-8] Fri Aug 29 08:25:19 2008
@@ -36,15 +36,22 @@
return false;
}
- this.updateDatabaseListing = function() {
+ this.updateDatabaseListing = function(offset) {
+ offset |= 0;
$(document.body).addClass("loading");
+ var maxPerPage = parseInt($("#perpage").val(), 10);
+
$.couch.allDbs({
success: function(dbs) {
+ $("#paging a").unbind();
+ $("#databases tbody.content").empty();
+
if (dbs.length == 0) {
$(document.body).removeClass("loading");
}
+ var dbsOnPage = dbs.slice(offset, offset + maxPerPage);
- $.each(dbs, function(idx, dbName) {
+ $.each(dbsOnPage, function(idx, dbName) {
$("#databases tbody.content").append("<tr>" +
"<th><a href='database.html?" + encodeURIComponent(dbName) + "'>" +
dbName + "</a></th>" +
@@ -56,14 +63,34 @@
.find("td.size").text(prettyPrintSize(info.disk_size)).end()
.find("td.count").text(info.doc_count).end()
.find("td.seq").text(info.update_seq);
- if (idx == dbs.length - 1) {
+ if (idx == dbsOnPage.length - 1) {
$(document.body).removeClass("loading");
}
}
});
});
$("#databases tbody tr:odd").addClass("odd");
- $("#databases tbody.footer tr td").text(dbs.length + " database(s)");
+
+ if (offset > 0) {
+ $("#paging a.prev").attr("href", "#" + (offset - maxPerPage)).click(function() {
+ page.updateDatabaseListing(offset - maxPerPage);
+ });
+ } else {
+ $("#paging a.prev").removeAttr("href");
+ }
+ if (offset + maxPerPage < dbs.length) {
+ $("#paging a.next").attr("href", "#" + (offset + maxPerPage)).click(function() {
+ page.updateDatabaseListing(offset + maxPerPage);
+ });
+ } else {
+ $("#paging a.next").removeAttr("href");
+ }
+
+ var firstNum = offset + 1;
+ var lastNum = firstNum + dbsOnPage.length - 1;
+ $("#databases tbody.footer tr td span").text(
+ "Showing " + firstNum + "-" + lastNum + " of " + dbs.length +
+ " databases");
}
});
}