2 files changed, 113 insertions, 10 deletions

diff --git a/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.html b/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.html
index 5ef13fab..572e5a60 100755
--- a/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.html
+++ b/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.html
@@ -219,7 +219,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
             "properties": {
                 "element": {"#": "rdioLocal"},
                 "label": "Local",
-                "value": "Local",
                 "group": {"@": "axisModeGroup"},
                 "checked": true
             }
@@ -229,7 +228,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
             "properties": {
                 "element": {"#": "rdioGlobal"},
                 "label": "Global",
-                "value": "Global",
                 "group": {"@": "axisModeGroup"}
             }
         },
diff --git a/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.js b/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.js
index 104d474d..5839ac64 100755
--- a/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.js
+++ b/js/panels/properties.reel/sections/three-d-view.reel/three-d-view.js
@@ -4,8 +4,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
 </copyright> */
 
-var Montage = require("montage/core/core").Montage;
-var Component = require("montage/ui/component").Component;
+var Montage = require("montage/core/core").Montage,
+    Component = require("montage/ui/component").Component;
 
 exports.ThreeD = Montage.create(Component, {
 
@@ -51,6 +51,61 @@ exports.ThreeD = Montage.create(Component, {
         }
     },
 
+    x3DControl: {
+        value: null,
+        serializable: true
+    },
+
+    y3DControl: {
+        value: null,
+        serializable: true
+    },
+
+    z3DControl: {
+        value: null,
+        serializable: true
+    },
+
+    x3DLabel: {
+        value: null,
+        serializable: true
+    },
+
+    y3DLabel: {
+        value: null,
+        serializable: true
+    },
+
+    z3DLabel: {
+        value: null,
+        serializable: true
+    },
+
+    xAngleControl: {
+        value: null,
+        serializable: true
+    },
+
+    yAngleControl: {
+        value: null,
+        serializable: true
+    },
+
+    zAngleControl: {
+        value: null,
+        serializable: true
+    },
+
+    axisModeGroupControl: {
+        value: null,
+        serializable: true
+    },
+
+    flattenControl: {
+        value: null,
+        serializable: true
+    },
+
     x3D: {
         value: 0
     },
@@ -107,6 +162,10 @@ exports.ThreeD = Montage.create(Component, {
         value: null
     },
 
+    _transformCtr: {
+        value: null
+    },
+
     handleAction: {
         value: function(event) {
             if(event.currentTarget.identifier === "flatten") {
@@ -143,10 +202,20 @@ exports.ThreeD = Montage.create(Component, {
         value : function(prop, value, item, inGlobalMode, isChanging){
             if(!this._curMat) {
                 this._curMat = this.application.ninja.elementMediator.getMatrix(item);
+//                this._transformCtr = item.elementModel.props3D.m_transformCtr || [0,0,0];
+                // TODO - Always use the center for now until we support multiple selections
+                this._transformCtr = [0,0,0];
+                if(inGlobalMode) {
+                    this._transformCtr = MathUtils.transformPoint(this._transformCtr, this._curMat);
+                }
             }
 
-            var curMat = this._curMat;
-            var delta = value.value;
+            var curMat = this._curMat,
+                delta = value.value,
+                isRotating = false,
+                xFormMat = Matrix.I(4),
+                tMat = Matrix.I(4),
+                mat = [];
             if(inGlobalMode) {
 
                 if(!this._curProp) {
@@ -156,17 +225,19 @@ exports.ThreeD = Montage.create(Component, {
                 delta -= this._curProp;
             }
 
-            var xFormMat = Matrix.I(4);
             switch (prop)
             {
                 case "xAngle":
                     xFormMat = Matrix.RotationX(MathUtils.DEG_TO_RAD * delta);
+                    isRotating = true;
                     break;
                 case "yAngle":
                     xFormMat = Matrix.RotationY(MathUtils.DEG_TO_RAD * delta);
+                    isRotating = true;
                     break;
                 case "zAngle":
                     xFormMat = Matrix.RotationZ(MathUtils.DEG_TO_RAD * delta);
+                    isRotating = true;
                     break;
                 case "x3D":
                     xFormMat[12] = delta;
@@ -179,11 +250,45 @@ exports.ThreeD = Montage.create(Component, {
                     break;
             }
 
-            var mat = [];
             if(inGlobalMode) {
-                glmat4.multiply(xFormMat, curMat, mat);
+
+                if(isRotating) {
+
+                    // pre-translate by the transformation center
+                    tMat[12] = this._transformCtr[0];
+                    tMat[13] = this._transformCtr[1];
+                    tMat[14] = this._transformCtr[2];
+
+                    glmat4.multiply(tMat, xFormMat, mat);
+
+                    // translate back
+                    tMat[12] = -this._transformCtr[0];
+                    tMat[13] = -this._transformCtr[1];
+                    tMat[14] = -this._transformCtr[2];
+
+                    glmat4.multiply(mat, tMat, mat);
+                    glmat4.multiply(mat, curMat, mat);
+                } else {
+                    glmat4.multiply(xFormMat, curMat, mat);
+                }
             } else {