4 files changed, 326 insertions, 36 deletions

diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js
index 55230fc3..a1017020 100644
--- a/js/panels/binding/binding-item.reel/binding-item.js
+++ b/js/panels/binding/binding-item.reel/binding-item.js
@@ -12,6 +12,10 @@ exports.BindingItem = Montage.create(Component, {
     sourceObjectLabel : { value: null },
     boundObjectLabel : { value: null },
 
+    bindingArgs : {
+        value: null
+    },
+
     _sourceObject : { value: null },
     sourceObject : {
         get: function() {
@@ -73,7 +77,9 @@ exports.BindingItem = Montage.create(Component, {
         },
         set: function(value) {
             if(value === this._oneway) { return; }
+
             this._oneway = value;
+
             this.needsDraw = true;
         }
     },
@@ -82,13 +88,19 @@ exports.BindingItem = Montage.create(Component, {
 
     handleDirectionToggleButtonAction : {
         value: function(e) {
+            var controller = this.application.ninja.objectsController;
+
             this.oneway = !this.oneway;
+            controller.editBinding(this.bindingArgs, {
+                oneway: !this.bindingArgs.oneway
+            });
+            controller.currentItem = controller.currentItem;
         }
     },
 
     handleEditButtonAction : {
         value: function(e) {
-            this.parentComponent.parentComponent.displayEditView();
+            this.parentComponent.parentComponent.displayEditView(this.bindingArgs);
         }
     },
 
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 b0249c6c..aa539cd6 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
@@ -9,11 +9,14 @@
     color: #FFF;
     font-size: 11px;
     height: 100%;
-    /*left: 100%;*/
-    /*position: absolute;*/
-    /*top: 0;*/
+    left: 100%;
+    position: absolute;
+    top: 0;
     width: 100%;
-    -webkit-transition: -webkit-transform 140ms ease-in;
+    -webkit-transition-property: -webkit-transform, box-shadow;
+    -webkit-transition-duration: .55s, .2s;
+    -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99);
+    -webkit-user-select: text;
 }
 
 .edit-binding-view ul {
@@ -26,11 +29,19 @@
     list-style-type: none;
 }
 
+.edit-binding-view label {
+    display: inline-block;
+    width: 50%;
+}
+
 /* hintable fields */
 
-.so-pp, .bo-pp {
-    border: 1px solid #313131;
-    padding: 1px 4px;
+.hintable-field {
     background-color: #444;
+    border: 1px solid #313131;
+    display: inline-block;
+    height: 13px;
     margin-left: 5px;
+    padding: 1px 4px;
+    width: 45%;
 }
\ No newline at end of file
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
index 1d502a3e..604d4871 100644
--- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
@@ -13,34 +13,53 @@
             "owner": {
                 "prototype": "js/panels/binding/edit-binding-view.reel",
                 "properties": {
-                    "element": {"#": "edit-binding"}
+                    "element": {"#": "edit-binding"},
+                    "sourceObjectField" : {"@": "sourceObjectField" },
+                    "boundObjectField"  : {"@": "boundObjectField" },
+                    "sourceObjectPropertyPathField" : {"@": "sourceObjectPropertyPathField" },
+                    "boundObjectPropertyPathField"  : {"@": "boundObjectPropertyPathField" },
+                    "directionCheckbox"  : {"@": "directionCheckbox" },
+                    "saveButton":{ "@": "saveButton" },
+                    "cancelButton":{ "@": "cancelButton" },
+                    "deleteButton":{ "@": "deleteButton" }
                 }
             },
-            "objectsList" : {
-                "prototype": "montage/ui/controller/array-controller",
-                "bindings" : {
-                    "content": {"<-": "@owner.objectsList"}
-                }
-            },
-            "sourceObjectSelect": {
-                "prototype": "montage/ui/select-input.reel",
+            "sourceObjectField": {
+                "prototype": "js/components/hintable.reel",
                 "properties": {
-                    "element": {"#": "sourceObjectSelect"},
-                    "contentController": {"@": "objectsList"}
-
-                }
+                    "startOnEvent": "click",
+                    "element": {"#": "sourceObjectField"}
+                },
+                "bindings": {
+                    "value": {"<-": "@owner.sourceObjectIdentifier"}
+                },
+                "listeners" : [
+                    {
+                        "type": "change",
+                        "listener": {"@": "owner"}
+                    }
+                ]
             },
-            "boundObjectSelect": {
-                "prototype": "montage/ui/select-input.reel",
+            "boundObjectField": {
+                "prototype": "js/components/hintable.reel",
                 "properties": {
-                    "element": {"#": "boundObjectSelect"},
-                    "contentController": {"@": "objectsList"}
-
-                }
+                    "startOnEvent": "click",
+                    "element": {"#": "boundObjectField"}
+                },
+                "bindings": {
+                    "value": {"<-": "@owner.boundObjectIdentifier"}
+                },
+                "listeners" : [
+                    {
+                        "type": "change",
+                        "listener": {"@": "owner"}
+                    }
+                ]
             },
             "sourceObjectPropertyPathField": {
                 "prototype": "js/components/hintable.reel",
                 "properties": {
+                    "startOnEvent": "click",
                     "element": {"#": "so-pp"},
                     "identifier": "sourceProperty"
                 },
@@ -57,6 +76,7 @@
             "boundObjectPropertyPathField": {
                 "prototype": "js/components/hintable.reel",
                 "properties": {
+                    "startOnEvent": "click",
                     "element": {"#": "bo-pp"},
                     "identifier": "boundProperty"
                 },
@@ -69,6 +89,57 @@
                         "listener": {"@": "owner"}
                     }
                 ]
+            },
+            "directionCheckbox": {
+                "prototype": "montage/ui/checkbox.reel",
+                "properties": {
+                    "element": {"#": "direction-checkbox"}
+                },
+                "bindings": {
+                    "checked": {"<-": "@owner.oneway"}
+                }
+            },
+            "cancelButton" : {
+                "prototype": "montage/ui/button.reel",