10 files changed, 61 insertions, 46 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/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/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);
                         var tMat = Matrix.Translation( [0.5*width, 0.5*height, 0] );
diff --git a/js/helper-classes/3D/snap-manager.js b/js/helper-classes/3D/snap-manager.js
index f4bfc12b..31e3e540 100755
--- a/js/helper-classes/3D/snap-manager.js
+++ b/js/helper-classes/3D/snap-manager.js
@@ -1617,11 +1617,7 @@ var SnapManager = exports.SnapManager = Montage.create(Component, {
                                         if (x > y) {
                                                 if (x > z) {
                                                         plane[0] = 1;
-                            if(this.application.ninja.currentDocument.documentRoot.id !== "UserContent") {
-                                plane[3] = stage.scrollWidth / 2.0;
-                            } else {
-                                plane[3] = this.getStageWidth() / 2.0;
-                            }
+                            plane[3] = this.getStageWidth() / 2.0;
                                                         if (dir[0] > 0) plane[3] = -plane[3];
                                                         change = !drawUtils.drawYZ;
                                                         drawUtils.drawXY = drawUtils.drawXZ = false;
@@ -1639,11 +1635,7 @@ var SnapManager = exports.SnapManager = Montage.create(Component, {
                                         else {
                                                 if (y > z) {
                                                         plane[1] = 1;
-                            if(this.application.ninja.currentDocument.documentRoot.id !== "UserContent") {
-                                plane[3] = stage.scrollHeight / 2.0;
-                            } else {
-                                plane[3] = this.getStageHeight() / 2.0;
-                            }
+                            plane[3] = this.getStageHeight() / 2.0;
                                                         if (dir[1] > 0) plane[3] = -plane[3];
                                                         change = !drawUtils.drawXZ;
                                                         drawUtils.drawXY = drawUtils.drawYZ = false;
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js
index 40a19b90..36d6f8c4 100755
--- a/js/helper-classes/3D/view-utils.js
+++ b/js/helper-classes/3D/view-utils.js
@@ -309,11 +309,12 @@ exports.ViewUtils = Montage.create(Component, {
             // transform the bounds up the tree
             var child = elt;
             var parent = elt.offsetParent;
-            while ( parent )
+            while ( child )
             {
                 pt = this.childToParent( pt, child );
 
-                if (parent === this._rootElement)  break;
+//                if (parent === this._rootElement)  break;
+                if (child === this._stageElement)  break;
 
                 child = parent;
                 parent = parent.offsetParent;
@@ -352,7 +353,8 @@ exports.ViewUtils = Montage.create(Component, {
 
             // transform the bounds up the tree
             var parent = child.offsetParent;
-            if ( parent )
+            // TODO - Should have a different way to check for new template mode
+            if ( parent || ((child === this.application.ninja.currentDocument.documentRoot) && (child.id !== "UserContent")) )
             {
                 this.setViewportObj( child );
 
diff --git a/js/io/templates/files/html.txt b/js/io/templates/files/html.txt
index 15641348..4e42267e 100755
--- a/js/io/templates/files/html.txt
+++ b/js/io/templates/files/html.txt
@@ -9,6 +9,10 @@
                 <meta name="generator" content="Motorola Mobility Ninja">
                 
                 <style type="text/css">
+                    html, body {
+                width: 100%;