9 files changed, 467 insertions, 336 deletions

diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index 9792c7f6..079eb754 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -32,9 +32,6 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
     _iframeHolder: { value: null, enumerable: false },
     _textHolder: { value: null, enumerable: false },
     _codeMirrorCounter: {value: 1, enumerable: false},
-
-    canSave:{value: false},//for Save menu state update
-    canSaveAll:{value: false},//for Save All menu state update
     
     activeDocument: {
         get: function() {
@@ -50,12 +47,6 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
                 if(!!this._activeDocument.editor){
                     this._activeDocument.editor.focus();
                 }
-
-                this.canSave = doc.needsSave;
-                this.canSaveAll = doc.needsSave;
-            }else{
-                this.canSave = false;
-                this.canSaveAll = false;
             }
         }
     },
@@ -80,7 +71,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
     handleAddComponentFirstDraw: {
         value: function (e) {
                 //TODO: Add logic to reparse the document for dynamically added styles
-                console.log(e);
+                //console.log(e);
         }
     },
     
diff --git a/js/controllers/elements/canvas-controller.js b/js/controllers/elements/canvas-controller.js
index b5df3911..b8894c18 100755
--- 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(element, properties) {
+            for(var property in properties) {
+                this.setProperty(element, property, properties[property]);
+            }
+        }
     }
 });
\ No newline at end of file
diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js
index 260ee8a0..d902e4a1 100755
--- a/js/controllers/elements/component-controller.js
+++ b/js/controllers/elements/component-controller.js
@@ -16,6 +16,7 @@ exports.ComponentController = Montage.create(ElementController, {
             switch(prop) {
                 case "id":
                 case "class":
+                case "-webkit-transform-style":
                 case "left":
                 case "top":
                 case "width":
@@ -38,6 +39,7 @@ exports.ComponentController = Montage.create(ElementController, {
             switch(p) {
                 case "id":
                 case "class":
+                case "-webkit-transform-style":
                 case "left":
                 case "top":
                 case "width":
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index efb33292..35a543ac 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -47,10 +47,10 @@ exports.ElementController = Montage.create(Component, {
     },
 
     setProperties: {
-        value: function(el, props, index) {
-            for(var p in props) {
-                this.application.ninja.stylesController.setElementStyle(el, p, props[p][index]);
-            }
+        value: function(element, properties) {
+            for(var property in properties) {
+                this.application.ninja.stylesController.setElementStyle(element, property, properties[property]);
+        }
         }
     },
 
@@ -65,37 +65,29 @@ exports.ElementController = Montage.create(Component, {
     // borderSide : "top", "right", "bottom", or "left"
     getColor: {
         value: function(el, isFill, borderSide) {
-            var colorObj,
-                color,
-                image;
+            var colorObj, color, image;
 
             // Return cached value if one exists
-            if(isFill)
-            {
-                if(el.elementModel.fill)
-                {
+            if(isFill) {
+                if(el.elementModel.fill) {
                     return el.elementModel.fill;
                 }
                 //TODO: Once logic for color and gradient is established, this needs to be revised
                 color = this.getProperty(el, "background-color");
                 image = this.getProperty(el, "background-image");
-            }
-            else
-            {
+            } else {
                 // Try getting border color from specific side first
-                if(borderSide)
-                {
+                if(borderSide) {
                     color = this.getProperty(el, "border-" + borderSide + "-color");
                     image = this.getProperty(el, "border-" + borderSide + "-image");
                 }
 
                 // If no color was found, look up the shared border color
-                if(!color && !image)
-                {
-                    if(el.elementModel.stroke)
-                    {
+                if(!color && !image) {
+                    if(el.elementModel.stroke) {
                         return el.elementModel.stroke;
                     }
+
                     color = this.getProperty(el, "border-color");
                     image = this.getProperty(el, "border-image");
                 }
@@ -112,17 +104,12 @@ exports.ElementController = Montage.create(Component, {
             }
 
             // Update cache
-            if(isFill)
-            {
+            if(isFill) {
                 el.elementModel.fill = colorObj;
-            }
-            else if(!borderSide)
-            {
+            } else if(!borderSide) {
                 // TODO - Need to update border style and width also
                 el.elementModel.stroke = colorObj;
-            }
-            else
-            {
+            } else {
                 // TODO - Should update specific border sides too
             }
 
@@ -133,10 +120,9 @@ exports.ElementController = Montage.create(Component, {
     setColor: {
         value: function(el, color, isFill) {
             var mode = color.mode;
-            if(isFill)
-            {
-                if(mode)
-                {
+
+            if(isFill) {
+                if(mode) {
                     switch (mode) {
                         case 'nocolor':
                             this.setProperty(el, "background-image", "none");
@@ -152,12 +138,10 @@ exports.ElementController = Montage.create(Component, {
                             this.setProperty(el, "background-color", color.color.css);
                     }
                 }
+
                 el.elementModel.fill = color;
-            }
-            else
-            {
+            } else {
+                if(mode) {