Merge pull request #195 from mqg734/Dom-Architecture

Fixes for 3d, selection, and keyboard shortcuts

16 files changed, 82 insertions, 80 deletions

diff --git a/js/controllers/elements/body-controller.js b/js/controllers/elements/body-controller.js
index 14aeae24..943594f2 100755
--- a/js/controllers/elements/body-controller.js
+++ b/js/controllers/elements/body-controller.js
@@ -28,11 +28,39 @@ exports.BodyController = Montage.create(ElementController, {
 
     getProperty: {
         value: function(el, p) {
+            switch(p) {
+                case "background" :
+                    return this.application.ninja.colorController.getColorObjFromCss(this.application.ninja.stylesController.getElementStyle(el, "background-color", true, true));
+                case "border":
+                    return 0;
+                case "height":
+                case "width":
+                case "-webkit-transform-style":
+                    return this.application.ninja.stylesController.getElementStyle(el, p, true, true);
+                default:
+                    return ElementController.getProperty(el, p, true, true);
+                    //console.log("Undefined Stage property ", p);
+            }
         }
     },
 
     setProperty: {
         value: function(el, p, value) {
+            switch(p) {
+                case "body-background":
+                case "background":
+                    this.application.ninja.stylesController.setElementStyle(el, "background-color", value, true);
+                    break;
+                case "overflow":
+                case "width":
+                case "height":
+                case "-webkit-transform-style":
+                    this.application.ninja.stylesController.setElementStyle(el, p, value, true);
+                    this.application.ninja.stage.updatedStage = true;
+                    break;
+                default:
+                    console.log("Undefined property ", p, "for the Body Controller");
+            }
         }
     },
 
diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js
index 2bd774f5..a81cdf7f 100755
--- a/js/controllers/selection-controller.js
+++ b/js/controllers/selection-controller.js
@@ -112,12 +112,12 @@ exports.SelectionController = Montage.create(Component, {
 
     handleSelectAll: {
         value: function(event) {
-            var selected = [], childNodes = [];
+            var selected = [], childNodes = [], self = this;
 
             childNodes = this.application.ninja.currentDocument.documentRoot.childNodes;
             childNodes = Array.prototype.slice.call(childNodes, 0);
             childNodes.forEach(function(item) {
-                if(item.nodeType == 1) {
+                if(self.isNodeTraversable(item)) {
                     selected.push(item);
                 }
             });
@@ -280,6 +280,13 @@ exports.SelectionController = Montage.create(Component, {
 
             return -1;
         }
+    },
+
+    isNodeTraversable: {
+        value: function( item ) {
+            if(item.nodeType !== 1) return false;
+            return ((item.nodeName !== "STYLE") && (item.nodeName !== "SCRIPT"));
+        }
     }
 
 });
diff --git a/js/document/document-html.js b/js/document/document-html.js
index deca9f83..f3c135ed 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -41,7 +41,7 @@ exports.HtmlDocument = Montage.create(Component, {
         ////////////////////////////////////////////////////////////////////
         //
     exclusionList: {
-        value: [] //TODO: Update to correct list
+        value: ["HTML", "BODY"] //TODO: Update to correct list
     },
         ////////////////////////////////////////////////////////////////////
         //
@@ -73,7 +73,7 @@ exports.HtmlDocument = Montage.create(Component, {
                 views: {value: {'design': DesignDocumentView.create(), 'code': null}} //TODO: Add code view logic
             });
             //Initiliazing views and hiding
-                if (this.model.views.design.initiliaze(document.getElementById("iframeContainer"))) {
+                if (this.model.views.design.initialize(document.getElementById("iframeContainer"))) {
                         //Hiding iFrame, just initiliazing
                         this.model.views.design.hide();
                 } else {
@@ -115,6 +115,12 @@ exports.HtmlDocument = Montage.create(Component, {
             this.loaded.callback.call(this.loaded.context, this);
             //Setting opacity to be viewable after load
                         this.model.views.design.iframe.style.opacity = 1;
+
+
+
+
+
+            this.application.ninja.appModel.show3dGrid = true;
         }
     }
     ////////////////////////////////////////////////////////////////////
diff --git a/js/document/models/html.js b/js/document/models/html.js
index f45a0e21..5eedb731 100755
--- a/js/document/models/html.js
+++ b/js/document/models/html.js
@@ -15,6 +15,10 @@ exports.HtmlDocumentModel = Montage.create(BaseDocumentModel, {
         //
         hasTemplate: {
         value: false
+    },
+
+    draw3DGrid: {
+        value: false
     }
         ////////////////////////////////////////////////////////////////////
         ////////////////////////////////////////////////////////////////////
diff --git a/js/document/templates/montage-web/index.html b/js/document/templates/montage-web/index.html
index 1c6b6287..47964ae4 100755
--- a/js/document/templates/montage-web/index.html
+++ b/js/document/templates/montage-web/index.html
@@ -23,8 +23,13 @@
                         padding: 0;
                                 position: absolute;
                                 -webkit-transform-style: preserve-3d;
-                                -webkit-perspective: 1400px;
+                                -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
                         }
+
+            html, body {
+                width: 100%;
+                height: 100%;
+            }
                         
                         ninjaloadinghack {
                                 display: none;
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 4f598305..6cce229c 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -49,7 +49,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
     },
     ////////////////////////////////////////////////////////////////////
         //
-        initiliaze: {
+        initialize: {
         value: function (parent) {
                 //Creating iFrame for view
                 this.iframe = document.createElement("iframe");
diff --git a/js/helper-classes/3D/draw-utils.js b/js/helper-classes/3D/draw-utils.js
index 88830964..f869f65e 100755
--- a/js/helper-classes/3D/draw-utils.js
+++ b/js/helper-classes/3D/draw-utils.js
@@ -584,18 +584,10 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
                         var ptOnPlane = MathUtils.getPointOnPlane(this._workingPlane);
 
             // define the grid parameters
-            var width,
-                height,
+            var width = this.snapManager.getStageWidth(),
+                height = this.snapManager.getStageHeight(),
                 nLines = 10;
 
-//            if(this.application.ninja.documentController.webTemplate) {
-            if(this.application.ninja.currentDocument.documentRoot.id !== "UserContent") {
-                width = this.application.ninja.currentDocument.documentRoot.scrollWidth;
-                height = this.application.ninja.currentDocument.documentRoot.scrollHeight;
-            } else {
-                width = this.snapManager.getStageWidth();
-                height = this.snapManager.getStageHeight();
-            }
                         // get a matrix from working plane space to the world
                         var mat = this.getPlaneToWorldMatrix(zAxis, ptOnPlane);