diff options
author | suelockwood <deathbear@apache.org> | 2014-02-27 16:52:16 -0500 |
---|---|---|
committer | suelockwood <deathbear@apache.org> | 2014-02-27 16:52:16 -0500 |
commit | 54312fa2ad1d31e6af603ef4a90a7560bf69bc9f (patch) | |
tree | 81827c9761f2e59eed5b1381e147eea5012a23f3 | |
parent | 055219f106b271dc17f0e469fb967489f4ef962e (diff) | |
download | couchdb-54312fa2ad1d31e6af603ef4a90a7560bf69bc9f.tar.gz |
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
-rw-r--r-- | src/fauxton/app/addons/config/assets/less/config.less | 16 | ||||
-rw-r--r-- | src/fauxton/app/addons/config/resources.js | 18 | ||||
-rw-r--r-- | src/fauxton/app/addons/config/templates/dashboard.html | 4 | ||||
-rw-r--r-- | src/fauxton/app/addons/config/templates/item.html | 18 |
4 files changed, 27 insertions, 29 deletions
diff --git a/src/fauxton/app/addons/config/assets/less/config.less b/src/fauxton/app/addons/config/assets/less/config.less index 88bbc6641..7d8da6a92 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 { diff --git a/src/fauxton/app/addons/config/resources.js b/src/fauxton/app/addons/config/resources.js index 14d247469..445fc01fd 100644 --- a/src/fauxton/app/addons/config/resources.js +++ b/src/fauxton/app/addons/config/resources.js @@ -76,10 +76,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) { @@ -92,18 +92,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 () { diff --git a/src/fauxton/app/addons/config/templates/dashboard.html b/src/fauxton/app/addons/config/templates/dashboard.html index b7dbc55f4..c14402c19 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> diff --git a/src/fauxton/app/addons/config/templates/item.html b/src/fauxton/app/addons/config/templates/item.html index 502c9b35a..a628fe69c 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> |