Merge pull request #12 from mqg734/ToolFixes

Merged pan and zoom tool and 3d stage orientation fixes.  Also updated PI to support shapes properties.

20 files changed, 325 insertions, 270 deletions

diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.js b/js/components/tools-properties/rect-properties.reel/rect-properties.js
index 8d0cd21f..1e717f88 100644
--- a/js/components/tools-properties/rect-properties.reel/rect-properties.js
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.js
@@ -113,7 +113,7 @@ exports.RectProperties = Montage.create(ToolProperties, {
 
     handleChange: {
         value: function(event) {
-            var hotTxt = event.currentTarget
+            var hotTxt = event.currentTarget;
             if(hotTxt.units === "%") {
                 if(hotTxt.value > 50) {
                     hotTxt.maxValue = 50;
diff --git a/js/controllers/elements/canvas-controller.js b/js/controllers/elements/canvas-controller.js
index 21de9879..b5df3911 100644
--- a/js/controllers/elements/canvas-controller.js
+++ b/js/controllers/elements/canvas-controller.js
@@ -34,12 +34,12 @@ exports.CanvasController = Montage.create(ElementController, {
             }
         }
     },
-
-    setProperties: {
-        value: function(el, props, index) {
-            for(var p in props) {
-                el.elementModel.controller.setProperty(el, p, props[p][index]);
-            }
-        }
+        
+   setProperties: {
+       value: function(el, props, index) {
+           for(var p in props) {
+               el.elementModel.controller.setProperty(el, p, props[p][index]);
+           }
+       }
     }
 });
\ No newline at end of file
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index f254220c..f2b54014 100644
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -127,36 +127,35 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
             }
             else
             {
-                // TODO - for now, just return the identity matrix
-                return Matrix.I(4);
-//                var mat;
-//
-//                if (elt)
-//                {
-//                    var xformStr = ElementsMediator.getProperty(elt, "-webkit-transform");
-//                    if (xformStr)
-//                        mat = this.transformStringToMat( xformStr );
-//                    if (!mat)
-//                        mat = Matrix.I(4);
-//
-//                    if (elt.style && elt.style.zoom)
-//                    {
-//                        var zoom = Number(elt.style.zoom);
-//                        if (zoom != 1)
-//                        {
-//                            var zoomMat = Matrix.create(  [
-//                                [ zoom,    0,    0, 0],
-//                                [    0, zoom,    0, 0],
-//                                [    0,    0, zoom, 0],
-//                                [    0,    0,    0, 1]
-//                            ] );
-//                            glmat4.multiply( zoomMat, mat, mat );
-//                        }
-//                    }
-//                }
-//
-//                elt.elementModel.props3D.matrix3d = mat;
-//                return mat;
+                var mat;
+
+                if (el)
+                {
+                    var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform");
+                    if (xformStr)
+                        mat = this.transformStringToMat( xformStr );
+                    if (!mat)
+                        mat = Matrix.I(4);
+
+                    var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom");
+                    if (zoom)
+                    {
+                        zoom = Number(zoom);
+                        if (zoom != 1)
+                        {
+                            var zoomMat = Matrix.create(  [
+                                [ zoom,    0,    0, 0],
+                                [    0, zoom,    0, 0],
+                                [    0,    0, zoom, 0],
+                                [    0,    0,    0, 1]
+                            ] );
+                            glmat4.multiply( zoomMat, mat, mat );
+                        }
+                    }
+                }
+
+                el.elementModel.props3D.matrix3d = mat;
+                return mat;
             }
         }
     },
@@ -207,7 +206,7 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
             el.elementModel.props3D.matrix3d = mat;
             el.elementModel.props3D.perspectiveDist = dist;
 
-//            if(update3DModel)
+            if(update3DModel)
             {
                 this._update3DProperties(el, mat, dist);
             }
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index d34644a7..c5f22138 100644
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -24,6 +24,26 @@ exports.ShapesController = Montage.create(CanvasController, {
                     el.elementModel.shapeModel.GLGeomObj.setInnerRadius(val/100);
                     el.elementModel.shapeModel.GLGeomObj.buildBuffers();
                     break;
+                case "tlRadius":
+                    this.setShapeProperty(el, "tlRadius", value);
+                    el.elementModel.shapeModel.GLGeomObj.setTLRadius(val);
+                    el.elementModel.shapeModel.GLGeomObj.buildBuffers();
+                    break;
+                case "trRadius":
+                    this.setShapeProperty(el, "trRadius", value);
+                    el.elementModel.shapeModel.GLGeomObj.setTRRadius(val);
+                    el.elementModel.shapeModel.GLGeomObj.buildBuffers();
+                    break;
+                case "blRadius":
+                    this.setShapeProperty(el, "blRadius", value);
+                    el.elementModel.shapeModel.GLGeomObj.setBLRadius(val);
+                    el.elementModel.shapeModel.GLGeomObj.buildBuffers();
+                    break;
+                case "brRadius":
+                    this.setShapeProperty(el, "brRadius", value);
+                    el.elementModel.shapeModel.GLGeomObj.setBRRadius(val);
+                    el.elementModel.shapeModel.GLGeomObj.buildBuffers();
+                    break;
                 case "width":
                     el.elementModel.shapeModel.GLGeomObj.setWidth(val);
                     CanvasController.setProperty(el, p, value);
@@ -46,8 +66,16 @@ exports.ShapesController = Montage.create(CanvasController, {
     getProperty: {
         value: function(el, p) {
             switch(p) {
+                case "stroke":
+                case "fill":
                 case "strokeSize":
                 case "innerRadius":
+                case "tlRadius":
+                case "trRadius":
+                case "blRadius":
+                case "brRadius":
+                case "strokeMaterial":
+                case "fillMaterial":
                     return this.getShapeProperty(el, p);
                 default:
                     return CanvasController.getProperty(el, p);
diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js
index f162e919..de5cd34d 100644
--- a/js/data/pi/pi-data.js
+++ b/js/data/pi/pi-data.js
@@ -279,11 +279,13 @@ exports.PiData = Montage.create( Montage, {
                     [
                         {
                             type : "color",
-                            id : "stroke"
+                            id : "stroke",
+                            prop : "stroke"
                         },
                         {
                             type : "color",
                             id : "fill",
+                            prop : "fill",
                             divider : true
                         }
                     ],
@@ -313,10 +315,11 @@ exports.PiData = Montage.create( Montage, {
                             id: "tlRadius",
                             prop : "tlRadius",
                             label: "TL",
+                            valueMutator: parseFloat,
                             value : 0,
                             min :   0,