You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@couchdb.apache.org by dc...@apache.org on 2014/03/16 17:58:05 UTC
[25/29] couchdb commit: updated refs/heads/2041-update-ibrowse to
b63f393
Added Autocomplete for config sections
Form Validation
Updating selectors with the js-prefix
Added modal to makefile.
Removed debugging alert.
Cleaned up error messaging to be consistent.
Project: http://git-wip-us.apache.org/repos/asf/couchdb/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb/commit/33b6e350
Tree: http://git-wip-us.apache.org/repos/asf/couchdb/tree/33b6e350
Diff: http://git-wip-us.apache.org/repos/asf/couchdb/diff/33b6e350
Branch: refs/heads/2041-update-ibrowse
Commit: 33b6e3509880ac271be26d75e1094e2296c139f6
Parents: a355997
Author: suelockwood <de...@apache.org>
Authored: Fri Mar 14 11:04:26 2014 -0400
Committer: suelockwood <de...@apache.org>
Committed: Fri Mar 14 11:08:50 2014 -0400
----------------------------------------------------------------------
src/Makefile.am | 2 +
.../app/addons/config/assets/less/config.less | 2 +-
src/fauxton/app/addons/config/resources.js | 4 +
src/fauxton/app/addons/config/routes.js | 1 -
.../app/addons/config/templates/dashboard.html | 29 +---
.../app/addons/config/templates/modal.html | 33 +++++
src/fauxton/app/addons/config/views.js | 136 +++++++++++++++----
src/fauxton/app/addons/fauxton/components.js | 53 ++++----
8 files changed, 179 insertions(+), 81 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/src/Makefile.am
----------------------------------------------------------------------
diff --git a/src/Makefile.am b/src/Makefile.am
index a5eea39..89a6afd 100644
--- a/src/Makefile.am
+++ b/src/Makefile.am
@@ -70,6 +70,8 @@ FAUXTON_FILES = \
fauxton/app/addons/config/resources.js \
fauxton/app/addons/config/views.js \
fauxton/app/addons/config/routes.js \
+ fauxton/app/addons/config/views.js \
+ fauxton/app/addons/config/templates/modal.html \
fauxton/app/addons/config/templates/dashboard.html \
fauxton/app/addons/config/templates/item.html \
fauxton/app/addons/config/tests/resourcesSpec.js \
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/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 44311de..2807708 100644
--- a/src/fauxton/app/addons/config/assets/less/config.less
+++ b/src/fauxton/app/addons/config/assets/less/config.less
@@ -27,7 +27,7 @@
button {width: 7%;}
}
-#add-section-modal {
+#add-section-modal .modal {
width: 400px;
}
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/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 ec8cc98..317e355 100644
--- a/src/fauxton/app/addons/config/resources.js
+++ b/src/fauxton/app/addons/config/resources.js
@@ -13,12 +13,14 @@
define([
"app",
"api"
+
],
function (app, FauxtonAPI) {
var Config = FauxtonAPI.addon();
+
Config.Model = Backbone.Model.extend({});
Config.OptionModel = Backbone.Model.extend({
documentation: "config",
@@ -75,5 +77,7 @@ function (app, FauxtonAPI) {
}
});
+
+
return Config;
});
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/src/fauxton/app/addons/config/routes.js
----------------------------------------------------------------------
diff --git a/src/fauxton/app/addons/config/routes.js b/src/fauxton/app/addons/config/routes.js
index 519e25f..affb453 100644
--- a/src/fauxton/app/addons/config/routes.js
+++ b/src/fauxton/app/addons/config/routes.js
@@ -12,7 +12,6 @@
define([
"app",
-
"api",
// Modules
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/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 c14402c..37ae634 100644
--- a/src/fauxton/app/addons/config/templates/dashboard.html
+++ b/src/fauxton/app/addons/config/templates/dashboard.html
@@ -13,10 +13,10 @@ the License.
-->
<div class="row">
- <button id="add-section" href="#" class="btn btn-primary pull-right">
- <i class="icon icon-plus icon-white"> </i>
- Add Section
- </button>
+ <button id="js-add-section" href="#" class="btn btn-primary pull-right">
+ <i class="icon icon-plus icon-white"> </i>
+ Add Section
+ </button>
</div>
<table class="config table table-striped table-bordered">
<thead>
@@ -28,23 +28,4 @@ the License.
<tbody>
</tbody>
</table>
-<div id="add-section-modal" class="modal hide fade">
- <div class="modal-header">
- <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
- <h3>Create Config Option</h3>
- </div>
- <div class="modal-body">
- <form id="add-section-form" class="form well">
- <label>Section</label>
- <input type="text" name="section" placeholder="Section">
- <span class="help-block">Enter an existing section name to add to it.</span>
- <input type="text" name="name" placeholder="Name">
- <br/>
- <input type="text" name="value" placeholder="Value">
- <div class="modal-footer">
- <button type="button" class="btn" data-dismiss="modal">Cancel</button>
- <button type="submit" class="btn btn-primary"> Save </button>
- </div>
- </form>
- </div>
-</div>
+<div id="add-section-modal"></div>
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/src/fauxton/app/addons/config/templates/modal.html
----------------------------------------------------------------------
diff --git a/src/fauxton/app/addons/config/templates/modal.html b/src/fauxton/app/addons/config/templates/modal.html
new file mode 100644
index 0000000..f32bd10
--- /dev/null
+++ b/src/fauxton/app/addons/config/templates/modal.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="modal-header">
+ <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+ <h3>Create Config Option</h3>
+</div>
+<div class="modal-body">
+ <div class="js-form-error-config"></div>
+ <form id="js-add-section-form" class="form well">
+ <label>Section</label>
+ <input type="text" name="section" placeholder="Section" >
+ <span class="help-block">Enter an existing section name to add to it.</span>
+ <input type="text" name="name" placeholder="Name">
+ <br/>
+ <input type="text" name="value" placeholder="Value">
+ <div class="modal-footer">
+ <button type="button" class="btn" data-dismiss="modal">Cancel</button>
+ <button type="submit" class="btn btn-primary"> Save </button>
+ </div>
+ </form>
+</div>
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/src/fauxton/app/addons/config/views.js
----------------------------------------------------------------------
diff --git a/src/fauxton/app/addons/config/views.js b/src/fauxton/app/addons/config/views.js
index bd05652..0468cd1 100644
--- a/src/fauxton/app/addons/config/views.js
+++ b/src/fauxton/app/addons/config/views.js
@@ -1,4 +1,4 @@
- // Licensed under the Apache License, Version 2.0 (the "License"); you may not
+// 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
//
@@ -14,11 +14,13 @@ define([
"app",
"api",
"addons/config/resources",
+ "addons/fauxton/components"
],
+function(app, FauxtonAPI, Config, Components) {
+ var Views ={},
+ Events = {};
-function (app, FauxtonAPI, Config) {
-
- var Views = {};
+ Views.Events = _.extend(Events, Backbone.Events);
Views.TableRow = FauxtonAPI.View.extend({
tagName: "tr",
@@ -59,7 +61,6 @@ function (app, FauxtonAPI, Config) {
}
},
-
discardValue: function (event) {
this.$(".js-edit-value-form").addClass("js-hidden");
this.$(".js-show-value").removeClass("js-hidden");
@@ -84,12 +85,63 @@ function (app, FauxtonAPI, Config) {
template: "addons/config/templates/dashboard",
events: {
- "click #add-section": "addSection",
- "submit #add-section-form": "submitForm"
+ "click #js-add-section": "addSection"
},
- submitForm: function (event) {
+ initialize: function(){
+ this.listenTo(Views.Events, "newSection", this.render);
+ },
+
+ addSection: function (event) {
event.preventDefault();
+ this.modal.show();
+ },
+
+ beforeRender: function() {
+ this.modal = this.insertView("#add-section-modal", new Views.Modal({
+ collection: this.collection
+ }));
+
+ this.modal.render();
+
+ this.collection.each(function(config) {
+ _.each(config.get("options"), function (option, index) {
+ this.insertView("table.config tbody", new Views.TableRow({
+ model: new Config.OptionModel({
+ section: config.get("section"),
+ name: option.name,
+ value: option.value,
+ index: index
+ })
+ }));
+ }, this);
+ }, this);
+ },
+
+ establish: function() {
+ return [this.collection.fetch()];
+ }
+ });
+
+ Views.Modal = FauxtonAPI.View.extend({
+ className: "modal hide fade",
+ template: "addons/config/templates/modal",
+ events: {
+ "submit #js-add-section-form": "validate"
+ },
+ initialize: function(){
+ this.sourceArray = _.map(this.collection.toJSON(), function(item, key){
+ return item.section;
+ });
+ },
+ afterRender: function(){
+ this.sectionTypeAhead = new Components.Typeahead({
+ source: this.sourceArray,
+ el: 'input[name="section"]'
+ });
+ this.sectionTypeAhead.render();
+ },
+ submitForm: function (event) {
var option = new Config.OptionModel({
section: this.$('input[name="section"]').val(),
name: this.$('input[name="name"]').val(),
@@ -111,34 +163,58 @@ function (app, FauxtonAPI, Config) {
});
}
- this.$("#add-section-modal").modal('hide');
- this.render();
- },
+ this.hide();
+ Views.Events.trigger("newSection");
- addSection: function (event) {
+ },
+ isNew: function(collection){
+ var sectionName = this.$('input[name="section"]').val(),
+ name = this.$('input[name="name"]').val();
+ var section = _.findWhere(collection.toJSON(), {"section":sectionName});
+ var options = _.findWhere(section.options, {name: name});
+
+ return options;
+ },
+ isSection: function(){
+ var section = this.$('input[name="section"]').val();
+ return _.find(this.sourceArray, function(item){ return item === section; });
+ },
+ validate: function (event){
event.preventDefault();
- this.$("#add-section-modal").modal({show:true});
+ var section = this.$('input[name="section"]').val(),
+ name = this.$('input[name="name"]').val(),
+ value = this.$('input[name="value"]').val(),
+ collection = this.collection;
+
+ if(!this.isSection()){
+ this.errorMessage("You need to use an existing section");
+ } else if (!name) {
+ this.errorMessage("Add a name");
+ } else if (!value) {
+ this.errorMessage("Add a value");
+ } else if (this.isNew(collection)){
+ this.errorMessage("Must have a unique name");
+ } else {
+ this.submitForm();
+ }
},
-
- beforeRender: function() {
- this.collection.each(function(config) {
- _.each(config.get("options"), function (option, index) {
- this.insertView("table.config tbody", new Views.TableRow({
- model: new Config.OptionModel({
- section: config.get("section"),
- name: option.name,
- value: option.value,
- index: index
- })
- }));
- }, this);
- }, this);
+ errorMessage: function(msg){
+ this.error = FauxtonAPI.addNotification({
+ msg: msg,
+ type: "error",
+ clear: true,
+ selector: ".js-form-error-config"
+ });
},
-
- establish: function() {
- return [this.collection.fetch()];
+ show: function(){
+ this.$el.modal({show:true});
+ },
+ hide: function(){
+ this.$el.modal('hide');
}
+
});
return Views;
+
});
http://git-wip-us.apache.org/repos/asf/couchdb/blob/33b6e350/src/fauxton/app/addons/fauxton/components.js
----------------------------------------------------------------------
diff --git a/src/fauxton/app/addons/fauxton/components.js b/src/fauxton/app/addons/fauxton/components.js
index 96af169..25f623c 100644
--- a/src/fauxton/app/addons/fauxton/components.js
+++ b/src/fauxton/app/addons/fauxton/components.js
@@ -210,32 +210,7 @@ function(app, FauxtonAPI, ace, spin) {
});
- //TODO allow more of the typeahead options.
- //Current this just does what we need but we
- //need to support the other typeahead options.
- Components.Typeahead = FauxtonAPI.View.extend({
-
- initialize: function (options) {
- this.source = options.source;
- _.bindAll(this);
- },
- afterRender: function () {
- var onUpdate = this.onUpdate;
-
- this.$el.typeahead({
- source: this.source,
- updater: function (item) {
- if (onUpdate) {
- onUpdate(item);
- }
-
- return item;
- }
- });
- }
-
- });
Components.ModalView = FauxtonAPI.View.extend({
@@ -279,6 +254,34 @@ function(app, FauxtonAPI, ace, spin) {
}
});
+ //TODO allow more of the typeahead options.
+ //Current this just does what we need but we
+ //need to support the other typeahead options.
+ Components.Typeahead = FauxtonAPI.View.extend({
+
+ initialize: function (options) {
+ this.source = options.source;
+ this.onUpdate = options.onUpdate;
+ _.bindAll(this);
+ },
+
+ afterRender: function () {
+ var onUpdate = this.onUpdate;
+
+ this.$el.typeahead({
+ source: this.source,
+ updater: function (item) {
+ if (onUpdate) {
+ onUpdate(item);
+ }
+
+ return item;
+ }
+ });
+ }
+
+ });
+
Components.DbSearchTypeahead = Components.Typeahead.extend({
initialize: function (options) {
this.dbLimit = options.dbLimit || 30;