4 files changed, 163 insertions, 29 deletions

diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js
index 83450d0f..260ee8a0 100755
--- a/js/controllers/elements/component-controller.js
+++ b/js/controllers/elements/component-controller.js
@@ -11,6 +11,8 @@ exports.ComponentController = Montage.create(ElementController, {
 
     getProperty: {
         value: function(el, prop) {
+            var component = el.controller || this.application.ninja.currentDocument.getComponentFromElement(el);
+
             switch(prop) {
                 case "id":
                 case "class":
@@ -19,18 +21,20 @@ exports.ComponentController = Montage.create(ElementController, {
                 case "width":
                 case "height":
                     if(el.nodeName === "IMG" && (prop === "width" || prop === "height")) {
-                        return this.application.ninja.currentDocument.getComponentFromElement(el)[prop];
+                        return component[prop];
                     } else {
                         return ElementController.getProperty(el, prop, true);
                     }
                 default:
-                    return this.application.ninja.currentDocument.getComponentFromElement(el)[prop];
+                    return component[prop];
             }
         }
     },
 
     setProperty: {
         value: function(el, p, value) {
+            var component = el.controller || this.application.ninja.currentDocument.getComponentFromElement(el);
+
             switch(p) {
                 case "id":
                 case "class":
@@ -39,15 +43,14 @@ exports.ComponentController = Montage.create(ElementController, {
                 case "width":
                 case "height":
                     if(el.nodeName === "IMG" && (p === "width" || p === "height")) {
-                        this.application.ninja.currentDocument.getComponentFromElement(el)[p] = value;
+                        component[p] = value;
                     } else {
                         ElementController.setProperty(el, p, value);
                     }
                     break;
                 default:
                     if(p === "min" || p === "max") value = parseFloat(value);
-
-                    this.application.ninja.currentDocument.getComponentFromElement(el)[p] = value;
+                    component[p] = value;
                     break;
 
             }
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 70aba54e..b35251ad 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -228,22 +228,6 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
                         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;
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index d72d9c14..ef453bea 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -6,10 +6,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 
 var Montage =                   require("montage/core/core").Montage,
     CanvasController = require("js/controllers/elements/canvas-controller").CanvasController,
-    njModule = require("js/lib/NJUtils");
-
-var World = require("js/lib/drawing/world").World;
-var MaterialsModel = require("js/models/materials-model").MaterialsModel;
+    njModule = require("js/lib/NJUtils"),
+    World = require("js/lib/drawing/world").World,
+    MaterialsModel = require("js/models/materials-model").MaterialsModel;
 
 exports.ShapesController = Montage.create(CanvasController, {
 
@@ -100,6 +99,51 @@ exports.ShapesController = Montage.create(CanvasController, {
                         el.elementModel.shapeModel.GLWorld.render();
                     }
                     break;
+                case "editStrokeMaterial":
+                    NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.strokeMaterial.getName()});
+                    break;
+                case "editFillMaterial":
+                    NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.fillMaterial.getName()});
+                    break;
+                case "animate":
+                    if(value)
+                    {
+                        el.elementModel.shapeModel.animate = true;
+                        el.elementModel.shapeModel.GLWorld._previewAnimation = true;
+                        el.elementModel.shapeModel.GLWorld.restartRenderLoop();
+                    }
+                    else
+                    {
+                        el.elementModel.shapeModel.animate = false;
+                        el.elementModel.shapeModel.GLWorld._previewAnimation = false;
+                        el.elementModel.shapeModel.GLWorld._canvas.task.stop();
+                    }
+                    break;
+                case "strokeHardness":
+                    this.setShapeProperty(el, "strokeHardness", value);
+                    el.elementModel.shapeModel.GLGeomObj.setStrokeHardness(val);
+                    el.elementModel.shapeModel.GLWorld.render();
+                    break;
+                case "strokeSmoothing":
+                    this.setShapeProperty(el, "strokeSmoothing", value);
+                    el.elementModel.shapeModel.GLGeomObj.setSmoothingAmount(val);
+                    el.elementModel.shapeModel.GLWorld.render();
+                    break;
+                case "doSmoothing":
+                    this.setShapeProperty(el, "doSmoothing", value);
+                    el.elementModel.shapeModel.GLGeomObj.setDoSmoothing(value);
+                    el.elementModel.shapeModel.GLWorld.render();
+                    break;
+                case "isCalligraphic":
+                    this.setShapeProperty(el, "isCalligraphic", value);
+                    el.elementModel.shapeModel.GLGeomObj.setStrokeUseCalligraphic(value);
+                    el.elementModel.shapeModel.GLWorld.render();
+                    break;
+                case "strokeAngle":
+                    this.setShapeProperty(el, "strokeAngle", value);
+                    el.elementModel.shapeModel.GLGeomObj.setStrokeAngle(Math.PI * val/180);
+                    el.elementModel.shapeModel.GLWorld.render();
+                    break;
                 default:
                     CanvasController.setProperty(el, p, value);
             }
@@ -118,7 +162,45 @@ exports.ShapesController = Montage.create(CanvasController, {
                 case "border":
                 case "background":
                 case "useWebGl":
+                case "animate":
                     return this.getShapeProperty(el, p);
+                case "strokeHardness":
+                    if (el.elementModel && el.elementModel.shapeModel){
+                        return el.elementModel.shapeModel.GLGeomObj.getStrokeHardness();
+                    } else {
+                        return null;
+                    }
+                    break;
+                case "doSmoothing":
+                    if (el.elementModel && el.elementModel.shapeModel){
+                        return el.elementModel.shapeModel.GLGeomObj.getDoSmoothing();
+                    } else {
+                        return null;
+                    }
+                    break;
+                case "strokeSmoothing":
+                    if (el.elementModel && el.elementModel.shapeModel){
+                        return el.elementModel.shapeModel.GLGeomObj.getSmoothingAmount();
+                    } else {
+                        return null;
+                    }
+                    break;
+                case "isCalligraphic":
+                    if (el.elementModel && el.elementModel.shapeModel){
+                        return el.elementModel.shapeModel.GLGeomObj.getStrokeUseCalligraphic();
+                    } else {
+                        return null;
+                    }
+                    break;
+                case "strokeAngle":
+                    if (el.elementModel && el.elementModel.shapeModel){
+                        return 180*el.elementModel.shapeModel.GLGeomObj.getStrokeAngle()/Math.PI;
+                    } else {
+                        return null;
+                    }