You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@couchdb.apache.org by de...@apache.org on 2014/08/25 15:39:58 UTC

[18/48] fauxton commit: updated refs/heads/secondary-indexes to 8688d16

move around query options, init style
Adding Views, testing header stuff,  fixing layout issues
Add all the indexes to the sidebar
Fix sidebar to work with different indexes
Added the apache license
changed a comment ffs.
Ripping out views into it's own addon
An insane amount of header stuff
design doc ui
Move Fauxton's apibar and breadcrumbs out into components
fix new indexes
buncha editor stuff
making the preview page look less butts.
Styling the view form
documents
This stuff can't be tables. Boo.
less for indexes
resize stuff
And more refactor stuff
View editor updates,
Splitting out less files
An absolute abortion happening in the resizeColumns file
style form fields and tab buttons
move around query options, init style
routes stuff
removed the breadcrumbs POC
Step one in cleaning up that gnarly save on indexes
Always show editor
fixing layout
Adding Views, testing header stuff,  fixing layout issues
Add all the indexes to the sidebar
Fix sidebar to work with different indexes
Added the apache license
changed a comment ffs.
Ripping out views into it's own addon
Setting Up Indexes addon


Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/28333566
Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/28333566
Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/28333566

Branch: refs/heads/secondary-indexes
Commit: 28333566cf546ea76d0bf809cdcf97726bebcfc2
Parents: 0396942
Author: Jenn Schiffer <je...@pancaketheorem.com>
Authored: Sun Aug 24 16:33:43 2014 +0200
Committer: deathbearbrown <de...@gmail.com>
Committed: Mon Aug 25 09:35:08 2014 -0400

----------------------------------------------------------------------
 .gitignore                                      |   1 +
 .../documents/assets/less/advancedOptions.less  |  58 ++
 app/addons/documents/assets/less/changes.less   |  12 +
 app/addons/documents/assets/less/documents.less |  12 +-
 app/addons/documents/assets/less/sidenav.less   |  12 +
 app/addons/documents/resources.js               | 205 ------
 app/addons/documents/routes.js                  | 179 +----
 .../documents/templates/advanced_options.html   | 218 +++---
 .../documents/templates/all_docs_item.html      |  26 +-
 .../documents/templates/all_docs_list.html      |   6 +-
 .../templates/design_doc_selector.html          |  38 -
 .../documents/templates/header_alldocs.html     |  35 +
 .../documents/templates/header_doc_edit.html    |  33 +
 .../documents/templates/index_menu_item.html    |   6 +-
 .../documents/templates/index_row_docular.html  |  29 -
 .../documents/templates/index_row_tabular.html  |  25 -
 app/addons/documents/templates/view_editor.html |  91 ---
 app/addons/documents/views-index.js             | 574 ---------------
 app/addons/documents/views-sidebar.js           |  61 +-
 app/addons/documents/views.js                   |  99 ++-
 app/addons/fauxton/base.js                      |  80 +--
 app/addons/fauxton/components.js                |  88 ++-
 app/addons/fauxton/resizeColumns.js             |  63 +-
 app/addons/fauxton/templates/breadcrumbs.html   |   5 +-
 app/addons/fauxton/templates/menu_dropdown.html |   6 +-
 app/addons/indexes/assets/less/doc-item.less    |  83 +++
 app/addons/indexes/assets/less/index-form.less  |  64 ++
 app/addons/indexes/assets/less/indexes.less     |  17 +
 .../assets/less/new-index-placeholder.less      |  25 +
 app/addons/indexes/base.js                      |  74 ++
 app/addons/indexes/index-components.js          |  30 +
 app/addons/indexes/less/indexes.less            |  13 +
 .../indexes/less/new-index-placeholder.less     |   3 +
 app/addons/indexes/resources.js                 | 285 ++++++++
 app/addons/indexes/routes-core.js               | 129 ++++
 app/addons/indexes/routes-list.js               |  71 ++
 app/addons/indexes/routes-show.js               |  72 ++
 app/addons/indexes/routes-viewindexes.js        | 107 +++
 app/addons/indexes/routes.js                    |  24 +
 .../indexes/templates/design_doc_selector.html  |  38 +
 app/addons/indexes/templates/header_left.html   |  17 +
 app/addons/indexes/templates/header_right.html  |  18 +
 app/addons/indexes/templates/index_header.html  |  28 +
 .../indexes/templates/index_row_docular.html    |  35 +
 app/addons/indexes/templates/list_editor.html   |  18 +
 .../indexes/templates/preview_screen.html       |  16 +
 app/addons/indexes/templates/show_editor.html   |  41 ++
 app/addons/indexes/templates/view_editor.html   |  80 +++
 app/addons/indexes/views.js                     | 712 +++++++++++++++++++
 app/templates/layouts/two_pane.html             |  18 +-
 app/templates/layouts/with_sidebar.html         |   8 +-
 app/templates/layouts/with_tabs.html            |   9 +-
 app/templates/layouts/with_tabs_sidebar.html    |  11 +-
 assets/img/couchWatermark.png                   | Bin 0 -> 7053 bytes
 assets/less/fauxton.less                        | 690 +-----------------
 assets/less/formstyles.less                     | 247 +++++++
 assets/less/templates.less                      | 586 +++++++++++++++
 settings.json.default                           |   1 +
 58 files changed, 3414 insertions(+), 2118 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/.gitignore
----------------------------------------------------------------------
diff --git a/.gitignore b/.gitignore
index 1baaaf1..4d2ca75 100644
--- a/.gitignore
+++ b/.gitignore
@@ -12,6 +12,7 @@ app/addons/*
 !app/addons/replication
 !app/addons/contribute
 !app/addons/auth
+!app/addons/indexes
 !app/addons/exampleAuth
 !app/addons/permissions
 !app/addons/verifyinstall

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/assets/less/advancedOptions.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/advancedOptions.less b/app/addons/documents/assets/less/advancedOptions.less
index 2e29d38..0ff8124 100644
--- a/app/addons/documents/assets/less/advancedOptions.less
+++ b/app/addons/documents/assets/less/advancedOptions.less
@@ -1 +1,59 @@
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+/*ALL DOCS TABLE*/
+
 /*for advanced options css*/
+#query {
+  .border-radius(5px);
+  width: 490px;
+  position: absolute;
+  z-index: 11;
+  background-color: #333;
+  padding: 0;
+  .well {
+    background: none;
+    border: none;
+    color: #fff;
+    padding: 0;
+    margin: 0;
+    .query-group {
+      padding: 20px;
+      border-bottom: 1px solid #ccc;
+    }
+    .query-group:last-child {
+      border-bottom: none;
+    }
+    .controls-group {
+      margin: 0;
+    }
+    .controls-group:last-child {
+      margin: 0;
+    }
+  }
+  form {
+    margin-bottom: 0;
+    .dropdown.inline {
+      display: inline-block;
+    }
+  }
+}
+#query:before {
+  content: '';
+  position: absolute;
+  top: -25px;
+  left: 30px;
+  border-color: transparent transparent #333 transparent;
+  border-style: solid;
+  border-width: 15px;
+  width: 0;
+  height: 0;
+}

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/assets/less/changes.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/changes.less b/app/addons/documents/assets/less/changes.less
index 96e6d19..ebd395a 100644
--- a/app/addons/documents/assets/less/changes.less
+++ b/app/addons/documents/assets/less/changes.less
@@ -1,3 +1,15 @@
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+
 /** used in changes.html **/
 .change-box {
   margin: 0 20px 20px 20px;

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/assets/less/documents.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/documents.less b/app/addons/documents/assets/less/documents.less
index 2b29744..b52e54f 100644
--- a/app/addons/documents/assets/less/documents.less
+++ b/app/addons/documents/assets/less/documents.less
@@ -9,7 +9,7 @@
 // WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 // License for the specific language governing permissions and limitations under
 // the License.
-/*ALL DOCS TABLE*/
+
 
 @import "../../../../../assets/less/variables.less";
 @import "../../../../../assets/less/bootstrap/variables.less";
@@ -21,11 +21,6 @@
 tr.all-docs-item {
   border: none;
   background: transparent;
-    .btn-group {
-        position: absolute;
-        right: 0;
-        top: 6px;
-    }
 }
 button.beautify {
   margin-top: 20px;
@@ -58,7 +53,7 @@ button.beautify {
         position: relative;
     }
 
-    table td div div {
+    table td div div.btn-group {
         display: none;
         line-height: 1;
         position: absolute;
@@ -169,6 +164,3 @@ button.string-edit[disabled] {
 
 
 
-
-
-

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/assets/less/sidenav.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/sidenav.less b/app/addons/documents/assets/less/sidenav.less
index 477af7a..fa65a23 100644
--- a/app/addons/documents/assets/less/sidenav.less
+++ b/app/addons/documents/assets/less/sidenav.less
@@ -1,3 +1,15 @@
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// use this file except in compliance with the License. You may obtain a copy of
+// the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+// License for the specific language governing permissions and limitations under
+// the License.
+
 
 .sidenav{
   .nav-list > .active > a{

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/resources.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/resources.js b/app/addons/documents/resources.js
index e1df569..f95bf78 100644
--- a/app/addons/documents/resources.js
+++ b/app/addons/documents/resources.js
@@ -494,211 +494,6 @@ function(app, FauxtonAPI, PagingCollection) {
     }
   });
 
-  Documents.IndexCollection = PagingCollection.extend({
-    model: Documents.ViewRow,
-    documentation: function(){
-      return "docs";
-    },
-    initialize: function(_models, options) {
-      this.database = options.database;
-      this.params = _.extend({limit: 20, reduce: false}, options.params);
-
-      this.idxType = "_view";
-      this.view = options.view;
-      this.design = options.design.replace('_design/','');
-      this.perPageLimit = options.perPageLimit || 20;
-
-      if (!this.params.limit) {
-        this.params.limit = this.perPageLimit;
-      }
-    },
-
-    urlRef: function(context, params) {
-      var query = "";
-      
-      if (params) {
-        if (!_.isEmpty(params)) {
-          query = "?" + $.param(params);
-        } else {
-          query = '';
-        }
-      } else if (this.params) {
-        var parsedParam = Documents.QueryParams.stringify(this.params);
-        query = "?" + $.param(parsedParam);
-      }
-
-      var startOfUrl = app.host;
-      if (context === 'app') {
-        startOfUrl = 'database';
-      } else if (context === "apiurl"){
-        startOfUrl = window.location.origin;
-      }
-      var design = app.utils.safeURLName(this.design),
-          view = app.utils.safeURLName(this.view);
-
-      var url = [startOfUrl, this.database.safeID(), "_design", design, this.idxType, view];
-      return url.join("/") + query;
-    },
-
-    url: function () {
-      return this.urlRef.apply(this, arguments);
-    },
-
-    totalRows: function() {
-      if (this.params.reduce) { return "unknown_reduce";}
-
-      return this.viewMeta.total_rows || "unknown";
-    },
-
-    updateSeq: function() {
-      return this.viewMeta.update_seq || false;
-    },
-
-    simple: function () {
-      var docs = this.map(function (item) {
-        return {
-          _id: item.id,
-          key: item.get('key'),
-          value: item.get('value')
-        };
-      });
-
-      return new Documents.IndexCollection(docs, {
-        database: this.database,
-        params: this.params,
-        view: this.view,
-        design: this.design
-      });
-    },
-
-    parse: function(resp) {
-      var rows = resp.rows;
-      this.endTime = new Date().getTime();
-      this.requestDuration = (this.endTime - this.startTime);
-
-      return PagingCollection.prototype.parse.apply(this, arguments);
-    },
-
-    buildAllDocs: function(){
-      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 PagingCollection.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 = PagingCollection.extend({
-    model: Documents.ViewRow,
-    documentation: function(){
-      return "docs";
-    },
-    initialize: function(_models, options) {
-      this.database = options.database;
-      this.rows = options.rows;
-      this.view = options.view;
-      this.design = options.design.replace('_design/','');
-      this.params = _.extend({limit: 20, reduce: false}, options.params);
-
-      this.idxType = "_view";
-    },
-
-    url: function () {
-      return '';
-    },
-
-    simple: function () {
-      var docs = this.map(function (item) {
-        return {
-          _id: item.id,
-          key: item.get('key'),
-          value: item.get('value')
-        };
-      });
-
-      return new Documents.PouchIndexCollection(docs, {
-        database: this.database,
-        params: this.params,
-        view: this.view,
-        design: this.design,
-        rows: this.rows
-      });
-
-    },
-
-    fetch: function() {
-      var deferred = FauxtonAPI.Deferred();
-      this.reset(this.rows, {silent: true});
-
-      this.viewMeta = {
-        total_rows: this.rows.length,
-        offset: 0,
-        update_seq: false
-      };
-
-      deferred.resolve();
-      return deferred;
-    },
-
-    totalRows: function() {
-      return this.viewMeta.total_rows || "unknown";
-    },
-
-    updateSeq: function() {
-      return this.viewMeta.update_seq || false;
-    },
-
-    buildAllDocs: function(){
-      this.fetch();
-    },
-
-    allDocs: function(){
-      return this.models;
-    }
-  });
-
-
 
   return Documents;
 });

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/routes.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/routes.js b/app/addons/documents/routes.js
index 8eca7f6..bf0bc95 100644
--- a/app/addons/documents/routes.js
+++ b/app/addons/documents/routes.js
@@ -14,12 +14,11 @@ define([
   "app",
 
   "api",
-
+ "addons/fauxton/components",
   // Modules
   //views
   "addons/documents/views",
   "addons/documents/views-changes",
-  "addons/documents/views-index",
   "addons/documents/views-doceditor",
 
   "addons/databases/base",
@@ -27,7 +26,7 @@ define([
   "addons/fauxton/components"
 ],
 
-function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resources, Components) {
+function(app, FauxtonAPI, Components, Documents, Changes, DocEditor, Databases, Resources) {
 
   var DocEditorRouteObject = FauxtonAPI.RouteObject.extend({
     layout: "one_pane",
@@ -57,6 +56,7 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
 
     crumbs: function() {
       return [
+        {"name": "", "className": "fonticon-left-open", "link": "/_all_dbs"},
         {"name": this.database.id, "link": Databases.databaseUrl(this.database)},
         {"name": this.docID, "link": "#"}
       ];
@@ -114,6 +114,7 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
     },
     crumbs: function() {
       return [
+        {"name": "", "className": "fonticon-left-open", "link": "/_all_dbs"},
         {"name": this.database.id, "link": Databases.databaseUrl(this.database)},
         {"name": "New", "link": "#"}
       ];
@@ -134,34 +135,16 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
         route: "allDocs",
         roles: ["_reader","_writer","_admin"]
       },
-      "database/:database/_design/:ddoc/_views/:view": {
-        route: "viewFn",
-        roles: ['_admin']
-      },
-      "database/:database/_design/:ddoc/_lists/:fn": {
-        route: "tempFn",
-        roles: ['_admin']
-      },
-      "database/:database/_design/:ddoc/_filters/:fn": {
-        route: "tempFn",
-        roles: ['_admin']
-      },
-      "database/:database/_design/:ddoc/_show/:fn": {
-        route: "tempFn",
-        roles: ['_admin']
-      },
       "database/:database/_design/:ddoc/metadata": {
         route: "designDocMetadata",
         roles: ['_admin']
       },
-      "database/:database/new_view": "newViewEditor",
-      "database/:database/new_view/:designDoc": "newViewEditor",
       "database/:database/_changes(:params)": "changes"
     },
 
     events: {
       "route:updateAllDocs": "updateAllDocsFromView",
-      "route:updatePreviewDocs": "updateAllDocsFromPreview",
+      // "route:updatePreviewDocs": "updateAllDocsFromPreview",
       "route:reloadDesignDocs": "reloadDesignDocs",
       "route:paginate": "paginate",
       "route:perPageChange": "perPageChange",
@@ -194,8 +177,8 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
         database: this.data.database
       }));
     },
+
     designDocMetadata:  function(database, ddoc){
-      this.toolsView && this.toolsView.remove();
       this.viewEditor && this.viewEditor.remove();
 
       var designDocInfo = new Resources.DdocInfo({_id: "_design/"+ddoc},{database: this.data.database });
@@ -209,6 +192,7 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
 
       this.crumbs = function () {
         return [
+          {"name": "", "className": "fonticon-left-open", "link": "/_all_dbs"},
           {"name": this.data.database.id, "link": Databases.databaseUrl(this.data.database)},
         ];
       };
@@ -216,15 +200,6 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
       this.apiUrl = [designDocInfo.url('apiurl'), designDocInfo.documentation() ];
 
     },
-    tempFn:  function(databaseName, ddoc, fn){
-      this.setView("#dashboard-upper-content", new Documents.Views.temp({}));
-      this.crumbs = function () {
-        return [
-          {"name": this.data.database.id, "link": Databases.databaseUrl(this.data.database)},
-        ];
-      };
-
-    },
 
     establish: function () {
       return this.data.designDocs.fetch({reset: true});
@@ -283,62 +258,13 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
       }));
 
       this.crumbs = [
+        {"name": "", "className": "fonticon-left-open", "link": "/_all_dbs"},
         {"name": this.data.database.id, "link": Databases.databaseUrl(this.data.database)}
       ];
 
       this.apiUrl = [this.data.database.allDocs.urlRef("apiurl", urlParams), this.data.database.allDocs.documentation() ];
     },
 
-    viewFn: function (databaseName, ddoc, view) {
-      var params = this.createParams(),
-          urlParams = params.urlParams,
-          docParams = params.docParams,
-          decodeDdoc = decodeURIComponent(ddoc);
-
-      view = view.replace(/\?.*$/,'');
-
-      this.data.indexedDocs = new Documents.IndexCollection(null, {
-        database: this.data.database,
-        design: decodeDdoc,
-        view: view,
-        params: docParams,
-        paging: {
-          pageSize: this.getDocPerPageLimit(urlParams, parseInt(docParams.limit, 10))
-        }
-      });
-
-      this.viewEditor = this.setView("#dashboard-upper-content", new Index.ViewEditor({
-        model: this.data.database,
-        ddocs: this.data.designDocs,
-        viewName: view,
-        params: urlParams,
-        newView: false,
-        database: this.data.database,
-        ddocInfo: this.ddocInfo(decodeDdoc, this.data.designDocs, view)
-      }));
-
-      this.toolsView && this.toolsView.remove();
-
-      this.documentsView = this.createViewDocumentsView({
-        designDoc: decodeDdoc,
-        docParams: docParams,
-        urlParams: urlParams,
-        database: this.data.database,
-        indexedDocs: this.data.indexedDocs,
-        designDocs: this.data.designDocs,
-        view: view
-      });
-
-      this.sidebar.setSelectedTab(app.utils.removeSpecialCharacters(ddoc) + '_' + app.utils.removeSpecialCharacters(view));
-
-      this.crumbs = function () {
-        return [
-          {"name": this.data.database.id, "link": Databases.databaseUrl(this.data.database)},
-        ];
-      };
-
-      this.apiUrl = [this.data.indexedDocs.urlRef("apiurl", urlParams), "docs"];
-    },
 
     ddocInfo: function (designDoc, designDocs, view) {
       return {
@@ -348,40 +274,18 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
       };
     },
 
-    createViewDocumentsView: function (options) {
-
-      return this.setView("#dashboard-lower-content", new Documents.Views.AllDocsList({
-        database: options.database,
-        collection: options.indexedDocs,
-        nestedView: Documents.Views.Row,
-        viewList: true,
-        ddocInfo: this.ddocInfo(options.designDoc, options.designDocs, options.view),
-        docParams: options.docParams,
-        params: options.urlParams
-      }));
-    },
-
-    newViewEditor: function (database, designDoc) {
-      var params = app.getParams();
-
-      this.toolsView && this.toolsView.remove();
-      this.documentsView && this.documentsView.remove();
+    // createViewDocumentsView: function (options) {
 
-      this.viewEditor = this.setView("#dashboard-upper-content", new Index.ViewEditor({
-        currentddoc: "_design/"+designDoc || "",
-        ddocs: this.data.designDocs,
-        params: params,
-        database: this.data.database,
-        newView: true
-      }));
-
-      this.sidebar.setSelectedTab('new-view');
-      this.crumbs = function () {
-        return [
-          {"name": this.data.database.id, "link": Databases.databaseUrl(this.data.database)},
-        ];
-      };
-    },
+    //   return this.setView("#dashboard-lower-content", new Documents.Views.AllDocsList({
+    //     database: options.database,
+    //     collection: options.indexedDocs,
+    //     nestedView: Documents.Views.Row,
+    //     viewList: true,
+    //     ddocInfo: this.ddocInfo(options.designDoc, options.designDocs, options.view),
+    //     docParams: options.docParams,
+    //     params: options.urlParams
+    //   }));
+    // },
 
     updateAllDocsFromView: function (event) {
       var view = event.view,
@@ -401,28 +305,6 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
         collection = this.data.database.allDocs;
         collection.paging.pageSize = pageSize;
 
-      } else {
-        collection = this.data.indexedDocs = new Documents.IndexCollection(null, {
-          database: this.data.database,
-          design: ddoc,
-          view: view,
-          params: docParams,
-          paging: {
-            pageSize: pageSize
-          }
-        });
-
-        if (!this.documentsView) {
-          this.documentsView = this.createViewDocumentsView({
-            designDoc: ddoc,
-            docParams: docParams,
-            urlParams: urlParams,
-            database: this.data.database,
-            indexedDocs: this.indexedDocs,
-            designDocs: this.data.designDocs,
-            view: view
-          });
-        }
       }
 
       this.documentsView.setCollection(collection);
@@ -432,26 +314,6 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
       this.apiUrl = [collection.urlRef("apiurl", urlParams), "docs"];
     },
 
-    updateAllDocsFromPreview: function (event) {
-      var view = event.view,
-      rows = event.rows,
-      ddoc = event.ddoc;
-
-      this.data.indexedDocs = new Documents.PouchIndexCollection(null, {
-        database: this.data.database,
-        design: ddoc,
-        view: view,
-        rows: rows
-      });
-
-      this.documentsView = this.setView("#dashboard-lower-content", new Documents.Views.AllDocsList({
-        database: this.data.database,
-        collection: this.data.indexedDocs,
-        nestedView: Documents.Views.Row,
-        viewList: true
-      }));
-    },
-
     perPageChange: function (perPage) {
       // We need to restore the collection parameters to the defaults (1st page)
       // and update the page size
@@ -518,13 +380,14 @@ function(app, FauxtonAPI, Documents, Changes, Index, DocEditor, Databases, Resou
         filterView: this.filterView
       }));
 
-      this.toolsView && this.toolsView.remove();
+
       this.viewEditor && this.viewEditor.remove();
 
       this.sidebar.setSelectedTab('changes');
 
       this.crumbs = function () {
         return [
+          {"name": "", "className": "fonticon-left-open", "link": "/_all_dbs"},
           {"name": this.data.database.id, "link": Databases.databaseUrl(this.data.database)},
           {"name": "_changes", "link": "/_changes"}
         ];

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/advanced_options.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/advanced_options.html b/app/addons/documents/templates/advanced_options.html
index c986d4e..1fc9546 100644
--- a/app/addons/documents/templates/advanced_options.html
+++ b/app/addons/documents/templates/advanced_options.html
@@ -11,57 +11,119 @@ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 License for the specific language governing permissions and limitations under
 the License.
 -->
-<div class="errors-container"></div>
 <form class="js-view-query-update custom-inputs">
 
-<!-- tabs for choosing Keys or Start & end -->
+  <div class="query-group">
+    <span class="add-on">
+      API Options
+      <a class="help-link" href="<%-getDocUrl(documentation)%>" target="_blank">
+        <i class="icon-question-sign"></i>
+      </a>
+    </span>
 
-  <div class="btn-group toggle-btns row-fluid">
-    <label for="showKeys" class="drop-down btn span6">
-     By Key(s)
-    </label>
-    <label for="showStartEnd" class="drop-down btn span6">
-      Between Keys
-    </label>
-  </div>
+    <div class="errors-container"></div>
+    
+      <div class="controls-group">
+        <div class="row-fluid">
+
+            <div class="checkbox inline">
+              <input id="select2" name="include_docs" type="checkbox" value="true">
+              <label for="include_docs">Include Docs</label>
+            </div>
+
+            <% if (hasReduce) { %>
+              <div class="checkbox inline">
+                <input id="check2" name="reduce" type="checkbox" value="true">
+                <label for="check2">Reduce</label>
+              </div>
+       
+              <label id="select1" class="drop-down inline">
+                Group Level
+                <select id="select1" disabled name="group_level" class="input-small">
+                  <option value="0">None</option>
+                  <option value="1">1</option>
+                  <option value="2">2</option>
+                  <option value="3">3</option>
+                  <option value="4">4</option>
+                  <option value="5">5</option>
+                  <option value="6">6</option>
+                  <option value="7">7</option>
+                  <option value="8">8</option>
+                  <option value="9">9</option>
+                  <option value="999" selected="selected">Exact</option>
+                </select>
+              </label>
+            <% } %>
 
-  <div class="controls-group well hide js-query-keys-wrapper">
-    <div class="row-fluid" id="js-showKeys">
-      <div class="controls controls-row">
-        <label for="keys-input" class="drop-down">A key, or an array of keys.</label>
-        <textarea id="keys-input" name="keys" class="input-xxlarge" rows="5" type="text" placeholder='Enter valid JSON; e.g., ["1234"] or ["1234","2345"]'></textarea>
-        <div id="keys-error" class="inline-block js-keys-error"></div>
+        </div>
       </div>
+  </div>
+
+  <div class="query-group">
+    <span class="add-on">
+      Keys
+    </span>
+    <!-- tabs for choosing Keys or Start & end -->
+    <div class="btn-group toggle-btns row-fluid">
+      <label for="showKeys" class="drop-down btn span6">
+       By Key(s)
+      </label>
+      <label for="showStartEnd" class="drop-down btn span6">
+        Between Keys
+      </label>
     </div>
-    <div class="row-fluid hide" id="js-showStartEnd">
-      <div class="controls controls-row">
-        <div class="span6">
-          <label for="startkey" class="drop-down">Start key</label>
-          <input name="startkey" id="startkey" type="text" placeholder='e.g., "1234"' disabled>
+
+    <div class="controls-group well hide js-query-keys-wrapper">
+      <div class="row-fluid" id="js-showKeys">
+        <div class="controls controls-row">
+          <label for="keys-input" class="drop-down">A key, or an array of keys.</label>
+          <textarea id="keys-input" name="keys" class="input-xxlarge" rows="5" type="text" placeholder='Enter valid JSON; e.g., ["1234"] or ["1234","2345"]'></textarea>
+          <div id="keys-error" class="inline-block js-keys-error"></div>
         </div>
-        <div class="span6">
-          <label for="endkey" class="drop-down">End key</label>
-          <input id="endkey" name="endkey" type="text" placeholder='e.g., "1234"'>
-          <div class="controls controls-row checkbox inline">
-            <input id="check5" name="inclusive_end" type="checkbox" value="true" checked disabled>
-            <label for="check5">Include End Key in results</label>
+      </div>
+      <div class="row-fluid hide" id="js-showStartEnd">
+        <div class="controls controls-row">
+          <div>
+            <label for="startkey" class="drop-down">Start key</label>
+            <input name="startkey" id="startkey" type="text" placeholder='e.g., "1234"' disabled>
+          </div>
+          <div>
+            <label for="endkey" class="drop-down">End key</label>
+            <input id="endkey" name="endkey" type="text" placeholder='e.g., "1234"'>
+            <div class="controls controls-row checkbox inline">
+              <input id="check5" name="inclusive_end" type="checkbox" value="true" checked disabled>
+              <label for="check5">Include End Key in results</label>
+            </div>
           </div>
+
         </div>
 
       </div>
-
     </div>
   </div>
 
-<!-- Limit and Skip are conditional -->
-
-  <div class="controls-group">
+  <div class="controls-group query-group">
+    <!-- Limit and Skip are conditional -->
+    <span class="add-on">
+      Additional Parameters
+    </span>
 
     <div class="row-fluid">
-      <div class="span6">
-        <label class="drop-down inline">
+      <% if (showStale) { %>
+        <div class="checkbox inline">
+          <input id="check7" name="stale" type="checkbox" value="ok">
+          <label for="check7">Stale</label>
+        </div>
+      <% } %>
+        <div class="checkbox inline">
+          <input id="check6" name="update_seq" type="checkbox" value="true">
+          <label for="check6">Update Sequence</label>
+        </div>
+
+      <div class="dropdown inline">
+        <label class="drop-down">
           Limit:
-          <select name="limit" class="input-medium">
+          <select name="limit" class="input-small">
             <option selected="selected">None</option>
             <option>5</option>
             <option>10</option>
@@ -69,89 +131,39 @@ the License.
             <option>30</option>
             <option>50</option>
             <option>100</option>
-  		      <option>500</option>
-          </select>
-        </label>
-      </div>
-      <div class="span6">
-        <label for="skipRows" class="inline drop-down">
-          # of rows to skip
-          <input name="skip" class="input-small" type="text" id="skipRows" placeholder="0">
-        </label>
-      </div>
-    </div>
-    <div class="row-fluid">
-      <div class="span6">
-        <label id="select2" class="drop-down inline">
-          Order:
-          <select id="select2" name="descending" class="input-medium">
-            <option value="false">Ascending</option>
-            <option value="true">Descending</option>
-          </select>
-        </label>
-      </div>
-      <div class="span6">
-        <label id="select2" class="drop-down inline">
-          Docs:
-          <select id="select2" name="include_docs" class="input-medium">
-            <option value="false">Exclude</option>
-            <option value="true">Include</option>
+            <option>500</option>
           </select>
         </label>
       </div>
-    </div>
-    <div class="row-fluid">
-      <% if (showStale) { %>
-        <div class="span6">
-          <div class="checkbox inline">
-            <input id="check7" name="stale" type="checkbox" value="ok">
-            <label for="check7">Stale</label>
-          </div>
-        </div>
-      <% } %>
-      <div class="span6 update-seq">
-        <div class="checkbox inline">
-          <input id="check6" name="update_seq" type="checkbox" value="true">
-          <label for="check6">Update Sequence</label>
-        </div>
-      </div>
 
     </div>
-  <% if (hasReduce) { %>
+
     <div class="row-fluid">
-      <div class="span6">
-        <div class="checkbox inline">
-          <input id="check2" name="reduce" type="checkbox" value="true">
-          <label for="check2">Reduce</label>
-        </div>
+      <div class="checkbox inline">
+        <input id="select2" name="descending" type="checkbox" value="true">
+        <label for="descending">Descending</label>
       </div>
-      <div class="span6">
-        <label id="select1" class="drop-down inline">
-          Group Level:
-          <select id="select1" disabled name="group_level" class="input-small">
-            <option value="0">None</option>
-            <option value="1">1</option>
-            <option value="2">2</option>
-            <option value="3">3</option>
-            <option value="4">4</option>
-            <option value="5">5</option>
-            <option value="6">6</option>
-            <option value="7">7</option>
-            <option value="8">8</option>
-            <option value="9">9</option>
-            <option value="999" selected="selected">Exact</option>
-          </select>
+
+      <div class="dropdown inline">
+        <label for="skipRows" class="drop-down">
+          Skip
+          <input name="skip" class="input-small" type="text" id="skipRows" placeholder="# of rows">
         </label>
       </div>
     </div>
-  <% } %>
   </div>
 
-  <div class="controls-group">
+  <div class="controls-group query-group">
+    <span class="add-on">
+      Query the DB
+    </span>
     <div id="button-options" class="controls controls-row">
-      <button type="submit" class="btn btn-success">Query</button>
+      <button type="submit" class="btn btn-success">
+        <i class="fonticon-play icon"></i>
+        Query
+      </button>
     </div>
   </div>
+
 </form>
-</div>
 

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/all_docs_item.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/all_docs_item.html b/app/addons/documents/templates/all_docs_item.html
index a8ef20f..4526df2 100644
--- a/app/addons/documents/templates/all_docs_item.html
+++ b/app/addons/documents/templates/all_docs_item.html
@@ -12,15 +12,21 @@ License for the specific language governing permissions and limitations under
 the License.
 -->
 
-<td class="select"><input <%- checked ? 'checked="checked"' : '' %> type="checkbox" class="js-row-select"></td>
-<td>
-  <div>
+<div class="select"><input <%- checked ? 'checked="checked"' : '' %> type="checkbox" class="js-row-select"></div>
+<div class="doc-item">
+
+  <header>
+    _id <span class="header-id-number">"<%=docID%>"</span>
+
+  <% if (doc.isEditable()) { %>
+    <div class="btn-group">
+      <a href="#<%= doc.url('web-index') %>" class="btn btn-small edits">Edit <%- doc.docType() %></a>
+      <button href="#" class="btn btn-small btn-danger delete" title="Delete this document."><i class="icon icon-trash"></i></button>
+    </div>
+  <% } %>
+  </header>
+  <div class="doc-data">
     <pre class="prettyprint"><%- doc.prettyJSON() %></pre>
-    <% if (doc.isEditable()) { %>
-      <div class="btn-group">
-        <a href="#<%= doc.url('web-index') %>" class="btn btn-small edits">Edit <%- doc.docType() %></a>
-        <button href="#" class="btn btn-small btn-danger delete" title="Delete this document."><i class="icon icon-trash"></i></button>
-      </div>
-    <% } %>
   </div>
-</td>
+</div>
+<div class="clearfix"></div>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/all_docs_list.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/all_docs_list.html b/app/addons/documents/templates/all_docs_list.html
index a643427..d132eb2 100644
--- a/app/addons/documents/templates/all_docs_list.html
+++ b/app/addons/documents/templates/all_docs_list.html
@@ -29,9 +29,9 @@ the License.
   <p>
 
   <div id="item-numbers"> </div>
-  <table class="all-docs table table-striped table-condensed">
-    <tbody></tbody>
-  </table>
+  <div id="doc-list">
+
+  </div>
 
   <% if (endOfResults) { %>
   <div class="text-center well">

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/design_doc_selector.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/design_doc_selector.html b/app/addons/documents/templates/design_doc_selector.html
deleted file mode 100644
index d12cd64..0000000
--- a/app/addons/documents/templates/design_doc_selector.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<!--
-Licensed under the Apache License, Version 2.0 (the "License"); you may not
-use this file except in compliance with the License. You may obtain a copy of
-the License at
-
-  http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-License for the specific language governing permissions and limitations under
-the License.
--->
-<div class="span3">
-  <label for="ddoc">Save to Design Document <a class="help-link" data-bypass="true" href="<%-getDocUrl('design_doc')%>" target="_blank"><i class="icon-question-sign"></i></a></label>
-  <select id="ddoc">
-    <optgroup label="Select a document">
-      <option value="new-doc">New document</option>
-
-      <% ddocs.each(function(ddoc) { %>
-      <%= ddoc.id %>
-      <%= ddocName %>
-      <% if (ddoc.id === ddocName) { %>
-      <option selected="selected" value="<%- ddoc.id %>"><%- ddoc.id %></option>
-      <% } else { %>
-      <option value="<%- ddoc.id %>"><%- ddoc.id %></option>
-      <% } %>
-      <% }); %>
-    </optgroup>
-  </select>
-</div>
-
-<div id="new-ddoc-section" class="span5" style="display:none">
-  <label class="control-label" for="new-ddoc"> _design/ </label>
-  <div class="controls">
-    <input type="text" id="new-ddoc" placeholder="newDesignDoc" />
-  </div>
-</div>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/header_alldocs.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/header_alldocs.html b/app/addons/documents/templates/header_alldocs.html
new file mode 100644
index 0000000..61eb2d8
--- /dev/null
+++ b/app/addons/documents/templates/header_alldocs.html
@@ -0,0 +1,35 @@
+<!--
+Licensed under the Apache License, Version 2.0 (the "License"); you may not
+use this file except in compliance with the License. You may obtain a copy of
+the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+License for the specific language governing permissions and limitations under
+the License.
+-->
+
+<div class="header-left">
+<!--back arrow-->
+
+<!--title with dropdown DB search-->
+
+
+<!-- Menu gear-->
+
+</div>
+
+
+<div class="header-right">
+  <!-- Select all -->
+
+  <!-- search (jump to doc)-->
+
+  <!-- Query Options-->
+
+
+  <!--right margin for api bar-->
+</div>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/header_doc_edit.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/header_doc_edit.html b/app/addons/documents/templates/header_doc_edit.html
new file mode 100644
index 0000000..fbc213f
--- /dev/null
+++ b/app/addons/documents/templates/header_doc_edit.html
@@ -0,0 +1,33 @@
+<!--
+Licensed under the Apache License, Version 2.0 (the "License"); you may not
+use this file except in compliance with the License. You may obtain a copy of
+the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+License for the specific language governing permissions and limitations under
+the License.
+-->
+
+<div class="header-left">
+<!--back arrow-->
+
+<!--title with dropdown DB search-->
+
+<!-- Menu gear-->
+</div>
+
+
+<div class="header-right">
+<!-- Select button-->
+<!-- ? button-->
+<!-- ? button-->
+<!-- ? button-->
+<!-- ? button-->
+<!-- json button-->
+<!-- trash button-->
+<!-- cancel button-->
+</div>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/index_menu_item.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/index_menu_item.html b/app/addons/documents/templates/index_menu_item.html
index 434a02a..cc32d54 100644
--- a/app/addons/documents/templates/index_menu_item.html
+++ b/app/addons/documents/templates/index_menu_item.html
@@ -14,9 +14,9 @@ the License.
 <a class="js-toggle-<%-ddocType%> accordion-header js-collapse-toggle" data-toggle="collapse"  data-target="#<%- removeSpecialCharacters(ddoc) + ddocType %>" id="nav-design-function-<%= removeSpecialCharacters(ddoc) + ddocType %>">
   <div class="fonticon-play"></div>
   <span class="<%- icon %> fonticon"></span>
-  <%- name %>
-  </a>
-  <ul class="accordion-body collapse" id="<%- removeSpecialCharacters(ddoc) + ddocType %>">
+  <%- ddocType %>
+</a>
+<ul class="accordion-body collapse" id="<%- removeSpecialCharacters(ddoc) + ddocType %>">
   <% _.each(collection, function (item, index) { %>
   <li>
   <a data-ddoctype="<%- ddocType %>" id="<%- removeSpecialCharacters(ddoc) %>_<%- removeSpecialCharacters(index) %>" href="#/database/<%- safeURL(database) %>/_design/<%= safeURL(ddoc)%>/_<%-ddocType%>/<%= safeURL(index) %>" class="toggle-view">

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/index_row_docular.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/index_row_docular.html b/app/addons/documents/templates/index_row_docular.html
deleted file mode 100644
index e8973ad..0000000
--- a/app/addons/documents/templates/index_row_docular.html
+++ /dev/null
@@ -1,29 +0,0 @@
-<!--
-Licensed under the Apache License, Version 2.0 (the "License"); you may not
-use this file except in compliance with the License. You may obtain a copy of
-the License at
-
-  http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-License for the specific language governing permissions and limitations under
-the License.
--->
-<% if (doc.isEditable()) { %>
-  <td class="select"><input type="checkbox"></td>
-<% } %>
-<td>
-  <div>
-    <pre class="prettyprint"><%- doc.prettyJSON() %></pre>
-
-      <div class="btn-group">
-        <a href="#<%= url %>" class="btn btn-small edits">Edit <%= doc.docType() %></a>
-        <% if (doc.isEditable()) { %>
-          <button href="#" class="btn btn-small btn-danger delete" title="Delete this document."><i class="icon icon-trash"></i></button>
-        <% } %>
-      </div>
-
-  </div>
-</td>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/index_row_tabular.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/index_row_tabular.html b/app/addons/documents/templates/index_row_tabular.html
deleted file mode 100644
index f5f68fa..0000000
--- a/app/addons/documents/templates/index_row_tabular.html
+++ /dev/null
@@ -1,25 +0,0 @@
-<!--
-Licensed under the Apache License, Version 2.0 (the "License"); you may not
-use this file except in compliance with the License. You may obtain a copy of
-the License at
-
-  http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-License for the specific language governing permissions and limitations under
-the License.
--->
-
-<td class="select"><input type="checkbox"></td>
-<td>
-  <div>
-    <pre class="prettyprint"><%- JSON.stringify(doc.get("key")) %></pre>
-  </div>
-</td>
-<td>
-  <div>
-    <pre class="prettyprint"><%- JSON.stringify(doc.get("value")) %></pre>
-  </div>
-</td>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/templates/view_editor.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/view_editor.html b/app/addons/documents/templates/view_editor.html
index 769deed..e69de29 100644
--- a/app/addons/documents/templates/view_editor.html
+++ b/app/addons/documents/templates/view_editor.html
@@ -1,91 +0,0 @@
-<!--
-Licensed under the Apache License, Version 2.0 (the "License"); you may not
-use this file except in compliance with the License. You may obtain a copy of
-the License at
-
-  http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-License for the specific language governing permissions and limitations under
-the License.
--->
-<div class="dashboard-upper-menu">
-  <ul class="nav nav-tabs" id="db-views-tabs-nav">
-    <li class="active"> <a data-bypass="true" id="index-nav" data-toggle="tab" href="#index">
-      <i class="fonticon-wrench fonticon"></i>
-      <% if (newView) { %>Create Index <% } else { %>Edit Index <% } %></a></li>
-    <% if (!newView) { %>
-    <li><a data-bypass="true" id="query-nav" href="#query" data-toggle="tab">
-      <i class="fonticon-plus fonticon"></i> Query Options</a>
-    </li>
-    <% } %>
-  </ul>
-</div>
-  <div class="all-docs-list errors-container"></div>
-  <div class="tab-content">
-	 <div id="query-options-wrapper"></div>
-    <div class="tab-pane active" id="index">
-      <div id="define-view" class="ddoc-alert well">
-        <div class="errors-container"></div>
-        <form class="form-horizontal view-query-save">
-
-          <div class="control-group design-doc-group">
-          </div>
-
-          <div class="control-group">
-            <label for="index-name">Index name <a class="help-link" data-bypass="true" href="<%-getDocUrl('view_functions')%>" target="_blank"><i class="icon-question-sign"></i></a></label>
-            <input type="text" id="index-name" value="<%- viewName %>" placeholder="Index name" />
-          </div>
-
-
-          <div class="control-group">
-            <label for="map-function">Map function <a class="help-link" data-bypass="true" href="<%-getDocUrl('map_functions')%>" target="_blank"><i class="icon-question-sign"></i></a></label>
-            <% if (newView) { %>
-            <div class="js-editor" id="map-function"><%= langTemplates.map %></div>
-            <% } else { %>
-            <div class="js-editor" id="map-function"><%- ddoc.get('views')[viewName].map %></div>
-            <button class="beautify beautify_map btn btn-primary btn-large hide beautify-tooltip" type="button" data-toggle="tooltip" title="Reformat your minified code to make edits to it.">beautify this code</button>
-            <% } %>
-          </div>
-
-
-          <div class="control-group">
-            <label for="reduce-function-selector">Reduce (optional) <a class="help-link" data-bypass="true" href="<%-getDocUrl('reduce_functions')%>" target="_blank"><i class="icon-question-sign"></i></a></label>
-
-            <select id="reduce-function-selector">
-              <option value="" <%- !reduceFunStr ? 'selected="selected"' : '' %>>None</option>
-              <% _.each(["_sum", "_count", "_stats"], function(reduce) { %>
-              <option value="<%- reduce %>" <% if (reduce == reduceFunStr) { %>selected<% } %>><%= reduce %></option>
-              <% }) %>
-              <option value="CUSTOM" <% if (isCustomReduce) { %>selected<% } %>>Custom Reduce function</option>
-            </select>
-          </div>
-
-          <div class="control-group reduce-function">
-            <label for="reduce-function">Custom Reduce function</label>
-            <% if (newView) { %>
-            <div class="js-editor" id="reduce-function"><%- langTemplates.reduce %></div>
-            <% } else { %>
-            <div class="js-editor" id="reduce-function"><%- ddoc.get('views')[viewName].reduce %></div>
-            <button class="beautify beautify_reduce btn btn-primary btn-large hide beautify-tooltip" type="button" data-toggle="tooltip" title="Reformat your minified code to make edits to it.">beautify this code</button>
-            <% } %>
-          </div>
-
-          <div class="control-group">
-            <button class="btn btn-success save"><i class="icon fonticon-ok-circled"></i> Save &amp; Build Index</button>
-            <% if (!newView) { %>
-            <button class="btn btn-danger delete"><i class="icon fonticon-cancel-circled"></i> Delete</button>
-            <% } %>
-          </div>
-          <div class="clearfix"></div>
-        </form>
-      </div>
-    </div>
-    <div class="tab-pane" id="metadata">
-      <div id="ddoc-info" class="well"> </div>
-    </div>
-    <div class="tab-pane" id="query">
-    </div>
-  </div>

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/views-index.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/views-index.js b/app/addons/documents/views-index.js
deleted file mode 100644
index d0ed8ed..0000000
--- a/app/addons/documents/views-index.js
+++ /dev/null
@@ -1,574 +0,0 @@
-// Licensed under the Apache License, Version 2.0 (the "License"); you may not
-// use this file except in compliance with the License. You may obtain a copy of
-// the License at
-//
-//   http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
-// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
-// License for the specific language governing permissions and limitations under
-// the License.
-
-define([
-  "app",
-
-  "api",
-  "addons/fauxton/components",
-
-  "addons/documents/resources",
-  "addons/databases/resources",
-  "addons/pouchdb/base",
-  //views
-  "addons/documents/views-advancedopts",
-  // Libs
-  "addons/fauxton/resizeColumns",
-
-  // Plugins
-  "plugins/beautify",
-  "plugins/prettify"
-],
-
-function(app, FauxtonAPI, Components, Documents, Databases, pouchdb,
-         QueryOptions, resizeColumns, beautify, prettify) {
-
-  var Views = {};
-
-  Views.ViewEditor = FauxtonAPI.View.extend({
-    template: "addons/documents/templates/view_editor",
-    builtinReduces: ['_sum', '_count', '_stats'],
-
-    events: {
-      "click button.save": "saveView",
-      "click button.delete": "deleteView",
-      "change select#reduce-function-selector": "updateReduce",
-      "click button.preview": "previewView",
-      "click #db-views-tabs-nav": 'toggleIndexNav',
-      "click .beautify_map":  "beautifyCode",
-      "click .beautify_reduce":  "beautifyCode",
-      "click #query-options-wrapper": 'toggleIndexNav'
-    },
-
-    langTemplates: {
-      "javascript": {
-        map: "function(doc) {\n  emit(doc._id, 1);\n}",
-        reduce: "function(keys, values, rereduce){\n  if (rereduce){\n    return sum(values);\n  } else {\n    return values.length;\n  }\n}"
-      }
-    },
-
-    defaultLang: "javascript",
-
-    initialize: function(options) {
-      this.newView = options.newView || false;
-      this.ddocs = options.ddocs;
-      this.params = options.params;
-      this.database = options.database;
-      this.currentDdoc = options.currentddoc;
-      if (this.newView) {
-        this.viewName = 'newView';
-      } else {
-        this.ddocID = options.ddocInfo.id;
-        this.viewName = options.viewName;
-        this.ddocInfo = new Documents.DdocInfo({_id: this.ddocID},{database: this.database});
-      }
-
-      this.showIndex = false;
-      _.bindAll(this);
-    },
-
-    establish: function () {
-      if (this.ddocInfo) {
-        return this.ddocInfo.fetch();
-      }
-    },
-
-    updateValues: function() {
-      var notification;
-      if (this.model.changedAttributes()) {
-        notification = FauxtonAPI.addNotification({
-          msg: "Document saved successfully.",
-          type: "success",
-          clear: true
-        });
-        this.editor.setValue(this.model.prettyJSON());
-      }
-    },
-
-    updateReduce: function(event) {
-      var $ele = $("#reduce-function-selector");
-      var $reduceContainer = $(".control-group.reduce-function");
-      if ($ele.val() == "CUSTOM") {
-        this.createReduceEditor();
-        this.reduceEditor.setValue(this.langTemplates.javascript.reduce);
-        $reduceContainer.show();
-      } else {
-        $reduceContainer.hide();
-      }
-    },
-
-    deleteView: function (event) {
-      event.preventDefault();
-
-      if (this.newView) { return alert('Cannot delete a new view.'); }
-      if (!confirm('Are you sure you want to delete this view?')) {return;}
-
-      var that = this,
-          promise,
-          viewName = this.$('#index-name').val(),
-          ddocName = this.$('#ddoc :selected').val(),
-          ddoc = this.getCurrentDesignDoc();
-
-      ddoc.removeDdocView(viewName);
-
-      if (ddoc.hasViews()) {
-        promise = ddoc.save();
-      } else {
-        promise = ddoc.destroy();
-      }
-
-      promise.then(function () {
-        FauxtonAPI.navigate('/database/' + that.database.safeID() + '/_all_docs?limit=' + Databases.DocLimit);
-        FauxtonAPI.triggerRouteEvent('reloadDesignDocs');
-      });
-    },
-
-    saveView: function(event) {
-      var json, notification,
-      that = this;
-
-      if (event) { event.preventDefault();}
-
-      $('#dashboard-content').scrollTop(0); //scroll up
-
-      if (this.hasValidCode() && this.$('#new-ddoc:visible').val() !=="") {
-        var mapVal = this.mapEditor.getValue(),
-        reduceVal = this.reduceVal(),
-        viewName = this.$('#index-name').val(),
-        ddoc = this.getCurrentDesignDoc(),
-        ddocName = ddoc.id,
-        viewNameChange = false;
-
-        if (this.viewName !== viewName) {
-          ddoc.removeDdocView(this.viewName);
-          this.viewName = viewName;
-          viewNameChange = true;
-        }
-
-        notification = FauxtonAPI.addNotification({
-          msg: "Saving document.",
-          selector: "#define-view .errors-container",
-          clear: true
-        });
-
-        ddoc.setDdocView(viewName, mapVal, reduceVal);
-
-        ddoc.save().then(function () {
-          that.ddocs.add(ddoc);
-
-          that.mapEditor.editSaved();
-          that.reduceEditor && that.reduceEditor.editSaved();
-
-
-          FauxtonAPI.addNotification({
-            msg: "View has been saved.",
-            type: "success",
-            selector: "#define-view .errors-container",
-            clear: true
-          });
-
-          if (that.newView || viewNameChange) {
-            var fragment = '/database/' + that.database.safeID() +'/' + ddoc.safeID() + '/_view/' + app.utils.safeURLName(viewName);
-
-            FauxtonAPI.navigate(fragment, {trigger: false});
-            that.newView = false;
-            that.ddocID = ddoc.safeID();
-            that.viewName = viewName;
-            that.ddocInfo = ddoc;
-            that.showIndex = true;
-            that.render();
-            FauxtonAPI.triggerRouteEvent('reloadDesignDocs', {
-              selectedTab: app.utils.removeSpecialCharacters(ddocName.replace(/_design\//,'')) + '_' + app.utils.removeSpecialCharacters(viewName)
-            });
-          }
-
-          if (that.reduceFunStr !== reduceVal) {
-            that.reduceFunStr = reduceVal;
-            that.advancedOptions.renderOnUpdatehasReduce(that.hasReduce());
-          }
-
-          FauxtonAPI.triggerRouteEvent('updateAllDocs', {ddoc: ddocName, view: viewName});
-
-        }, function(xhr) {
-          var responseText = JSON.parse(xhr.responseText).reason;
-          notification = FauxtonAPI.addNotification({
-            msg: "Save failed: " + responseText,
-            type: "error",
-            clear: true
-          });
-        });
-      } else {
-        var errormessage = (this.$('#new-ddoc:visible').val() ==="")?"Enter a design doc name":"Please fix the Javascript errors and try again.";
-        notification = FauxtonAPI.addNotification({
-          msg: errormessage,
-          type: "error",
-          selector: "#define-view .errors-container",
-          clear: true
-        });
-      }
-    },
-
-    updateView: function(event, paramInfo) {
-       event.preventDefault();
-
-       if (this.newView) { return alert('Please save this new view before querying it.'); }
-
-       var errorParams = paramInfo.errorParams,
-           params = paramInfo.params;
-
-       if (_.any(errorParams)) {
-         _.map(errorParams, function(param) {
-
-           // TODO: Where to add this error?
-           // bootstrap wants the error on a control-group div, but we're not using that
-           //$('form.view-query-update input[name='+param+'], form.view-query-update select[name='+param+']').addClass('error');
-           return FauxtonAPI.addNotification({
-             msg: "JSON Parse Error on field: "+param.name,
-             type: "error",
-             selector: ".advanced-options .errors-container",
-             clear: true
-           });
-         });
-         FauxtonAPI.addNotification({
-           msg: "Make sure that strings are properly quoted and any other values are valid JSON structures",
-           type: "warning",
-           selector: ".advanced-options .errors-container",
-           clear: true
-         });
-
-         return false;
-      }
-
-       var fragment = window.location.hash.replace(/\?.*$/, '');
-       if (!_.isEmpty(params)) {
-        fragment = fragment + '?' + $.param(params);
-       }
-
-       FauxtonAPI.navigate(fragment, {trigger: false});
-       FauxtonAPI.triggerRouteEvent('updateAllDocs', {ddoc: this.ddocID, view: this.viewName});
-    },
-
-
-    previewView: function(event, paramsInfo) {
-      event.preventDefault();
-      var that = this,
-      mapVal = this.mapVal(),
-      reduceVal = this.reduceVal(),
-      paramsArr = [];
-
-      if (paramsInfo && paramsInfo.params) {
-        paramsArr = paramsInfo.params;
-      }
-
-      var params = _.reduce(paramsArr, function (params, param) {
-        params[param.name] = param.value;
-        return params;
-      }, {reduce: false});
-
-      FauxtonAPI.addNotification({
-        msg: "<strong>Warning!</strong> Preview executes the Map/Reduce functions in your browser, and may behave differently from CouchDB.",
-        type: "warning",
-        selector: ".advanced-options .errors-container",
-        fade: true,
-        escape: false // beware of possible XSS when the message changes
-      });
-
-      var promise = FauxtonAPI.Deferred();
-
-      if (!this.database.allDocs || this.database.allDocs.params.include_docs !== true) {
-        this.database.buildAllDocs({limit: Databases.DocLimit.toString(), include_docs: true});
-        promise = this.database.allDocs.fetch();
-       } else {
-        promise.resolve();
-       }
-
-      promise.then(function () {
-        params.docs = that.database.allDocs.map(function (model) { return model.get('doc');});
-        var queryPromise = pouchdb.runViewQuery({map: mapVal, reduce: reduceVal}, params);
-        queryPromise.then(function (results) {
-          FauxtonAPI.triggerRouteEvent('updatePreviewDocs', {rows: results.rows, ddoc: that.getCurrentDesignDoc().id, view: that.viewName});
-        });
-      });
-    },
-
-    getCurrentDesignDoc: function () {
-      return this.designDocSelector.getCurrentDesignDoc();
-    },
-
-    isCustomReduceEnabled: function() {
-      return $("#reduce-function-selector").val() == "CUSTOM";
-    },
-
-    mapVal: function () {
-      if (this.mapEditor) {
-        return this.mapEditor.getValue();
-      }
-
-      return this.$('#map-function').text();
-    },
-
-    reduceVal: function() {
-      var reduceOption = this.$('#reduce-function-selector :selected').val(),
-      reduceVal = "";
-
-      if (reduceOption === 'CUSTOM') {
-        if (!this.reduceEditor) { this.createReduceEditor(); }
-        reduceVal = this.reduceEditor.getValue();
-      } else if ( reduceOption !== 'NONE') {
-        reduceVal = reduceOption;
-      }
-
-      return reduceVal;
-    },
-
-
-    hasValidCode: function() {
-      return _.every(["mapEditor", "reduceEditor"], function(editorName) {
-        var editor = this[editorName];
-        if (editorName === "reduceEditor" && ! this.isCustomReduceEnabled()) {
-          return true;
-        }
-        return editor.hadValidCode();
-      }, this);
-    },
-
-    toggleIndexNav: function (event) {
-      $('#dashboard-content').scrollTop(0); //scroll up
-
-      var $targetId = this.$(event.target).attr('id'),
-          $previousTab = this.$(this.$('li.active a').attr('href')),
-          $targetTab = this.$(this.$(event.target).attr('href'));
-
-      if ($targetTab.attr('id') !== $previousTab.attr('id')) {
-        $previousTab.removeAttr('style');
-      }
-
-      if ($targetId === 'index-nav') {
-        if (this.newView) { return; }
-        var that = this;
-        $('#dashboard-content').scrollTop(0); //scroll up
-        $targetTab.toggle('slow', function(){
-           that.showEditors();
-        });
-      } else {
-        $targetTab.toggle('slow');
-      }
-    },
-
-    serialize: function() {
-      return {
-        ddocs: this.ddocs,
-        ddoc: this.model,
-        ddocName: this.model.id,
-        viewName: this.viewName,
-        reduceFunStr: this.reduceFunStr,
-        isCustomReduce: this.hasCustomReduce(),
-        newView: this.newView,
-        langTemplates: this.langTemplates.javascript
-      };
-    },
-
-    hasCustomReduce: function() {
-      return this.reduceFunStr && ! _.contains(this.builtinReduces, this.reduceFunStr);
-    },
-
-    hasReduce: function () {
-      return this.reduceFunStr || false;
-    },
-
-    createReduceEditor: function () {
-      if (this.reduceEditor) {
-        this.reduceEditor.remove();
-      }
-
-      this.reduceEditor = new Components.Editor({
-        editorId: "reduce-function",
-        mode: "javascript",
-        couchJSHINT: true
-      });
-      this.reduceEditor.render();
-
-      if (this.reduceEditor.getLines() === 1){
-        this.$('.beautify_reduce').removeClass("hide");
-        $('.beautify-tooltip').tooltip();
-      }
-    },
-    beforeRender: function () {
-
-      if (this.newView) {
-        this.reduceFunStr = '';
-        if (this.ddocs.length === 0) {
-          this.model = new Documents.Doc(null, {database: this.database});
-        } else {
-          this.model = this.ddocs.first().dDocModel();
-        }
-        this.ddocID = this.model.id;
-      } else {
-        var ddocDecode = decodeURIComponent(this.ddocID);
-        this.model = this.ddocs.get(this.ddocID).dDocModel();
-        this.reduceFunStr = this.model.viewHasReduce(this.viewName);
-      }
-
-      var viewFilters = FauxtonAPI.getExtensions('sidebar:viewFilters'),
-          filteredModels = this.ddocs.models,
-          designDocs = this.ddocs.clone();
-
-      if (!_.isEmpty(viewFilters)) {
-        _.each(viewFilters, function (filter) {
-          filteredModels = _.filter(filteredModels, filter);
-        });
-        designDocs.reset(filteredModels, {silent: true});
-      }
-
-      this.designDocSelector = this.setView('.design-doc-group', new Views.DesignDocSelector({
-        collection: designDocs,
-        ddocName: this.currentDdoc || this.model.id,
-        database: this.database
-      }));
-
-      if (!this.newView) {
-        this.eventer = _.extend({}, Backbone.Events);
-
-        this.advancedOptions = this.insertView('#query', new QueryOptions.AdvancedOptions({
-          updateViewFn: this.updateView,
-          previewFn: this.previewView,
-          database: this.database,
-          viewName: this.viewName,
-          ddocName: this.model.id,
-          hasReduce: this.hasReduce(),
-          eventer: this.eventer,
-          showStale: true
-        }));
-      }
-
-    },
-
-    afterRender: function() {
-
-      if (this.params && !this.newView) {
-        this.advancedOptions.updateFromParams(this.params);
-      }
-
-      this.designDocSelector.updateDesignDoc();
-      if (this.newView || this.showIndex) {
-        this.showEditors();
-        this.showIndex = false;
-      } else {
-        this.$('#index').hide();
-        this.$('#index-nav').parent().removeClass('active');
-      }
-
-    },
-
-    showEditors: function () {
-      this.mapEditor = new Components.Editor({
-        editorId: "map-function",
-        mode: "javascript",
-        couchJSHINT: true
-      });
-      this.mapEditor.render();
-
-      if (this.hasCustomReduce()) {
-        this.createReduceEditor();
-      } else {
-        $(".control-group.reduce-function").hide();
-      }
-
-      if (this.newView) {
-        this.mapEditor.setValue(this.langTemplates[this.defaultLang].map);
-        //Use a built in view by default
-        //this.reduceEditor.setValue(this.langTemplates[this.defaultLang].reduce);
-      }
-
-      this.mapEditor.editSaved();
-      this.reduceEditor && this.reduceEditor.editSaved();
-
-      if (this.mapEditor.getLines() === 1){
-        this.$('.beautify_map').removeClass("hide");
-        $('.beautify-tooltip').tooltip();
-      }
-    },
-    beautifyCode: function(e){
-      e.preventDefault();
-      var targetEditor = $(e.currentTarget).hasClass('beautify_reduce')?this.reduceEditor:this.mapEditor;
-      var beautifiedCode = beautify(targetEditor.getValue());
-      targetEditor.setValue(beautifiedCode);
-    },
-    cleanup: function () {
-      this.mapEditor && this.mapEditor.remove();
-      this.reduceEditor && this.reduceEditor.remove();
-    }
-  });
-
-  Views.DesignDocSelector = FauxtonAPI.View.extend({
-    template: "addons/documents/templates/design_doc_selector",
-
-    events: {
-      "change select#ddoc": "updateDesignDoc"
-    },
-
-    initialize: function (options) {
-      this.ddocName = options.ddocName;
-      this.database = options.database;
-      this.listenTo(this.collection, 'add', this.ddocAdded);
-      this.DocModel = options.DocModel || Documents.Doc;
-    },
-
-    ddocAdded: function (ddoc) {
-      this.ddocName = ddoc.id;
-      this.render();
-    },
-
-    serialize: function () {
-      return {
-        ddocName: this.ddocName,
-        ddocs: this.collection
-      };
-    },
-
-    updateDesignDoc: function () {
-      if (this.newDesignDoc()) {
-        this.$('#new-ddoc-section').show();
-      } else {
-        this.$('#new-ddoc-section').hide();
-      }
-    },
-
-    newDesignDoc: function () {
-
-      return this.$('#ddoc').val() === 'new-doc';
-    },
-
-    newDocValidation: function(){
-      return this.newDesignDoc() && this.$('#new-ddoc').val()==="";
-    },
-    getCurrentDesignDoc: function () {
-      if (this.newDesignDoc()) {
-        var doc = {
-          _id: '_design/' + this.$('#new-ddoc').val(),
-          views: {},
-          language: "javascript"
-        };
-        var ddoc = new this.DocModel(doc, {database: this.database});
-        //this.collection.add(ddoc);
-        return ddoc;
-      } else if ( !this.newDesignDoc() ) {
-        var ddocName = this.$('#ddoc').val();
-        return this.collection.find(function (ddoc) {
-          return ddoc.id === ddocName;
-        }).dDocModel();
-      }
-    }
-  });
-
-  return Views;
-});

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/views-sidebar.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/views-sidebar.js b/app/addons/documents/views-sidebar.js
index 9f8c0ee..2c53b1b 100644
--- a/app/addons/documents/views-sidebar.js
+++ b/app/addons/documents/views-sidebar.js
@@ -151,16 +151,23 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
     toggleArrow:  function(e){
       this.$(e.currentTarget).toggleClass("down");
     },
-    buildIndexList: function(collection, info){
+
+    buildIndexList: function(collection, indexType){
       var design = this.model.id.replace(/^_design\//,"");
+      var selector = indexType.selector;
+      var ddocType = indexType.ddocType;
+      var icon = indexType.icon;
+
+
+        this.insertView(".accordion-body", new Views.IndexItem({
+          selector: selector,
+          ddoc: design,
+          collection: collection[selector],
+          ddocType: ddocType,
+          database: this.model.collection.database.id,
+          icon: icon
+        }));
 
-      this.insertView(".accordion-body", new Views.IndexItem({
-        selector: info.selector,
-        ddoc: design,
-        collection: collection[info.selector],
-        name: info.name,
-        database: this.model.collection.database.id
-      }));
     },
 
     serialize: function(){
@@ -176,23 +183,19 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
 
     getSidebarLinks: function () {
       var ddocName = this.model.id.replace(/^_design\//,""),
-          docSafe = app.utils.safeURLName(ddocName), 
+          docSafe = app.utils.safeURLName(ddocName),
           database = this.collection.database;
 
       return _.reduce(FauxtonAPI.getExtensions('sidebar:links'), function (menuLinks, link) {
 
         menuLinks.push({
           title: link.title,
-          url: "#" + database.url('app') + "/" + link.url + "/" + docSafe,
+          url: "#" + database.url('app') + "/_design/" + docSafe + "/" + link.url,
           icon: 'fonticon-plus-circled'
         });
 
-        return menuLinks; 
-     }, [{
-      title: 'New View',
-      url: "#" + database.url('app') + "/new_view/" + docSafe,
-      icon: 'fonticon-plus-circled'
-     }]);
+        return menuLinks;
+     }, []);
 
     },
 
@@ -202,13 +205,9 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
 
       if (!ddocDocs){ return; }
 
-      this.buildIndexList(ddocDocs, {
-        selector: "views",
-        name: 'Views'
-      });
-
-      _.each(sidebarListTypes, function (info) {
-        this.buildIndexList(ddocDocs, info);
+      //this.buildIndexList(ddocDocs, "views", "view");
+      _.each(sidebarListTypes, function (listType) {
+        this.buildIndexList(ddocDocs, listType);
       },this);
 
     },
@@ -228,6 +227,7 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
     }
   });
 
+  //Sidebar Index Item
   Views.IndexItem = FauxtonAPI.View.extend({
     template: "addons/documents/templates/index_menu_item",
     tagName: 'li',
@@ -238,19 +238,15 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
       this.database = options.database;
       this.selected = !! options.selected;
       this.selector = options.selector;
-      this.name = options.name;
-      this.icons = {
-        "Views": "fonticon-sidenav-map-reduce",
-        "indexes": "fonticon-sidenav-search"
-      };
+      this.ddocType = options.ddocType || this.selector;
+      this.icon = options.icon;
 
     },
 
     serialize: function() {
       return {
-        icon: this.icons[this.ddocType],
-        ddocType:  this.selector,
-        name: this.name,
+        icon: this.icon,
+        ddocType:  this.ddocType,
         index: this.index,
         ddoc: this.ddoc,
         database: this.database,
@@ -258,7 +254,6 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
         collection: this.collection
       };
     },
-
     afterRender: function() {
       if (this.selected) {
         $(".sidenav ul.nav-list li").removeClass("active");
@@ -267,6 +262,8 @@ function(app, FauxtonAPI, Components, Documents, Databases) {
     }
   });
 
+
+
   return Views;
 });
 

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/documents/views.js
----------------------------------------------------------------------
diff --git a/app/addons/documents/views.js b/app/addons/documents/views.js
index 7085bd8..45a2718 100644
--- a/app/addons/documents/views.js
+++ b/app/addons/documents/views.js
@@ -38,6 +38,75 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
     });
   }
 
+  //Header for alldocs with search, back, Menu, Query options, select etc
+  Views.AllDocsHeader = FauxtonAPI.View.extend({
+    template: "addons/documents/templates/header_alldocs",
+    events: {
+      'select .selectAllDocs': 'selectAllDocs'
+    },
+    initialize: function(options){
+
+    },
+    selectAllDocs: function(){
+      //trigger event to select all in other view
+    },
+    afterRender:function(){
+      //insert DB search dropdown
+
+      //insert top create level dropdown with gear icon
+
+      //search docs
+
+      //insert queryoptions
+
+    }
+  });
+
+
+  //header that shows up when a doc is selected
+  // when a Doc is selected, trigger a routeEvent to render this
+  // the routeEvent will determine which header to show (??)
+  Views.DocEditHeader = FauxtonAPI.View.extend({
+    template: "addons/documents/templates/header_doc_edit",
+    events: {
+      'select .selectAllDocs': 'selectAllDocs'
+    },
+    initialize: function(options){
+
+    },
+    selectAllDocs: function(){
+      //trigger event to select all in other view
+    },
+    afterRender:function(){
+      //insert DB search dropdown
+
+      //insert top create level dropdown with gear icon
+    }
+  });
+
+  Views.DocsHeader = FauxtonAPI.View.extend({
+    template: "addons/documents/templates/header_selecteddoc",
+    events: {
+      'select .selectAllDocs': 'selectAllDocs'
+    },
+    initialize: function(options){
+
+    },
+    selectAllDocs: function(){
+      //trigger event to select all in other view
+    },
+    afterRender:function(){
+      //insert DB search dropdown
+
+      //insert top create level dropdown with gear icon
+
+      //search docs
+
+      //insert queryoptions
+
+    }
+  });
+
 
   Views.DeleteDBModal = Components.ModalView.extend({
     template: "addons/documents/templates/delete_database_modal",
@@ -83,9 +152,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
 
   Views.Document = FauxtonAPI.View.extend({
     template: "addons/documents/templates/all_docs_item",
-    tagName: "tr",
-    className: "all-docs-item",
-
+    className: "all-docs-item doc-row",
     initialize: function (options) {
       this.checked = options.checked;
     },
@@ -103,6 +170,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
 
     serialize: function() {
       return {
+        docID: this.model.get('_id'),
         doc: this.model,
         checked: this.checked
       };
@@ -148,27 +216,6 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
     }
   });
 
-  Views.Row = FauxtonAPI.View.extend({
-    template: "addons/documents/templates/index_row_docular",
-    tagName: "tr",
-
-    events: {
-      "click button.delete": "destroy"
-    },
-
-    destroy: function (event) {
-      event.preventDefault();
-
-      window.alert('Cannot delete a document generated from a view.');
-    },
-
-    serialize: function() {
-      return {
-        doc: this.model,
-        url: this.model.url('app')
-      };
-    }
-  });
 
 
   Views.AllDocsNumber = FauxtonAPI.View.extend({
@@ -378,7 +425,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
     },
 
     toggleDocument: function (event) {
-      var $row = this.$(event.target).closest('tr'),
+      var $row = this.$(event.target).closest('.doc-row'),
           docId = $row.attr('data-id'),
           rev = this.collection.get(docId).get('_rev'),
           data = {_id: docId, _rev: rev, _deleted: true};
@@ -535,7 +582,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions,
         if (this.bulkDeleteDocsCollection) {
           isChecked = this.bulkDeleteDocsCollection.get(doc.id);
         }
-        this.rows[doc.id] = this.insertView("table.all-docs tbody", new this.nestedView({
+        this.rows[doc.id] = this.insertView("#doc-list", new this.nestedView({
           model: doc,
           checked: isChecked
         }));

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/fauxton/base.js
----------------------------------------------------------------------
diff --git a/app/addons/fauxton/base.js b/app/addons/fauxton/base.js
index 8b88d36..68ee7cd 100644
--- a/app/addons/fauxton/base.js
+++ b/app/addons/fauxton/base.js
@@ -14,11 +14,10 @@ define([
   "app",
   "api",
   "addons/fauxton/resizeColumns",
-  "addons/fauxton/components",
-  "plugins/zeroclipboard/ZeroClipboard"
+  "addons/fauxton/components"
 ],
 
-function(app, FauxtonAPI, resizeColumns, Components, ZeroClipboard) {
+function(app, FauxtonAPI, resizeColumns, Components) {
 
   var Fauxton = FauxtonAPI.addon();
   FauxtonAPI.addNotification = function (options) {
@@ -51,7 +50,7 @@ function(app, FauxtonAPI, resizeColumns, Components, ZeroClipboard) {
   Fauxton.initialize = function () {
     // app.footer = new Fauxton.Footer({el: "#footer-content"}),
     app.navBar = new Fauxton.NavBar();
-    app.apiBar = new Fauxton.ApiBar();
+    app.apiBar = new Components.ApiBar();
 
     FauxtonAPI.when.apply(null, app.navBar.establish()).done(function() {
       FauxtonAPI.masterLayout.setView("#primary-navbar", app.navBar, true);
@@ -77,7 +76,7 @@ function(app, FauxtonAPI, resizeColumns, Components, ZeroClipboard) {
       var crumbs = routeObject.get('crumbs');
 
       if (crumbs.length) {
-        FauxtonAPI.masterLayout.setView('#breadcrumbs', new Fauxton.Breadcrumbs({
+        FauxtonAPI.masterLayout.setView('#breadcrumbs', new Components.Breadcrumbs({
           crumbs: crumbs
         }), true).render();
       }
@@ -93,20 +92,7 @@ function(app, FauxtonAPI, resizeColumns, Components, ZeroClipboard) {
     });
   };
 
-  Fauxton.Breadcrumbs = FauxtonAPI.View.extend({
-    template: "addons/fauxton/templates/breadcrumbs",
 
-    serialize: function() {
-      var crumbs = _.clone(this.crumbs);
-      return {
-        crumbs: crumbs
-      };
-    },
-
-    initialize: function(options) {
-      this.crumbs = options.crumbs;
-    }
-  });
 
   Fauxton.VersionInfo = Backbone.Model.extend({
     url: function () {
@@ -259,64 +245,6 @@ function(app, FauxtonAPI, resizeColumns, Components, ZeroClipboard) {
     // TODO: ADD ACTIVE CLASS
   });
 
-  Fauxton.ApiBar = FauxtonAPI.View.extend({
-    template: "addons/fauxton/templates/api_bar",
-    endpoint: '_all_docs',
-
-    documentation: 'docs',
-
-    events:  {
-      "click .api-url-btn" : "toggleAPIbar"
-    },
-
-    toggleAPIbar: function(e){
-      var $currentTarget = $(e.currentTarget).find('span');
-      if ($currentTarget.hasClass("fonticon-plus")){
-        $currentTarget.removeClass("fonticon-plus").addClass("fonticon-minus");
-      }else{
-        $currentTarget.removeClass("fonticon-minus").addClass("fonticon-plus");
-      }
-      $('.api-navbar').toggle();
-    },
-
-    serialize: function() {
-      return {
-        endpoint: this.endpoint,
-        documentation: this.documentation
-      };
-    },
-
-    hide: function(){
-      this.$el.addClass('hide');
-    },
-    show: function(){
-      this.$el.removeClass('hide');
-    },
-    update: function(endpoint) {
-      this.show();
-      this.endpoint = endpoint[0];
-      this.documentation = endpoint[1];
-      this.render();
-    },
-    afterRender: function(){
-      var client = new Components.Clipboard({
-        $el: this.$('.copy-url')
-      });
-
-      client.on("load", function(e){
-        var $apiInput = $('#api-navbar input');
-        var copyURLTimer;
-        client.on("mouseup", function(e){
-          $apiInput.css("background-color","#aaa");
-          window.clearTimeout(copyURLTimer);
-          copyURLTimer = setInterval(function () {
-            $apiInput.css("background-color","#fff");
-          }, 200);
-        });
-      });
-    }
-
-  });
 
   Fauxton.Notification = FauxtonAPI.View.extend({
     fadeTimer: 5000,

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/28333566/app/addons/fauxton/components.js
----------------------------------------------------------------------
diff --git a/app/addons/fauxton/components.js b/app/addons/fauxton/components.js
index c863ba7..c92a7ce 100644
--- a/app/addons/fauxton/components.js
+++ b/app/addons/fauxton/components.js
@@ -34,6 +34,83 @@ define([
 function(app, FauxtonAPI, ace, spin, ZeroClipboard) {
   var Components = FauxtonAPI.addon();
 
+
+  Components.Breadcrumbs = FauxtonAPI.View.extend({
+    className: "breadcrumb pull-left",
+    tagName: "ul",
+    template: "addons/fauxton/templates/breadcrumbs",
+    serialize: function() {
+      var crumbs = _.clone(this.crumbs);
+      return {
+        crumbs: crumbs
+      };
+    },
+
+    initialize: function(options) {
+      this.crumbs = options.crumbs;
+    }
+  });
+
+  Components.ApiBar = FauxtonAPI.View.extend({
+    template: "addons/fauxton/templates/api_bar",
+    endpoint: '_all_docs',
+
+    documentation: 'docs',
+
+    events:  {
+      "click .api-url-btn" : "toggleAPIbar"
+    },
+
+    toggleAPIbar: function(e){
+      var $currentTarget = $(e.currentTarget).find('span');
+      if ($currentTarget.hasClass("fonticon-plus")){
+        $currentTarget.removeClass("fonticon-plus").addClass("fonticon-minus");
+      }else{
+        $currentTarget.removeClass("fonticon-minus").addClass("fonticon-plus");
+      }
+      $('.api-navbar').toggle();
+    },
+
+    serialize: function() {
+      return {
+        endpoint: this.endpoint,
+        documentation: this.documentation
+      };
+    },
+
+    hide: function(){
+      this.$el.addClass('hide');
+    },
+    show: function(){
+      this.$el.removeClass('hide');
+    },
+    update: function(endpoint) {
+      this.show();
+      this.endpoint = endpoint[0];
+      this.documentation = endpoint[1];
+      this.render();
+    },
+    afterRender: function(){
+      ZeroClipboard.config({ moviePath: "/assets/js/plugins/zeroclipboard/ZeroClipboard.swf" });
+      var client = new ZeroClipboard(this.$(".copy-url"));
+      client.on("load", function(e){
+        var $apiInput = $('#api-navbar input');
+        var copyURLTimer;
+        client.on("mouseup", function(e){
+          $apiInput.css("background-color","#aaa");
+          window.clearTimeout(copyURLTimer);
+          copyURLTimer = setInterval(function () {
+            $apiInput.css("background-color","#fff");
+          }, 200);
+        });
+      });
+    }
+
+  });
+
+
+
+
   Components.Pagination = FauxtonAPI.View.extend({
     template: "addons/fauxton/templates/pagination",
 
@@ -453,7 +530,7 @@ function(app, FauxtonAPI, ace, spin, ZeroClipboard) {
       if (this.mode != "plain") {
         this.editor.getSession().setMode("ace/mode/" + this.mode);
       }
-      
+
       this.editor.setShowPrintMargin(false);
       this.addCommands();
 
@@ -624,11 +701,12 @@ function(app, FauxtonAPI, ace, spin, ZeroClipboard) {
     className: "dropdown",
     initialize: function(options){
       this.links = options.links;
+      this.icon = options.icon || "fonticon-plus-circled2";
     },
     serialize: function(){
-      var sidebarItem = FauxtonAPI.getExtensions('sidebar:links');
       return {
-        links: this.links
+        links: this.links,
+        icon: this.icon
       };
     }
   });
@@ -656,7 +734,7 @@ function(app, FauxtonAPI, ace, spin, ZeroClipboard) {
   //need to make this into a backbone view...
   var routeObjectSpinner;
   FauxtonAPI.RouteObject.on('beforeEstablish', function (routeObject) {
-    if (!routeObject.disableLoader){ 
+    if (!routeObject.disableLoader){
       var opts = {
         lines: 16, // The number of lines to draw
         length: 8, // The length of each line
@@ -702,7 +780,7 @@ function(app, FauxtonAPI, ace, spin, ZeroClipboard) {
   FauxtonAPI.RouteObject.on('beforeRender', function (routeObject, view, selector) {
     removeRouteObjectSpinner();
 
-    if (!view.disableLoader){ 
+    if (!view.disableLoader){
       var opts = {
         lines: 16, // The number of lines to draw
         length: 8, // The length of each line