From 72993c60e125c59b1dfc44759426b99fd6c5fcd3 Mon Sep 17 00:00:00 2001
From: Jeff Cross <middlefloor@gmail.com>
Date: Sat, 26 Nov 2011 11:57:50 -0700
Subject: [PATCH 1/3] Updated item edit form to render more appropriate form
 elements depending on type.

---
 public/dashboard/index.html                   | 18 +++++-----
 public/dashboard/js/model/collection-model.js |  2 --
 .../js/view/partial/collection-view.js        | 36 ++++++++++++++++++-
 3 files changed, 45 insertions(+), 11 deletions(-)

diff --git a/public/dashboard/index.html b/public/dashboard/index.html
index bb9e534..8147857 100644
--- a/public/dashboard/index.html
+++ b/public/dashboard/index.html
@@ -66,16 +66,18 @@
     <h6><%= name %></h6>
     <p>Fill out the fields below to create/edit an object in the <%= name %> collection.</p>
     <form class="item-edit-form nice">
-      <% _.each(description, function (val, key, obj) { 
-        var type = 'text'; %>
+      <% _.each(description, function (val, key, obj) { %>
         <fieldset>
           <label for="item-val-<%= key %>"><%= key %></label>
-          <input 
-            id="item-val-<%= key %>" 
-            name="<%= key %>" 
-            type="<%= type %>" 
-            <% if (val.required) print('required="true"'); 
-            if (typeof values !== "undefined" && typeof values[key] !== "undefined") print('value='+values[key]); %> />
+          <% if (val.formType === 'textarea' || val.formType === 'multi-select') { %>
+            <textarea id="item-val-<%= key %>" name="<%= key %>"><% print(values ? values[key] : ''); %></textarea>
+          <% }
+          else if (val.formType === 'checkbox') {%>
+            <input type="checkbox" id="item-val-<%= key %>" name="<%= key %>" <% print(val.required ? 'required="true"' : ''); print(values[key] === 'true' ? 'checked' : ''); %> />
+          <% }
+          else { %>
+            <input type="<% print(val.formType || 'text'); %>" id="item-val-<%= key %>" name="<%= key %>" <% if (val.required) print('required="true"'); %> />
+          <% } %>
         </fieldset>
       <% }); %>
     </form>
diff --git a/public/dashboard/js/model/collection-model.js b/public/dashboard/js/model/collection-model.js
index d9f67b1..8aedd62 100644
--- a/public/dashboard/js/model/collection-model.js
+++ b/public/dashboard/js/model/collection-model.js
@@ -5,8 +5,6 @@ window.CollectionModel = Backbone.Model.extend({
   },
   getItemById: function (id) {
     var _items = this.get('results');
-    console.log('_items');
-    console.log(_items);
     var _item;
     _.each(this.get('results'), function (item, index, list){
       if (item._id === id) {
diff --git a/public/dashboard/js/view/partial/collection-view.js b/public/dashboard/js/view/partial/collection-view.js
index 8a2d118..5056d1e 100644
--- a/public/dashboard/js/view/partial/collection-view.js
+++ b/public/dashboard/js/view/partial/collection-view.js
@@ -9,7 +9,14 @@ window.CollectionView = Backbone.View.extend({
     console.log('editItem:'+$(e.currentTarget).attr("id"));
     //TODO: Implement auto-saving model.
     var values = this.model.getItemById($(e.currentTarget).attr("id").replace('edit-item-',''));
+    var description = this.model.get('description');
+    _.each(description.toJSON(), function (val, key, obj){
+      obj[key] = typeof val === "object" ? val : { type: val};
+      console.log(JSON.stringify(obj));
+    });
     console.log(values);
+    console.log('description');
+    console.log(this.model.get('description'));
     var _itemModel = new ItemEditModel({
       description: this.model.get('description'), //schema definition
       name: this.model.get('name'),
@@ -31,8 +38,35 @@ window.CollectionView = Backbone.View.extend({
   },
   createItem: function () {
     //TODO: Dynamically create a form.
+    var description = this.model.get('description');
+    _.each(description, function (val, key, obj) {
+      obj[key] = typeof val === "object" ? val : { type: val};
+      
+      switch (obj[key].type) {
+        case "email":
+          type = "email";
+          break;
+        case "password":
+          type = 'password'
+          break;
+        case "object":
+          type = 'textarea';
+          break;
+        case 'boolean':
+          type = 'checkbox';
+          break;
+        case 'mutli-select':
+          type = 'multi-select';
+          break;
+        default:
+          type = "text";
+      }
+      
+      obj[key].formType = type;
+      console.log(JSON.stringify(obj));
+    });
     var _newItemModel = new ItemEditModel({
-      description: this.model.get('description'), //schema definition
+      description: description, //schema definition
       name: this.model.get('name'),
       plugin: this.model.get('plugin'),
       values: {}

From d4830b093e51eaff59a70dfc4410e36e416b4c2b Mon Sep 17 00:00:00 2001
From: Jeff Cross <middlefloor@gmail.com>
Date: Sat, 26 Nov 2011 13:30:01 -0700
Subject: [PATCH 2/3] Item edit modal is saving to server somewhat reliably,
 status messages are shown on error/success.

---
 public/dashboard/index.html                   | 23 ++++++++++---
 public/dashboard/js/model/item-edit-model.js  | 11 ++++++-
 .../js/view/partial/collection-view.js        | 33 +++++++++++++++----
 .../js/view/partial/item-edit-view.js         | 30 +++++++++++++++++
 4 files changed, 85 insertions(+), 12 deletions(-)

diff --git a/public/dashboard/index.html b/public/dashboard/index.html
index 8147857..b5a9490 100644
--- a/public/dashboard/index.html
+++ b/public/dashboard/index.html
@@ -68,19 +68,32 @@
     <form class="item-edit-form nice">
       <% _.each(description, function (val, key, obj) { %>
         <fieldset>
-          <label for="item-val-<%= key %>"><%= key %></label>
+          <label for="item-val-<%= key %>"><%= key %></label><% if (val.type === 'object') print('requires valid JSON'); %>
           <% if (val.formType === 'textarea' || val.formType === 'multi-select') { %>
-            <textarea id="item-val-<%= key %>" name="<%= key %>"><% print(values ? values[key] : ''); %></textarea>
+            <textarea 
+              id="item-val-<%= key %>" 
+              name="<%= key %>"><% print(values ? values[key] : ''); %></textarea>
           <% }
           else if (val.formType === 'checkbox') {%>
-            <input type="checkbox" id="item-val-<%= key %>" name="<%= key %>" <% print(val.required ? 'required="true"' : ''); print(values[key] === 'true' ? 'checked' : ''); %> />
+            <input 
+              type="checkbox" 
+              id="item-val-<%= key %>" 
+              name="<%= key %>" 
+              <% print(val.required ? 'required="true"' : ''); 
+              print(values[key] === 'true' ? 'checked' : ''); %> />
           <% }
           else { %>
-            <input type="<% print(val.formType || 'text'); %>" id="item-val-<%= key %>" name="<%= key %>" <% if (val.required) print('required="true"'); %> />
+            <input 
+              type="<% print(val.formType || 'text'); %>" 
+              id="item-val-<%= key %>" 
+              name="<%= key %>" 
+              value="<% print(values && typeof values[key] !== 'undefined' ? values[key] : ''); %>" 
+              <% if (val.required) print('required="true"'); %> />
           <% } %>
         </fieldset>
       <% }); %>
     </form>
+    <div class="alert-box" style="display:none"></div>
     <a class="nice medium radius blue button save-item">Save Changes</a>
     <a class="nice medium radius white button discard-changes">Discard Changes</a>
   </script>
@@ -162,7 +175,7 @@
 				  <input type="checkbox" id="unique<%= key%>" style="display: none;">
 				  <span class="custom checkbox <% if (typeof unique !== "undefined") { print("checked"); } %>"></span> unique in this collection
 				</label>
-				<a class="nice small radius red button delete-property" style="float: right;">Remove</a>
+				<a class="delete-property" style="float: right;">Remove</a>
   </script>
   <script id="schema-view-template" type="html/template">
     <div class="twelve columns">
diff --git a/public/dashboard/js/model/item-edit-model.js b/public/dashboard/js/model/item-edit-model.js
index 3d61088..34fe6d3 100644
--- a/public/dashboard/js/model/item-edit-model.js
+++ b/public/dashboard/js/model/item-edit-model.js
@@ -7,6 +7,15 @@ window.ItemEditModel = Backbone.Model.extend({
     console.log(response);
   },
   sync: function (method, model, options) {
-    d(this.url(), this.get('values'), this.onSync);
+    var _self = this;
+    d(this.url(), this.get('values'), function onSync (response) {
+      if (response.errors) {
+        _self.trigger('sync-error', { errors: response.errors});
+      }
+      else {
+        _self.trigger('sync-success');
+      }
+      
+    });
   }
 });
\ No newline at end of file
diff --git a/public/dashboard/js/view/partial/collection-view.js b/public/dashboard/js/view/partial/collection-view.js
index 5056d1e..beda2fe 100644
--- a/public/dashboard/js/view/partial/collection-view.js
+++ b/public/dashboard/js/view/partial/collection-view.js
@@ -10,13 +10,34 @@ window.CollectionView = Backbone.View.extend({
     //TODO: Implement auto-saving model.
     var values = this.model.getItemById($(e.currentTarget).attr("id").replace('edit-item-',''));
     var description = this.model.get('description');
-    _.each(description.toJSON(), function (val, key, obj){
+    _.each(description, function (val, key, obj) {
       obj[key] = typeof val === "object" ? val : { type: val};
-      console.log(JSON.stringify(obj));
+      
+      switch (obj[key].type) {
+        case "email":
+          type = "email";
+          break;
+        case "password":
+          type = 'password';
+          break;
+        case "object":
+          type = 'textarea';
+          if (typeof values[key] === 'object') values[key] = JSON.stringify(values[key]);
+          values[key].replace(/ /g,'');
+          break;
+        case 'boolean':
+          type = 'checkbox';
+          break;
+        case 'mutli-select':
+          type = 'multi-select';
+          break;
+        default:
+          type = "text";
+      }
+      
+      obj[key].formType = type;
     });
-    console.log(values);
-    console.log('description');
-    console.log(this.model.get('description'));
+    
     var _itemModel = new ItemEditModel({
       description: this.model.get('description'), //schema definition
       name: this.model.get('name'),
@@ -47,7 +68,7 @@ window.CollectionView = Backbone.View.extend({
           type = "email";
           break;
         case "password":
-          type = 'password'
+          type = 'password';
           break;
         case "object":
           type = 'textarea';
diff --git a/public/dashboard/js/view/partial/item-edit-view.js b/public/dashboard/js/view/partial/item-edit-view.js
index 84566d8..609092d 100644
--- a/public/dashboard/js/view/partial/item-edit-view.js
+++ b/public/dashboard/js/view/partial/item-edit-view.js
@@ -4,12 +4,27 @@ window.ItemEditView = Backbone.View.extend({
     'click .save-item'  : 'save',
     'click .discard-changes'  : 'discard'
   },
+  initialize: function () {
+    var _self = this;
+    this.model.bind('sync-success', function (e) {
+      _self._onSync(e);
+    });
+    this.model.bind('sync-error', function (e) {
+      _self._onSyncError(e);
+    });
+  },
   discard : function (e) {
     this._closeModal();
   },
   _closeModal : function () {
     $('.close-reveal-modal').click();
   },
+  _onSync: function (e) {
+    $('.alert-box', this.el).empty().attr('class','alert-box').addClass('success').html('Object saved successfully').show();
+  },
+  _onSyncError: function (e) {
+    $('.alert-box', this.el).empty().attr('class','alert-box').addClass('error').html('Error saving object:'+JSON.stringify(e.errors)).show();
+  },
   _formObjectFromArray: function (formArray) {
     var _formObject = {};
     _.each(formArray, function (item, index, list) {
@@ -18,7 +33,22 @@ window.ItemEditView = Backbone.View.extend({
     return _formObject;
   },
   save: function (e) {
+    var _self = this;
+    $.each($('form', this.el).find('textarea'), function (index, object) {
+      $(object).val($(object).val().replace(/\n/g,'').replace(/\r/g,''));
+    });
+
     var _values = this._formObjectFromArray($('form', this.el).serializeArray());
+    $.each(_values, function(i, field){
+      if (_self.model.get('description')[i].type === 'object') {
+        try {
+          _values[i] = JSON.parse(field);
+        }
+        catch (e) {
+          if (console) console.log('Couldn\'t parse object');
+        }
+      }
+    });
     this.model.save({values: _values});
   },
   render: function () {

From 666cfc1ce58de4096405ce094eecca565c72d6f8 Mon Sep 17 00:00:00 2001
From: Jeff Cross <middlefloor@gmail.com>
Date: Sat, 26 Nov 2011 13:34:40 -0700
Subject: [PATCH 3/3] Fixed automatic tab selecting/opening in dashboard plugin
 view.

---
 public/dashboard/js/view/partial/plugin-view.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/dashboard/js/view/partial/plugin-view.js b/public/dashboard/js/view/partial/plugin-view.js
index e653bc5..c041e3b 100644
--- a/public/dashboard/js/view/partial/plugin-view.js
+++ b/public/dashboard/js/view/partial/plugin-view.js
@@ -47,8 +47,8 @@ window.PluginView = Backbone.View.extend({
 	    $('#tab-link-'+this.tabId+' > a').addClass('active');
 	  }
 	  else {
-	    $('#plugin-tabs-nav > dd > a').addClass('active');
-	    $('.tabs-content > li').show();
+	    $('#plugin-tabs-nav > dd > a:first').addClass('active');
+	    $('.tabs-content > li:first').show();
 	  }
 	},
 	addTab: function (tabName, id) {