11 files changed, 106 insertions, 33 deletions

diff --git a/js/controllers/elements/body-controller.js b/js/controllers/elements/body-controller.js
new file mode 100755
index 00000000..fbbb7c6e
--- /dev/null
+++ b/js/controllers/elements/body-controller.js
@@ -0,0 +1,44 @@
+/* <copyright>
+This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+(c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+</copyright> */
+
+var Montage = require("montage/core/core").Montage,
+    ElementController = require("js/controllers/elements/element-controller").ElementController;
+
+exports.BodyController = Montage.create(ElementController, {
+
+    // TODO - perspective distance needs to be passed in as "dist" and matrix3d needs to be passed in as "mat"
+    set3DProperties: {
+        value: function(el, props, update3DModel) {
+        }
+    },
+
+    getProperty: {
+        value: function(el, p) {
+        }
+    },
+
+    setProperty: {
+        value: function(el, p, value) {
+        }
+    },
+
+    setAttribute: {
+        value: function(el, att, value) {
+        }
+    },
+
+    getPerspectiveDist: {
+        value: function(el) {
+            if(el.elementModel && el.elementModel.props3D && el.elementModel.props3D.perspectiveDist) {
+                return el.elementModel.props3D.perspectiveDist;
+            } else {
+                var dist = this.application.ninja.stylesController.getPerspectiveDistFromElement(el, true);
+                el.elementModel.props3D.perspectiveDist = dist;
+                return dist;
+            }
+        }
+    }
+});
diff --git a/js/controllers/elements/controller-factory.js b/js/controllers/elements/controller-factory.js
index a772eb16..1bbbbce0 100755
--- a/js/controllers/elements/controller-factory.js
+++ b/js/controllers/elements/controller-factory.js
@@ -6,7 +6,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 
 var Montage         = require("montage/core/core").Montage;
 
-var BlockController = require("js/controllers/elements/block-controller").BlockController,
+var BodyController = require("js/controllers/elements/body-controller").BodyController,
+    BlockController = require("js/controllers/elements/block-controller").BlockController,
     StageController = require("js/controllers/elements/stage-controller").StageController,
     ShapesController = require("js/controllers/elements/shapes-controller").ShapesController,
         ImageController = require("js/controllers/elements/image-controller").ImageController,
@@ -27,6 +28,8 @@ exports.ControllerFactory = Montage.create(Montage, {
                     return BlockController;
                 } else if(value.indexOf("stage") !== -1) {
                     return StageController;
+                } else if(value.indexOf("body") !== -1) {
+                    return BodyController;
                 } else if(value.indexOf("shape") !== -1) {
                     return ShapesController;
                 } else if(value.indexOf("canvas") !== -1) {
diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js
index 157c54ec..65161b4f 100755
--- a/js/data/pi/pi-data.js
+++ b/js/data/pi/pi-data.js
@@ -9,6 +9,20 @@ var Montage = require("montage/core/core").Montage,
 
 exports.PiData = Montage.create( Montage, {
 
+    bodyPi: {
+        value: [
+            {
+                label: "Style",
+
+                                Section: [
+                                    [
+
+                                    ]
+                                ]
+            }
+        ]
+    },
+
     stagePi: {
         value: [
             {
diff --git a/js/document/document-html.js b/js/document/document-html.js
index 8cb88516..24eb4f47 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -270,7 +270,8 @@ exports.HtmlDocument = Montage.create(Component, {
 
                     //TODO Finish this implementation once we start caching Core Elements
                     // Assign a model to the UserContent and add the ViewPort reference to it.
-                    document.application.njUtils.makeElementModel(this.documentRoot, "Stage", "stage");
+                    document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body");
+//                    this.documentRoot.elementModel.props3D.init(this.documentRoot, true);
 
                     for(i = 0; i < this._stylesheets.length; i++) {
                         if(this._stylesheets[i].ownerNode.id === "nj-stage-stylesheet") {
@@ -309,6 +310,12 @@ exports.HtmlDocument = Montage.create(Component, {
         }
     },
 
+    GetElementFromPoint: {
+        value: function(x, y) {
+            return this._window.getElement(x,y);
+        }
+    },
+
     // Handler for user content main reel. Gets called once the main reel of the template
     // gets deserialized.
     // Setting up the currentSelectedContainer to the document body.
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 3876670c..3dbf96ce 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -759,10 +759,14 @@ exports.HTMLDocument = Montage.create(TextDocument, {
                                         //TODO Finish this implementation once we start caching Core Elements
                                         // Assign a model to the UserContent and add the ViewPort reference to it.
                                         NJUtils.makeElementModel(this.documentRoot, "Stage", "stage");
-                                        //this.documentRoot.elementModel.viewPort = this.iframe.contentWindow.document.getElementById("Viewport");
-                                        NJUtils.makeElementModel(this.stageBG, "Stage", "stage");
+                    NJUtils.makeElementModel(this.stageBG, "Stage", "stage");
                                         NJUtils.makeElementModel(this.iframe.contentWindow.document.getElementById("Viewport"), "Stage", "stage");
-                                         
+
+                    // Initialize the 3D properties
+                    this.documentRoot.elementModel.props3D.init(this.documentRoot, true);
+                    this.stageBG.elementModel.props3D.init(this.stageBG, true);
+                    this.iframe.contentWindow.document.getElementById("Viewport").elementModel.props3D.init(this.iframe.contentWindow.document.getElementById("Viewport"), true);
+
                                         for(i = 0; i < this._stylesheets.length; i++) {
                                                 if(this._stylesheets[i].ownerNode.id === this._stageStyleSheetId) {
                                                         this.documentRoot.elementModel.defaultRule = this._stylesheets[i];
diff --git a/js/document/templates/montage-web/default_html.css b/js/document/templates/montage-web/default_html.css
index db069d4e..08e39f22 100755
--- a/js/document/templates/montage-web/default_html.css
+++ b/js/document/templates/montage-web/default_html.css
@@ -11,7 +11,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 }
 
 .active-element-outline {
-  outline: #adff2f solid 2px;
+    outline: #adff2f solid 2px;
 }
 
 .nj-preset-transition {
diff --git a/js/document/templates/montage-web/index.html b/js/document/templates/montage-web/index.html
index 90b0f7fd..c52a5394 100755
--- a/js/document/templates/montage-web/index.html
+++ b/js/document/templates/montage-web/index.html
@@ -42,7 +42,7 @@
 
         <body>
                 
-                <div>IPSUM</div>
+                <!--<div>IPSUM</div>-->
 
         </body>
 
diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js
index 67bb59c4..dae128e4 100755
--- a/js/lib/NJUtils.js
+++ b/js/lib/NJUtils.js
@@ -94,10 +94,10 @@ exports.NJUtils = Object.create(Object.prototype, {
     ///// TODO: find a different place for this function
     makeElementModel: {
         value: function(el, selection, controller, isShape) {
+            //el.elementModel = Montage.create(ElementModel).initialize(el.nodeName, selection, controller, isShape);
+
             var p3d = Montage.create(Properties3D);
-            if(selection === "Stage") {
-                p3d.init(el, true);
-            }
+
             var shapeProps = null;
             var pi = controller + "Pi";
 
@@ -143,6 +143,7 @@ exports.NJUtils = Object.create(Object.prototype, {
                     isShape:    { value: isShape}
             });
 
+
         }
     },
 
@@ -167,15 +168,12 @@ exports.NJUtils = Object.create(Object.prototype, {
                     break;
                 case "canvas":
                     isShape = el.getAttribute("data-RDGE-id");
-                    if(isShape)
+                    if(isShape) {