1 files changed, 41 insertions, 3 deletions

diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js
index 9fdec416..c2ce556c 100644
--- a/js/panels/binding-panel.reel/binding-panel.js
+++ b/js/panels/binding-panel.reel/binding-panel.js
@@ -4,10 +4,34 @@ var Montage         = require("montage/core/core").Montage,
 
 exports.BindingPanel = Montage.create(Component, {
 
-    bindings : {
+    bindings : { value: null },
+    editView : { value: null },
+    editingClass : { value: 'editing-binding' },
+    _editing: { value: null },
+    editing: {
+        get: function() {
+            return this._editing;
+        },
+        set: function(value) {
+            if(value === this._editing) { return; }
+            this._editing = value;
+            this.needsDraw = true;
+        }
+    },
+    _translateDistance : {
         value: null
     },
 
+    displayEditView : {
+        value: function(bindingArgs) {
+            this.editing = true;
+        }
+    },
+
+    /* -------------------------
+        Draw Cycle
+     ------------------------- */
+
     templateDidLoad : {
         value: function() {
             Object.defineBinding(this, 'bindings', {
@@ -18,9 +42,23 @@ exports.BindingPanel = Montage.create(Component, {
         }
     },
 
-    prepareForDraw: {
+    willDraw: {
         value: function() {
-            console.log("test- objects");
+            if(this.editing) {
+                this._translateDistance = this.element.offsetWidth;
+            }
+        }
+    },
+
+    draw : {
+        value: function() {
+            var transStr = '-webkit-transform';
+
+            if(this.editing) {
+                this.editView.element.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)');
+            } else {
+                this.editView.element.style.removeProperty(transStr);
+            }
         }
     }
 });
\ No newline at end of file