3 files changed, 39 insertions, 15 deletions

diff --git a/js/panels/Color/colortoolbar.reel/colortoolbar.js b/js/panels/Color/colortoolbar.reel/colortoolbar.js
index 10ae8b6e..6b8e476b 100644
--- a/js/panels/Color/colortoolbar.reel/colortoolbar.js
+++ b/js/panels/Color/colortoolbar.reel/colortoolbar.js
@@ -20,7 +20,7 @@ exports.ColorToolbar = Montage.create(Component, {
     //Storing stroke (stores color in mode use to select color)
     _stroke: {
         enumerable: false,
-        value: {colorMode: 'rgb', color: {r: 0, g: 0, b: 0, a: 1, css: 'rgb(0,0,0)', mode:'rgb', wasSetByCode: false, type: 'change'}, webGlColor: [0, 0, 0, 1]}
+        value: {colorMode: 'rgb', color: {r: 0, g: 0, b: 0, a: 1, css: 'rgb(0,0,0)', mode:'rgb', wasSetByCode: true, type: 'change'}, webGlColor: [0, 0, 0, 1]}
     },
     ////////////////////////////////////////////////////////////////////
     //
@@ -39,7 +39,7 @@ exports.ColorToolbar = Montage.create(Component, {
     //Storing fill (stores color in mode use to select color)
     _fill: {
         enumerable: false,
-        value: {colorMode: 'rgb', color: {r: 255, g: 255, b: 255, a: 1, css: 'rgb(255,255,255)', mode:'rgb', wasSetByCode: false, type: 'change'}, webGlColor: [1, 1, 1, 1]}
+        value: {colorMode: 'rgb', color: {r: 255, g: 255, b: 255, a: 1, css: 'rgb(255,255,255)', mode:'rgb', wasSetByCode: true, type: 'change'}, webGlColor: [1, 1, 1, 1]}
     },
     ////////////////////////////////////////////////////////////////////
     //
@@ -86,8 +86,8 @@ exports.ColorToolbar = Montage.create(Component, {
                 this.application.ninja.colorController.addButton('chip', this.fill_btn);
             this.application.ninja.colorController.addButton('chip', this.stroke_btn);
             //
-            this.fill_btn.color('rgb', {wasSetByCode: false, type: 'change', color: {r: 255, g: 255, b: 255}, css: 'rgb(255,255,255)'});
-            this.stroke_btn.color('rgb', {wasSetByCode: false, type: 'change', color: {r: 0, g: 0, b: 0}, css: 'rgb(0,0,0)'});
+            this.fill_btn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 255, b: 255}, css: 'rgb(255,255,255)'});
+            this.stroke_btn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 0, g: 0, b: 0}, css: 'rgb(0,0,0)'});
         }
     },
     ////////////////////////////////////////////////////////////////////
diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js
index 34c38e70..0088447a 100644
--- a/js/panels/properties/content.reel/content.js
+++ b/js/panels/properties/content.reel/content.js
@@ -97,10 +97,24 @@ exports.Content = Montage.create(Component, {
         value: function(event) {
 //            console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update
             if(event.detail.source && event.detail.source !== "pi") {
-                this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(this.application.ninja.selectedElements[0]._element, "left"));
-                this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(this.application.ninja.selectedElements[0]._element, "top"));
+                // TODO - This should only update the properties that were changed.
+                var el = this.application.ninja.selectedElements[0]._element || this.application.ninja.selectedElements[0];
+                this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left"));
+                this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top"));
+                this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height"));
+                this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width"));
+
+                if(this.threeD.inGlobalMode)
+                {
+                    this.threeD.x3D = ElementsMediator.get3DProperty(el, "x3D");
+                    this.threeD.y3D = ElementsMediator.get3DProperty(el, "y3D");
+                    this.threeD.z3D = ElementsMediator.get3DProperty(el, "z3D");
+                    this.threeD.xAngle = ElementsMediator.get3DProperty(el, "xAngle");
+                    this.threeD.yAngle = ElementsMediator.get3DProperty(el, "yAngle");
+                    this.threeD.zAngle = ElementsMediator.get3DProperty(el, "zAngle");
             }
         }
+        }
     },
 
     handleSelectionChange: {
@@ -183,8 +197,11 @@ exports.Content = Montage.create(Component, {
 
                         if(control.type !== "color") {
                             currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator);
-                            currentValue ? currentValue = currentValue : currentValue = control.defaultValue;
-                            this.customSections[0].content.controls[control.id] = currentValue;
+                            if(currentValue === null)
+                            {
+                                currentValue = control.defaultValue;
+                            }
+                            this.customSections[i].content.controls[control.id] = currentValue;
                         }
                         else
                         {
@@ -198,7 +215,6 @@ exports.Content = Montage.create(Component, {
                                 this.application.ninja.colorController.colorModel.input = "fill";
                             }
 
-                            debugger;
                             if(currentValue)
                             {
                                 if(currentValue.mode === "gradient")
@@ -270,12 +286,6 @@ exports.Content = Montage.create(Component, {
 
             e.units ? newValue = e.value + e.units : newValue = e.value;
 
-            if(e.prop === "border-width") {// || e.prop === "border-style") {
-                ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Change", "pi");
-            } else if(e.prop === "border-style") {
-                ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-width", [this.customSections[0].content.controls.borderWidth + "px"], "Change", "pi");
-            }
-
             ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [newValue], "Change", "pi");
 
         }
diff --git a/js/panels/properties/sections/custom.reel/custom.js b/js/panels/properties/sections/custom.reel/custom.js
index 2b5b522a..992db8e6 100644
--- a/js/panels/properties/sections/custom.reel/custom.js
+++ b/js/panels/properties/sections/custom.reel/custom.js
@@ -186,6 +186,8 @@ exports.CustomSection = Montage.create(Component, {
             if (aField.value)       obj.value = aField.value;
             if (aField.labelField)  obj.labelField = aField.labelField;
             if (aField.labelFunction)  obj.labelFunction = aField.labelFunction;
+            if (aField.dataField)  obj.dataField = aField.dataField;
+            if (aField.dataFunction)  obj.dataFunction = aField.dataFunction;
             if (aField.items) {
                 if(aField.items.boundObject) {
                     obj.items = eval(aField.items.boundObject)[aField.items.boundProperty];
@@ -193,6 +195,18 @@ exports.CustomSection = Montage.create(Component, {
                     obj.items = aField.items;
                 }
             }
+            if (aField.enabled) {
+                if(aField.enabled.boundObject) {
+                    // TODO - For now, always bind to this.controls[someProperty]
+                    Object.defineBinding(obj, "enabled", {
+                                    boundObject: this.controls,
+                                    boundObjectPropertyPath: aField.enabled.boundProperty,
+                                    oneway: false
+                                });
+                } else {
+                    obj.enabled = aField.enabled;
+                }
+            }
 
             obj.addEventListener("change", this, false);
 //