9 files changed, 263 insertions, 11 deletions
diff --git a/js/controllers/objects-controller.js b/js/controllers/objects-controller.js
index 2c9f2d66..32f24d5c 100644
--- a/js/controllers/objects-controller.js
+++ b/js/controllers/objects-controller.js
@@ -113,12 +113,38 @@ var objectsController = exports.ObjectsController = Montage.create(Component, {
    /* ---- Bindable Properties ---- */
-    getEnumerableProperties : {
+    getPropertyList : {
        value: function(object, excludeUnderscoreProperties) {
+            var object_i = object,
+                prototypes = [object_i];
+            ///// Collect prototypes
+            while(Object.getPrototypeOf(object_i)) {
+                object_i = Object.getPrototypeOf(object_i);
+                prototypes.push(object_i);
+            }
+            return prototypes.map(function(proto) {
+                var metadata = proto._montage_metadata,
+                    objectName = (metadata) ? metadata.objectName : "Object";
+                return {
+                    category : objectName,
+                    properties : this.getPropertiesFromObject(proto)
+                };
+            }, this);
+        }
+    },
+    getPropertiesFromObject : {
+        value: function (object, excludeUnderscoreProperties) {
            var properties = [];
            for(var key in object) {
-                properties.push(key);
+                if(object.hasOwnProperty(key)) {
+                    properties.push(key);
+                }
            }
            if(excludeUnderscoreProperties) {
@@ -146,7 +172,12 @@ var objectsController = exports.ObjectsController = Montage.create(Component, {
        set: function(value) {
            if(value === this._currentObject) { return; }
-            this.currentObjectBindings = this.getObjectBindings(value);
+            if(value) {
+                this.currentObjectBindings = this.getObjectBindings(value);
+                console.log("Property list", this.getPropertyList(value, true));
+            } else {
+                this.currentObjectBindings = [];
+            }
            this._currentObject = value;
        }
diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css
index f29b66c1..e3dcf140 100644
--- a/js/panels/binding-panel.reel/binding-panel.css
+++ b/js/panels/binding-panel.reel/binding-panel.css
@@ -4,6 +4,10 @@
 (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
 </copyright> */
+.binding-panel {
+    position: relative;
+    height: 100%;
+}
 .bindings-list {
    padding: 0;
diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html
index 2850b67c..a926da8d 100644
--- a/js/panels/binding-panel.reel/binding-panel.html
+++ b/js/panels/binding-panel.reel/binding-panel.html
@@ -13,7 +13,8 @@
            "owner": {
                "prototype": "js/panels/binding-panel.reel",
                "properties": {
-                    "element": {"#": "binding"}
+                    "element": {"#": "binding"},
+                    "editView": {"@": "editBinding"}
                }
            },
            "arrayController": {
@@ -41,16 +42,23 @@
                    "boundObject": {"<-": "@repetition.objectAtCurrentIteration.boundObject"},
                    "oneway": {"<-": "@repetition.objectAtCurrentIteration.oneway"}
                }
+            },
+            "editBinding": {
+                "prototype": "js/panels/binding/edit-binding-view.reel",
+                "properties": {
+                    "element": {"#": "edit-binding-view" }
+                }
            }
        }
                </script>
        </head>
 <body>
-    <div data-montage-id="binding">
+    <div data-montage-id="binding" class="binding-panel">
        <ul data-montage-id="bindings-list" class="bindings-list">
            <li data-montage-id="binding-item" class="binding-item"></li>
        </ul>
+        <div data-montage-id="edit-binding-view" class="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 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
diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html
index 79644a7a..95a349f8 100644
--- a/js/panels/binding/binding-item.reel/binding-item.html
+++ b/js/panels/binding/binding-item.reel/binding-item.html
@@ -14,6 +14,7 @@
                "prototype": "js/panels/binding/binding-item.reel",
                "properties": {
                    "element": {"#": "binding-item"},
+                    "editButton": {"@": "editButton" },
                    "directionToggleButton": {"@": "directionToggleButton" }
                }
            },
diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js
index 0fc06ea8..55230fc3 100644
--- a/js/panels/binding/binding-item.reel/binding-item.js
+++ b/js/panels/binding/binding-item.reel/binding-item.js
@@ -20,8 +20,10 @@ exports.BindingItem = Montage.create(Component, {
        set: function(value) {
            if(value === this._sourceObject) { return; }
-            this.sourceObj

diff --git a/js/controllers/objects-controller.js b/js/controllers/objects-controller.js index 2c9f2d66..32f24d5c 100644 --- a/js/controllers/objects-controller.js +++ b/js/controllers/objects-controller.js
@@ -113,12 +113,38 @@ var objectsController = exports.ObjectsController = Montage.create(Component, {
113		113
114	/* ---- Bindable Properties ---- */	114	/* ---- Bindable Properties ---- */
115		115
116	getEnumerableProperties : {	116	getPropertyList : {
117	value: function(object, excludeUnderscoreProperties) {	117	value: function(object, excludeUnderscoreProperties) {
		118	var object_i = object,
		119	prototypes = [object_i];
		120
		121	///// Collect prototypes
		122	while(Object.getPrototypeOf(object_i)) {
		123	object_i = Object.getPrototypeOf(object_i);
		124	prototypes.push(object_i);
		125	}
		126
		127	return prototypes.map(function(proto) {
		128	var metadata = proto._montage_metadata,
		129	objectName = (metadata) ? metadata.objectName : "Object";
		130
		131	return {
		132	category : objectName,
		133	properties : this.getPropertiesFromObject(proto)
		134	};
		135	}, this);
		136
		137	}
		138	},
		139
		140	getPropertiesFromObject : {
		141	value: function (object, excludeUnderscoreProperties) {
118	var properties = [];	142	var properties = [];
119		143
120	for(var key in object) {	144	for(var key in object) {
121	properties.push(key);	145	if(object.hasOwnProperty(key)) {
		146	properties.push(key);
		147	}
122	}	148	}
123		149
124	if(excludeUnderscoreProperties) {	150	if(excludeUnderscoreProperties) {
@@ -146,7 +172,12 @@ var objectsController = exports.ObjectsController = Montage.create(Component, {
146	set: function(value) {	172	set: function(value) {
147	if(value === this._currentObject) { return; }	173	if(value === this._currentObject) { return; }
148		174
149	this.currentObjectBindings = this.getObjectBindings(value);	175	if(value) {
		176	this.currentObjectBindings = this.getObjectBindings(value);
		177	console.log("Property list", this.getPropertyList(value, true));
		178	} else {
		179	this.currentObjectBindings = [];
		180	}
150		181
151	this._currentObject = value;	182	this._currentObject = value;
152	}	183	}


diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index f29b66c1..e3dcf140 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css
@@ -4,6 +4,10 @@
4	(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.	4	(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5	</copyright> */	5	</copyright> */
6		6
		7	.binding-panel {
		8	position: relative;
		9	height: 100%;
		10	}
7		11
8	.bindings-list {	12	.bindings-list {
9	padding: 0;	13	padding: 0;


diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index 2850b67c..a926da8d 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html
@@ -13,7 +13,8 @@
13	"owner": {	13	"owner": {
14	"prototype": "js/panels/binding-panel.reel",	14	"prototype": "js/panels/binding-panel.reel",
15	"properties": {	15	"properties": {
16	"element": {"#": "binding"}	16	"element": {"#": "binding"},
		17	"editView": {"@": "editBinding"}
17	}	18	}
18	},	19	},
19	"arrayController": {	20	"arrayController": {
@@ -41,16 +42,23 @@
41	"boundObject": {"<-": "@repetition.objectAtCurrentIteration.boundObject"},	42	"boundObject": {"<-": "@repetition.objectAtCurrentIteration.boundObject"},
42	"oneway": {"<-": "@repetition.objectAtCurrentIteration.oneway"}	43	"oneway": {"<-": "@repetition.objectAtCurrentIteration.oneway"}
43	}	44	}
		45	},
		46	"editBinding": {
		47	"prototype": "js/panels/binding/edit-binding-view.reel",
		48	"properties": {
		49	"element": {"#": "edit-binding-view" }
		50	}
44	}	51	}
45		52
46	}	53	}
47	</script>	54	</script>
48	</head>	55	</head>
49	<body>	56	<body>
50	<div data-montage-id="binding">	57	<div data-montage-id="binding" class="binding-panel">
51	<ul data-montage-id="bindings-list" class="bindings-list">	58	<ul data-montage-id="bindings-list" class="bindings-list">
52	<li data-montage-id="binding-item" class="binding-item"></li>	59	<li data-montage-id="binding-item" class="binding-item"></li>
53	</ul>	60	</ul>
		61	<div data-montage-id="edit-binding-view" class="edit-binding-view"></div>
54	</div>	62	</div>
55	</body>	63	</body>
56	</html> \ No newline at end of file	64	</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 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,
4		4
5	exports.BindingPanel = Montage.create(Component, {	5	exports.BindingPanel = Montage.create(Component, {
6		6
7	bindings : {	7	bindings : { value: null },
		8	editView : { value: null },
		9	editingClass : { value: 'editing-binding' },
		10	_editing: { value: null },
		11	editing: {
		12	get: function() {
		13	return this._editing;
		14	},
		15	set: function(value) {
		16	if(value === this._editing) { return; }
		17	this._editing = value;
		18	this.needsDraw = true;
		19	}
		20	},
		21	_translateDistance : {
8	value: null	22	value: null
9	},	23	},
10		24
		25	displayEditView : {
		26	value: function(bindingArgs) {
		27	this.editing = true;
		28	}
		29	},
		30
		31	/* -------------------------
		32	Draw Cycle
		33	------------------------- */
		34
11	templateDidLoad : {	35	templateDidLoad : {
12	value: function() {	36	value: function() {
13	Object.defineBinding(this, 'bindings', {	37	Object.defineBinding(this, 'bindings', {
@@ -18,9 +42,23 @@ exports.BindingPanel = Montage.create(Component, {
18	}	42	}
19	},	43	},
20		44
21	prepareForDraw: {	45	willDraw: {
22	value: function() {	46	value: function() {
23	console.log("test- objects");	47	if(this.editing) {
		48	this._translateDistance = this.element.offsetWidth;
		49	}
		50	}
		51	},
		52
		53	draw : {
		54	value: function() {
		55	var transStr = '-webkit-transform';
		56
		57	if(this.editing) {
		58	this.editView.element.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)');
		59	} else {
		60	this.editView.element.style.removeProperty(transStr);
		61	}
24	}	62	}
25	}	63	}
26	}); \ No newline at end of file	64	}); \ No newline at end of file


diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html index 79644a7a..95a349f8 100644 --- a/js/panels/binding/binding-item.reel/binding-item.html +++ b/js/panels/binding/binding-item.reel/binding-item.html
@@ -14,6 +14,7 @@
14	"prototype": "js/panels/binding/binding-item.reel",	14	"prototype": "js/panels/binding/binding-item.reel",
15	"properties": {	15	"properties": {
16	"element": {"#": "binding-item"},	16	"element": {"#": "binding-item"},
		17	"editButton": {"@": "editButton" },
17	"directionToggleButton": {"@": "directionToggleButton" }	18	"directionToggleButton": {"@": "directionToggleButton" }
18	}	19	}
19	},	20	},


diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index 0fc06ea8..55230fc3 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js
@@ -20,8 +20,10 @@ exports.BindingItem = Montage.create(Component, {
20	set: function(value) {	20	set: function(value) {
21	if(value === this._sourceObject) { return; }	21	if(value === this._sourceObject) { return; }
22		22
23	this.sourceObj