Merge pull request #16 from ericguzman/binding

Objects Tray - Moved to stage object from binding view

10 files changed, 123 insertions, 95 deletions

diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index 103e418f..88b93b2c 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -93,12 +93,43 @@ exports.Editable = Montage.create(Component, {
             }
         }
     },
+
+    _value : { value: null },
     value : {
-        get: function() {
-            return this._element.textContent;
-        },
-        set: function(str) {
-            this._element.textContent = str;
+        get : function() { return this._value; },
+        set : function(value) {
+            if(value === this._value) { return; }
+
+            var node = this._getFirstTextNode();
+            node.textContent = value;
+
+            this._value = value;
+        }
+    },
+    _getFirstTextNode : {
+        value : function(el) {
+            ///// optional el argument specified container element
+            var e = el || this._element,
+                nodes = e.childNodes, node;
+
+            if(nodes.length) {
+                for(var i=0; i<nodes.length; i++) {
+                    if(nodes[i].nodeType === 3) {
+                        ///// found the first text node
+                        node = nodes[i];
+                        break;
+                    }
+                }
+            }
+
+            ///// Text node not found
+            if(!node) {
+                node = document.createTextNode('');
+                e.appendChild(node);
+            }
+
+
+            return node;
         }
     },
 
@@ -207,6 +238,8 @@ exports.Editable = Montage.create(Component, {
     ///// Text input has changed values
     handleInput : {
         value : function(e) {
+            this.value = this._getFirstTextNode().textContent;
+
             if(!this.isDirty) {
                  this.isDirty = true;
              }
@@ -230,6 +263,8 @@ exports.Editable = Montage.create(Component, {
         value: function(e) {
             e.preventDefault();
             document.execCommand('insertHTML', null, e._event.clipboardData.getData("Text"));
+            this.value = this._element.textContent;
+
             this._sendEvent('paste', e);
         }
     },
diff --git a/js/components/hintable.reel/hintable.js b/js/components/hintable.reel/hintable.js
index e16c5f8a..d09cdbd2 100644
--- a/js/components/hintable.reel/hintable.js
+++ b/js/components/hintable.reel/hintable.js
@@ -140,15 +140,6 @@ exports.Hintable = Montage.create(Editable, {
             }
         }
     },
-    value : {
-        get: function() {
-            return this._getFirstTextNode().textContent;
-        },
-        set: function(str) {
-            var node = this._getFirstTextNode();
-            node.textContent = str;
-        }
-    },
 
     handleKeydown : {
         value : function handleKeydown(e) {
@@ -196,6 +187,7 @@ exports.Hintable = Montage.create(Editable, {
                     
                     this._matchIndex = 0;                    
                     this.matches = this.hints.filter(function(h) {
+                        if(!h) { return false; }
                         return h.indexOf(val) === 0;
                     }).sort();
                     
@@ -271,32 +263,6 @@ exports.Hintable = Montage.create(Editable, {
             return Array.prototype.slice.call(arrayLikeObj);
         }
     },
-    _getFirstTextNode : {
-        value : function(el) {
-            ///// optional el argument specified container element
-            var e = el || this._element,
-                nodes = e.childNodes, node;
-            
-            if(nodes.length) {
-                for(var i=0; i<nodes.length; i++) {
-                    if(nodes[i].nodeType === 3) {
-                        ///// found the first text node
-                        node = nodes[i];
-                        break;
-                    }
-                }
-            }
-            
-            ///// Text node not found
-            if(!node) {
-                node = document.createTextNode('');
-                e.appendChild(node);
-            }
-        
-        
-            return node;
-        }
-    },
     _super : {
         value : function(args) {
             this.inheritsFrom[arguments.callee.caller.name].apply(this, args);
diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html
index 9a2834c7..fc80cd6e 100644
--- a/js/panels/binding-panel.reel/binding-panel.html
+++ b/js/panels/binding-panel.reel/binding-panel.html
@@ -74,7 +74,7 @@
         <div data-montage-id="binding-panel-toolbar-container" class="binding-panel-toolbar-container">
             <div data-montage-id="binding-panel-toolbar"></div>
         </div>
-        <div data-montage-id="edit-binding-view" class="edit-binding-view"></div>
+        <div data-montage-id="edit-binding-view"></div>
     </div>
 </body>
 </html>
\ No newline at end of file
diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js
index 45fa4005..c040c009 100644
--- a/js/panels/binding-panel.reel/binding-panel.js
+++ b/js/panels/binding-panel.reel/binding-panel.js
@@ -64,11 +64,15 @@ exports.BindingPanel = Montage.create(Component, {
 
     handleAddAction : {
         value: function(e) {
-            var newBindingArgs = {
-                sourceObject : this.application.ninja.objectsController.currentObject
-            };
+            var sourceObject = this.application.ninja.objectsController.currentObject;
 
-            this.displayEditView(newBindingArgs);
+            if(sourceObject) {
+                this.displayEditView({
+                    sourceObject: sourceObject
+                });
+            } else {
+                this.displayEditView();
+            }
         }
     },
 
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
index 01feb5cc..0ca82179 100644
--- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
@@ -14,7 +14,7 @@
     top: 0;
     width: 100%;
     -webkit-transition-property: -webkit-transform;
-    -webkit-transition-duration: .55s;
+    -webkit-transition-duration: 550ms;
     -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99);
     -webkit-user-select: text;
 }
@@ -55,13 +55,16 @@
     position:relative;
     top: -1px;
     left: -1px;
+    -webkit-transition: opacity 550ms linear;
 }
 .object-fields-container {
     -webkit-box-flex: 1;
     padding-top: 1px;
     width: 1px;
 }
-
+.no-object {
+    opacity: 0;