1 files changed, 156 insertions, 229 deletions

diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js
index f9411f48..7033ee3d 100755
--- a/js/tools/SelectionTool.js
+++ b/js/tools/SelectionTool.js
@@ -33,19 +33,16 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
 
     _areElementsOnSamePlane : {
         value: function () {
-            if(this._targets && this._targets.length)
-            {
-                var len = this._targets.length;
+            if(this.application.ninja.selectedElements.length) {
+                var len = this.application.ninja.selectedElements.length;
                 var plane = this.application.ninja.stage.stageDeps.snapManager.getDragPlane();
-                for(var i = 0; i < len; i++)
-                {
-                    var elt = this._targets[i].elt;
-                    if(!this.application.ninja.stage.stageDeps.snapManager.elementIsOnPlane(elt, plane))
-                    {
+                for(var i = 0; i < len; i++) {
+                    if(!this.application.ninja.stage.stageDeps.snapManager.elementIsOnPlane(this.application.ninja.selectedElements[i], plane)) {
                         return false;
                     }
                 }
             }
+
             return true;
         }
     },
@@ -60,6 +57,7 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
             else
             {
                 this._canSnap = true;
+                this._updateTargets();
             }
 
             this.isDrawing = true;
@@ -223,7 +221,7 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
     HandleDoubleClick: {
         value: function(event) {
             if(this.application.ninja.selectedElements.length > 0) {
-                this.application.ninja.currentSelectedContainer = this.application.ninja.selectedElements[0]._element;
+                this.application.ninja.currentSelectedContainer = this.application.ninja.selectedElements[0];
             } else {
                 this.application.ninja.currentSelectedContainer = this.application.ninja.currentDocument.documentRoot;
             }
@@ -242,8 +240,8 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
                         case Keyboard.LEFT:
                             var newLeft = [];
                             var leftArr = this.application.ninja.selectedElements.map(function(item) {
-                                newLeft.push( (parseInt(ElementsMediator.getProperty(item._element, "left")) - inc) + "px"  );
-                                return ElementsMediator.getProperty(item._element, "left");
+                                newLeft.push( (parseInt(ElementsMediator.getProperty(item, "left")) - inc) + "px"  );
+                                return ElementsMediator.getProperty(item, "left");
                             });
 
                             ElementsMediator.setProperty(this.application.ninja.selectedElements, "left", newLeft , "Change", "selectionTool", leftArr);
@@ -251,8 +249,8 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
                         case Keyboard.UP:
                             var newTop = [];
                             var topArr = this.application.ninja.selectedElements.map(function(item) {
-                                newTop.push( (parseInt(ElementsMediator.getProperty(item._element, "top")) - inc) + "px"  );
-                                return ElementsMediator.getProperty(item._element, "top");
+                                newTop.push( (parseInt(ElementsMediator.getProperty(item, "top")) - inc) + "px"  );
+                                return ElementsMediator.getProperty(item, "top");
                             });
 
                             ElementsMediator.setProperty(this.application.ninja.selectedElements, "top", newTop , "Change", "selectionTool", topArr);
@@ -260,8 +258,8 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
                         case Keyboard.RIGHT:
                             var newLeft = [];
                             var leftArr = this.application.ninja.selectedElements.map(function(item) {
-                                newLeft.push( (parseInt(ElementsMediator.getProperty(item._element, "left")) + inc) + "px"  );
-                                return ElementsMediator.getProperty(item._element, "left");
+                                newLeft.push( (parseInt(ElementsMediator.getProperty(item, "left")) + inc) + "px"  );
+                                return ElementsMediator.getProperty(item, "left");
                             });
 
                             ElementsMediator.setProperty(this.application.ninja.selectedElements, "left", newLeft , "Change", "selectionTool", leftArr);
@@ -269,8 +267,8 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
                         case Keyboard.DOWN:
                             var newTop = [];
                             var topArr = this.application.ninja.selectedElements.map(function(item) {
-                                newTop.push( (parseInt(ElementsMediator.getProperty(item._element, "top")) + inc) + "px"  );
-                                return ElementsMediator.getProperty(item._element, "top");
+                                newTop.push( (parseInt(ElementsMediator.getProperty(item, "top")) + inc) + "px"  );
+                                return ElementsMediator.getProperty(item, "top");
                             });
 
                             ElementsMediator.setProperty(this.application.ninja.selectedElements, "top", newTop , "Change", "selectionTool", topArr);
@@ -295,190 +293,103 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, {
     },
 
     _updateTargets: {
-        value: function(addToUndoStack) {
-            var newLeft = [],
-                newTop = [],
-                newWidth = [],
-                newHeight = [],
-                newStyles = [],
-                previousLeft = [],
-                previousTop = [],
-                previousWidth = [],
-                previousHeight = [],
-                previousStyles = [];
-            var len = this.application.ninja.selectedElements.length;
-            this._targets = [];
-            for(var i = 0; i < len; i++)
-            {
-                var elt = this.application.ninja.selectedElements[i]._element;
+        value: function(addToUndo) {
+            var modObject = [], mod3dObject = [], self = this;
+
+            this.application.ninja.selectedElements.forEach(function(element) {
+
+                if(addToUndo) {
+                    if(!self._use3DMode) {
+                        var prevX = element.elementModel.getProperty("x");
+                        var prevY = element.elementModel.getProperty("y");
+                        var prevW = element.elementModel.getProperty("w");
+                        var prevH = element.elementModel.getProperty("h");
+                        var x = ElementsMediator.getProperty(element, "left");
+                        var y = ElementsMediator.getProperty(element, "top");
+                        var w = ElementsMediator.getProperty(element, "width");
+                        var h = ElementsMediator.getProperty(element, "height");
+
+                        // if we have a delta, that means the transform handles were used and
+                        // we should update the width and height too.  Otherwise, just update left and top.
+                        if(this.delta) {
+                            modObject.push({element:element, properties:{left: x, top:y, width: w, height: h}, previousProperties: {left: prevX, top:prevY, width: prevW, height: prevH}});
+                        } else {
+                            modObject.push({element:element, properties:{left: x, top:y}, previousProperties: {left: prevX, top:prevY}});
+                        }
 
-                var curMat = viewUtils.getMatrixFromElement(elt);
-                var curMatInv = glmat4.inverse(curMat, []);
+                    } else {
+                        // Not using the 3d mode
+                        var previousMat = element.elementModel.getProperty("mat").slice(0);
+                        var prevW = element.elementModel.getProperty("w");
+                        var prevH = element.elementModel.getProperty("h");
+                        var w = ElementsMediator.getProperty(element, "width");
+                        var h = ElementsMediator.getProperty(element, "height");
 
-                this._targets.push({elt:elt, mat:curMat, matInv:curMatInv});
-                if(addToUndoStack)
-                {
+                        var previousStyleStr = {dist:element.elementModel.getProperty("dist"), mat:MathUtils.scientificToDecimal(previousMat, 5)};
+                        var newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(element), mat:MathUtils.scientificToDecimal(viewUtils.getMatrixFromElement(element), 5)};
 
-                    if(!this._use3DMode)
-                    {
-                        var previousMat = this._undoArray[i].mat.slice(0);
-                        var prevX = this._undoArray[i]._x;
-                        var prevY = this._undoArray[i]._y;
-                        var prevW = this._undoArray[i]._w;
-                        var prevH = this._undoArray[i]._h;
-                        var _x = parseInt(ElementsMediator.getProperty(elt, "left")) + curMat[12] - previousMat[12];
-                        var _y = parseInt(ElementsMediator.getProperty(elt, "top")) + curMat[13] - previousMat[13];
-                        var _w = parseInt(ElementsMediator.getProperty(elt, "width"));
-                        var _h = parseInt(ElementsMediator.getProperty(elt, "height"));
-
-                        previousLeft.push(prevX + "px");
-                        previousTop.push(prevY + "px");
-                        previousWidth.push(prevW + "px");
-                        previousHeight.push(prevH + "px");
-                        newLeft.push(_x + "px");
-                        newTop.push(_y + "px");
-                        newWidth.push(_w + "px");
-                        newHeight.push(_h + "px");
-
-                        viewUtils.setMatrixForElement(elt, previousMat);
-
-                        this._targets[i].mat = previousMat;
-                        this._targets[i].matInv = glmat4.inverse(previousMat, []);
-                    }
-                    else
-                    {
-                        var previousMat = this._undoArray[i].mat.slice(0);
-                        var prevW = this._undoArray[i]._w;
-                        var prevH = this._undoArray[i]._h;
-                        var _w = parseInt(ElementsMediator.getProperty(elt, "width"));
-                        var _h = parseInt(ElementsMediator.getProperty(elt, "height"));
-                        previousWidth.push(prevW + "px");
-                        previousHeight.push(prevH + "px");
-                        newWidth.push(_w + "px");
-                        newHeight.push(_h + "px");
-
-                        var previousStyleStr = {dist:this._undoArray[i].dist,
-                                                mat:MathUtils.scientificToDecimal(previousMat, 5)};
-                        var newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(elt),
-                                            mat:MathUtils.scientificToDecimal(curMat, 5)};
-                        previousStyles.push(previousStyleStr);
-                        newStyles.push(newStyleStr);
-
-                        this._targets[i].mat = curMat;
-                        this._targets[i].matInv = curMatInv;
-                    }
-                }
-            }
-            if(addToUndoStack)
-            {
-                if(!this._use3DMode)
-                {
-                    // if we have a delta, that means the transform handles were used and
-                    // we should update the width and height too.  Otherwise, just update left and top.
-                    if(this._delta)
-                    {
-                        ElementsMediator.setProperties(this.application.ninja.selectedElements,
-                                                    { "left": newLeft, "top": newTop, "width": newWidth, "height": newHeight },
+                        modObject.push({element:element, properties:{width: w, height:h}, previousProperties: {width: prevW, height:prevH}});
+                        mod3dObject.push({element:element, properties:newStyleStr, previousProperties: previousStyleStr});