Show view request duration amd goto doc id

This is for issues #1812 and #1810.

6 files changed, 91 insertions, 11 deletions

diff --git a/src/fauxton/app/modules/documents/resources.js b/src/fauxton/app/modules/documents/resources.js
index 7bfee3dc4..8fc384e17 100644
--- a/src/fauxton/app/modules/documents/resources.js
+++ b/src/fauxton/app/modules/documents/resources.js
@@ -299,7 +299,9 @@ function(app, FauxtonAPI) {
     },
 
     parse: function(resp) {
-      that = this;
+      this.endTime = new Date().getTime();
+      this.requestDuration = (this.endTime - this.startTime);
+
       this.viewMeta = {
         total_rows: resp.total_rows,
         offest: resp.offest,
@@ -319,10 +321,50 @@ function(app, FauxtonAPI) {
       this.fetch();
     },
 
+    // We implement our own fetch to store the starttime so we that
+    // we can get the request duration
+    fetch: function () {
+      this.startTime = new Date().getTime();
+      return Backbone.Collection.prototype.fetch.call(this);
+    },
+
     allDocs: function(){
       return this.models;
+    },
+
+    // This is taken from futon.browse.js $.timeString
+    requestDurationInString: function () {
+      var ms, sec, min, h, timeString, milliseconds = this.requestDuration;
+
+      sec = Math.floor(milliseconds / 1000.0);
+      min = Math.floor(sec / 60.0);
+      sec = (sec % 60.0).toString();
+      if (sec.length < 2) {
+         sec = "0" + sec;
+      }
+
+      h = (Math.floor(min / 60.0)).toString();
+      if (h.length < 2) {
+        h = "0" + h;
+      }
+
+      min = (min % 60.0).toString();
+      if (min.length < 2) {
+        min = "0" + min;
+      }
+
+      timeString = h + ":" + min + ":" + sec;
+
+      ms = (milliseconds % 1000.0).toString();
+      while (ms.length < 3) {
+        ms = "0" + ms;
+      }
+      timeString += "." + ms;
+
+      return timeString;
     }
   });
+
   
   Documents.PouchIndexCollection = Backbone.Collection.extend({
     model: Documents.ViewRow,
@@ -355,7 +397,6 @@ function(app, FauxtonAPI) {
     },
 
     totalRows: function() {
-      console.log(this);
       return this.viewMeta.total_rows || "unknown";
     },
 
diff --git a/src/fauxton/app/modules/documents/routes.js b/src/fauxton/app/modules/documents/routes.js
index e02ac936f..5a44c0ef0 100644
--- a/src/fauxton/app/modules/documents/routes.js
+++ b/src/fauxton/app/modules/documents/routes.js
@@ -115,7 +115,8 @@ function(app, FauxtonAPI, Documents, Databases) {
       });
 
       this.sidebar = this.setView("#sidebar-content", new Documents.Views.Sidebar({
-        collection: this.data.designDocs
+        collection: this.data.designDocs,
+        database: this.data.database
       }));
 
       this.setView("#tabs", new Documents.Views.Tabs({
diff --git a/src/fauxton/app/modules/documents/views.js b/src/fauxton/app/modules/documents/views.js
index af8513484..f8c744728 100644
--- a/src/fauxton/app/modules/documents/views.js
+++ b/src/fauxton/app/modules/documents/views.js
@@ -318,12 +318,19 @@ function(app, FauxtonAPI, Documents, pouchdb, Codemirror, JSHint) {
         updateSeq = this.collection.updateSeq();
       }
 
-      return {
+      var info = {
         updateSeq: updateSeq,
         totalRows: totalRows,
         numModels: this.collection.models.length,
-        viewList: this.viewList
+        viewList: this.viewList,
+        requestDuration: null
       };
+
+      if (this.collection.requestDurationInString) {
+        info.requestDuration = this.collection.requestDurationInString();
+      }
+
+      return info;
     },
 
     /*
@@ -550,7 +557,9 @@ function(app, FauxtonAPI, Documents, pouchdb, Codemirror, JSHint) {
     },
 
     establish: function () {
-      return this.ddocInfo.fetch();
+      if (this.ddocInfo) {
+        return this.ddocInfo.fetch();
+      }
     },
 
     updateDesignDoc: function () {
@@ -1003,10 +1012,12 @@ function(app, FauxtonAPI, Documents, pouchdb, Codemirror, JSHint) {
   Views.Sidebar = FauxtonAPI.View.extend({
     template: "templates/documents/sidebar",
     events: {
-      "click a.new#index": "newIndex"
+      "click a.new#index": "newIndex",
+      "submit #jump-to-doc": "jumpToDoc"
     },
 
     initialize: function(options) {
+      this.database = options.database;
       if (options.ddocInfo) {
         this.ddocID = options.ddocInfo.id;
         this.currView = options.ddocInfo.currView;
@@ -1039,6 +1050,12 @@ function(app, FauxtonAPI, Documents, pouchdb, Codemirror, JSHint) {
       app.router.navigate(url);
     },
 
+    jumpToDoc: function (event) {
+      event.preventDefault();
+      var docId = this.$('#jump-to-doc-id').val();
+      FauxtonAPI.navigate('/database/' + this.database.id +'/' + docId, {trigger: true});
+    },
+
     buildIndexList: function(collection, selector, design){
 
       _.each(_.keys(collection), function(key){
@@ -1123,7 +1140,6 @@ function(app, FauxtonAPI, Documents, pouchdb, Codemirror, JSHint) {
       if (this.intervalId) { return ; }
 
       this.intervalId = setInterval(function () {
-        console.log('refreshing');
         model.fetch();
       }, this.refreshTime);
     },
diff --git a/src/fauxton/app/templates/documents/all_docs_list.html b/src/fauxton/app/templates/documents/all_docs_list.html
index 9f4ffddfb..c0a0d402a 100644
--- a/src/fauxton/app/templates/documents/all_docs_list.html
+++ b/src/fauxton/app/templates/documents/all_docs_list.html
@@ -33,6 +33,11 @@ the License.
     <% if (updateSeq) { %>
       -- Update Sequence: <%= updateSeq %>
     <% } %>
+    <% if (requestDuration) { %>
+  <span class="view-request-duration">
+    View request duration: <strong> <%= requestDuration %> </strong> 
+   </span>
+   <% } %>
   </p>
   <table class="all-docs table table-striped table-condensed">
     <tbody></tbody>
diff --git a/src/fauxton/app/templates/documents/sidebar.html b/src/fauxton/app/templates/documents/sidebar.html
index b573725c6..df753110d 100644
--- a/src/fauxton/app/templates/documents/sidebar.html
+++ b/src/fauxton/app/templates/documents/sidebar.html
@@ -13,10 +13,22 @@ the License.
 -->
 
 <div id="sidenav">
-  <a class="btn btn-small new" id="doc" href="#<%= database.url('app') %>/new"><i class="icon-file"></i> New doc</a>
-  <div class="btn-group" id="new-index">
-    <a class="btn btn-small" href="#<%= database.url('app') %>/new_view">New view</a>
+  <div class="row-fluid">
+    <div class="span4">
+      <a class="btn btn-small new" id="doc" href="#<%= database.url('app') %>/new"><i class="icon-file"></i> New doc</a>
+      <div class="btn-group" id="new-index">
+        <a class="btn btn-small" href="#<%= database.url('app') %>/new_view">New view</a>
+      </div>
+    </div>
+    <div class="span6">
+      <form id="jump-to-doc" class="form-inline">
+        <label> Jump To: 
+          <input type="text" id="jump-to-doc-id" class="input-small" placeholder="Document Id"></input>
+        </label>
+      </form>
+    </div>
   </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>
diff --git a/src/fauxton/assets/less/database.less b/src/fauxton/assets/less/database.less
index 74a990f7a..4ce41f80a 100644
--- a/src/fauxton/assets/less/database.less
+++ b/src/fauxton/assets/less/database.less
@@ -161,3 +161,8 @@
 }
 
 .loading {display: none;}
+
+.view-request-duration {
+  padding-right: 10px;
+  float: right;
+}