Fixed the configs to be double click to edit. Fixed the templates to not use IDs as selectors (BAD)
Fixed the underscore values for inputs to be HTML-escaped Centered the table rows Project: http://git-wip-us.apache.org/repos/asf/couchdb/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb/commit/0af1b095 Tree: http://git-wip-us.apache.org/repos/asf/couchdb/tree/0af1b095 Diff: http://git-wip-us.apache.org/repos/asf/couchdb/diff/0af1b095 Branch: refs/heads/2041-update-ibrowse Commit: 0af1b0959d13641c1e0d9c7e032098914581735e Parents: 8d37ee3 Author: suelockwood <[email protected]> Authored: Mon Mar 10 13:24:50 2014 -0400 Committer: suelockwood <[email protected]> Committed: Mon Mar 10 13:26:23 2014 -0400 ---------------------------------------------------------------------- .../app/addons/config/assets/less/config.less | 24 ++++++++++++-------- src/fauxton/app/addons/config/resources.js | 18 +++++++-------- .../app/addons/config/templates/dashboard.html | 4 ++-- .../app/addons/config/templates/item.html | 18 +++++++-------- 4 files changed, 35 insertions(+), 29 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb/blob/0af1b095/src/fauxton/app/addons/config/assets/less/config.less ---------------------------------------------------------------------- diff --git a/src/fauxton/app/addons/config/assets/less/config.less b/src/fauxton/app/addons/config/assets/less/config.less index 88bbc66..651cbe3 100644 --- a/src/fauxton/app/addons/config/assets/less/config.less +++ b/src/fauxton/app/addons/config/assets/less/config.less @@ -11,19 +11,17 @@ * the License. */ .config-item { - height: 41px; + height: 65px; - td:hover .edit-button { - display: block; + .js-value-input { + width: 80%; + margin: 0; } - - .value-input { - width: 98%; - } - - #delete-value { + .js-show-value, + .js-delete-value { cursor: pointer; } + button {width: 7%;} } #add-section-modal { @@ -33,3 +31,11 @@ #config-trash { width: 5%; } + +table.config { + tr { + th, td { + vertical-align: middle; + } + } +} http://git-wip-us.apache.org/repos/asf/couchdb/blob/0af1b095/src/fauxton/app/addons/config/resources.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/addons/config/resources.js b/src/fauxton/app/addons/config/resources.js index 227e80d..b5c0b6c 100644 --- a/src/fauxton/app/addons/config/resources.js +++ b/src/fauxton/app/addons/config/resources.js @@ -81,10 +81,10 @@ function (app, FauxtonAPI) { template: "addons/config/templates/item", events: { - "click .edit-button": "editValue", - "click #delete-value": "deleteValue", - "click #cancel-value": "cancelEdit", - "click #save-value": "saveValue" + "dblclick .js-edit-value": "editValue", + "click .js-delete-value": "deleteValue", + "click .js-cancel-value": "cancelEdit", + "click .js-save-value": "saveValue" }, deleteValue: function (event) { @@ -97,18 +97,18 @@ function (app, FauxtonAPI) { }, editValue: function (event) { - this.$("#show-value").hide(); - this.$("#edit-value-form").show(); + this.$(".js-show-value").hide(); + this.$(".js-edit-value-form").show(); }, saveValue: function (event) { - this.model.save({value: this.$(".value-input").val()}); + this.model.save({value: this.$(".js-value-input").val()}); this.render(); }, cancelEdit: function (event) { - this.$("#edit-value-form").hide(); - this.$("#show-value").show(); + this.$(".js-edit-value-form").hide(); + this.$(".js-show-value").show(); }, serialize: function () { http://git-wip-us.apache.org/repos/asf/couchdb/blob/0af1b095/src/fauxton/app/addons/config/templates/dashboard.html ---------------------------------------------------------------------- diff --git a/src/fauxton/app/addons/config/templates/dashboard.html b/src/fauxton/app/addons/config/templates/dashboard.html index b7dbc55..c14402c 100644 --- a/src/fauxton/app/addons/config/templates/dashboard.html +++ b/src/fauxton/app/addons/config/templates/dashboard.html @@ -20,8 +20,8 @@ the License. </div> <table class="config table table-striped table-bordered"> <thead> - <th id="config-section"> Section </th> - <th id="config-option"> Option </th> + <th id="config-section" width="20%"> Section </th> + <th id="config-option" width="20%"> Option </th> <th id="config-value"> Value </th> <th id="config-trash"></th> </thead> http://git-wip-us.apache.org/repos/asf/couchdb/blob/0af1b095/src/fauxton/app/addons/config/templates/item.html ---------------------------------------------------------------------- diff --git a/src/fauxton/app/addons/config/templates/item.html b/src/fauxton/app/addons/config/templates/item.html index 502c9b3..a628fe6 100644 --- a/src/fauxton/app/addons/config/templates/item.html +++ b/src/fauxton/app/addons/config/templates/item.html @@ -17,15 +17,15 @@ the License. <% } else { %> <td></td> <% } %> -<td> <%= option.name %> </td> -<td> - <div id="show-value"> - <%= option.value %> <button class="btn btn-mini pull-right hide edit-button"> Edit </button> +<td > <%= option.name %> </td> +<td class="js-edit-value"> + <div class="js-show-value"> + <%= option.value %> </div> - <div id="edit-value-form" style="display:none"> - <input class="value-input" type="text" value="<%= option.value %>" /> - <button id="save-value" class="btn btn-success btn-small"> Save </button> - <button id="cancel-value" class="btn btn-small"> Cancel </button> + <div class="js-edit-value-form" style="display:none"> + <input class="js-value-input" type="text" value="<%- option.value %>" /> + <button class="js-save-value btn btn-success fonticon-circle-check btn-small"> </button> + <button class="js-cancel-value btn btn-small fonticon-circle-x"> </button> </div> </td> -<td id="delete-value" class="text-center"> <i class="icon-trash"> </i> </td> +<td class="js-delete-value" class="text-center"> <i class="icon-trash"> </i> </td>
