Change the all docs select header to be it's own view
Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/18839b89 Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/18839b89 Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/18839b89 Branch: refs/heads/secondary-indexes Commit: 18839b897c6c38a6bfdb6772ebb14f0a7afaf406 Parents: 3f9f381 Author: deathbearbrown <[email protected]> Authored: Sun Aug 24 16:33:43 2014 +0200 Committer: deathbearbrown <[email protected]> Committed: Mon Aug 25 09:37:36 2014 -0400 ---------------------------------------------------------------------- app/addons/documents/routes.js | 25 ++++++++--- .../documents/templates/header_alldocs.html | 2 - .../documents/templates/select-doc-menu.html | 25 ++++++----- app/addons/documents/views.js | 44 ++++++-------------- 4 files changed, 47 insertions(+), 49 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/18839b89/app/addons/documents/routes.js ---------------------------------------------------------------------- diff --git a/app/addons/documents/routes.js b/app/addons/documents/routes.js index 7f71bb9..46fbc51 100644 --- a/app/addons/documents/routes.js +++ b/app/addons/documents/routes.js @@ -158,7 +158,8 @@ function(app, FauxtonAPI, Components, Documents, Changes, DocEditor, Databases, "route:paginate": "paginate", "route:perPageChange": "perPageChange", "route:changesFilterAdd": "addFilter", - "route:changesFilterRemove": "removeFilter" + "route:changesFilterRemove": "removeFilter", + "route:toggleSelectHeader": "toggleSelectheader" }, initialize: function (route, masterLayout, options) { @@ -202,7 +203,7 @@ function(app, FauxtonAPI, Components, Documents, Changes, DocEditor, Databases, Show right header for all docs that includes: query options, api bar, search and select ----------------------------------------------------*/ - this.changesHeader = true; + this.allDocsHeader = false; this.resetAllDocsHeader(); /* -------------------------------------------------- @@ -263,12 +264,26 @@ function(app, FauxtonAPI, Components, Documents, Changes, DocEditor, Databases, }, + toggleSelectheader: function(){ + /* -------------------------------------------------- + Set up right header for the document select menu + or reset back to all docs header + ----------------------------------------------------*/ + if (this.allDocsHeader){ + this.allDocsHeader = false; + this.rightHeader = this.setView("#api-navbar", new Documents.Views.SelectMenuHeader({})); + this.rightHeader.forceRender(); + } else { + this.resetAllDocsHeader(); + } + + }, resetAllDocsHeader: function(){ - if (this.changesHeader){ + if (!this.allDocsHeader){ this.rightHeader = this.setView("#api-navbar", new Documents.Views.RightAllDocsHeader({ database: this.data.database })); - this.changesHeader = false; + this.allDocsHeader = true; } }, @@ -502,7 +517,7 @@ function(app, FauxtonAPI, Components, Documents, Changes, DocEditor, Databases, documentation: this.data.database.documentation() })); - this.changesHeader = true; + this.allDocsHeader = true; /* -------------------------------------------------- Set sidebar highlight http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/18839b89/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 index 36d62f8..ff6d8a8 100644 --- a/app/addons/documents/templates/header_alldocs.html +++ b/app/addons/documents/templates/header_alldocs.html @@ -26,8 +26,6 @@ the License. <div id="header-search" class="js-search searchbox-container"></div> <!-- Select toggle --> - <div id="header-select-menu"></div> - <div id="header-select-all" class="button"> <span class="toggle-select-menu icon fonticon-ok-circled">Select</span> </div> http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/18839b89/app/addons/documents/templates/select-doc-menu.html ---------------------------------------------------------------------- diff --git a/app/addons/documents/templates/select-doc-menu.html b/app/addons/documents/templates/select-doc-menu.html index bad70a7..a00c851 100644 --- a/app/addons/documents/templates/select-doc-menu.html +++ b/app/addons/documents/templates/select-doc-menu.html @@ -11,14 +11,19 @@ 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="row"> - <div class="btn-toolbar span6"> - <button type="button" class="btn btn-small all" data-toggle="button">â All</button> - <button class="btn btn-small disabled js-bulk-delete"><i class="icon-trash"></i></button> - <% if (expandDocs) { %> - <button id="collapse" class="btn btn-small"><i class="icon-minus"></i> Collapse</button> - <% } else { %> - <button id="collapse" class="btn btn-small"><i class="icon-plus"></i> Expand</button> - <% } %> - </div> + +<!-- Select toggle --> +<div id="header-select-all active" class="button"> + <span class="toggle-select-menu icon fonticon-ok-circled">Select</span> </div> + +<button type="button" class="button btn btn-small all" data-toggle="button">â All</button> + +<button class="button btn btn-small disabled js-bulk-delete"><i class="icon-trash"></i></button> + +<% if (expandDocs) { %> +<button id="collapse" class="button btn btn-small"><i class="icon-minus"></i> Collapse</button> +<% } else { %> +<button id="collapse" class="button btn btn-small"><i class="icon-plus"></i> Expand</button> +<% } %> + http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/18839b89/app/addons/documents/views.js ---------------------------------------------------------------------- diff --git a/app/addons/documents/views.js b/app/addons/documents/views.js index cf17559..b292663 100644 --- a/app/addons/documents/views.js +++ b/app/addons/documents/views.js @@ -56,36 +56,8 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions, }, selectAllMenu: function(e){ - //trigger event to select all in other view - this.$('.toggle-select-menu').toggleClass('active'); - - //trigger event to change the header - this.toggleSelectMenu(); + FauxtonAPI.triggerRouteEvent("toggleSelectHeader"); FauxtonAPI.Events.trigger("documents:show-select-all",this.selectVisible); - - }, - - toggleSelectMenu: function(){ - if (this.selectVisible){ - this.selectVisible = false; - this.selectMenu.remove(); - this.addAllDocsMenu(); - } else { - this.removeAllDocsMenu(); - this.addSelectMenu(); - } - }, - - addSelectMenu: function(){ - this.selectVisible = true; - this.selectMenu = this.insertView('#header-select-menu', new Views.SelectMenu({})); - this.selectMenu.render(); - }, - - removeAllDocsMenu: function(){ - this.headerSearch.remove(); - this.queryOptions.remove(); - this.apiBar.remove(); }, addAllDocsMenu: function(){ @@ -188,13 +160,21 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions, }); // select docs header - Views.SelectMenu = FauxtonAPI.View.extend({ + Views.SelectMenuHeader = FauxtonAPI.View.extend({ + className: "header-right", template:"addons/documents/templates/select-doc-menu", events: { "click button.all": "selectAll", "click button.js-bulk-delete": "bulkDelete", - "click #collapse": "collapse" + "click #collapse": "collapse", + 'click .toggle-select-menu': 'selectAllMenu' + }, + + selectAllMenu: function(e){ + FauxtonAPI.triggerRouteEvent("toggleSelectHeader"); + FauxtonAPI.Events.trigger("documents:show-select-all",this.selectVisible); }, + bulkDelete: function(){ FauxtonAPI.Events.trigger("documents:bulkDelete"); }, @@ -258,7 +238,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, Views, QueryOptions, Views.Document = FauxtonAPI.View.extend({ template: "addons/documents/templates/all_docs_item", className: function(){ - return (this.showSelect? "showSelect":"") + " all-docs-item doc-row" + return (this.showSelect? "showSelect":"") + " all-docs-item doc-row"; }, initialize: function (options) { this.checked = options.checked;
