Fixed scrolling and centering stage code. Also, moved liveNodeList into the design view and added an option to exclude styles and text nodes when retrieving the live nodes.

Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>

3 files changed, 40 insertions, 81 deletions

diff --git a/js/stage/layout.js b/js/stage/layout.js
index 9c5e2167..107e8abf 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -64,10 +64,10 @@ exports.Layout = Montage.create(Component, {
             if(this.application.ninja.documentController.activeDocument.currentView === "design") {
                 this.elementsToDraw = this.application.ninja.documentController.activeDocument.documentRoot.childNodes;
             }
-
-            // Draw the elements and the 3d info
-            this.draw();
-            this.draw3DInfo(false);
+//
+//            // Draw the elements and the 3d info
+//            this.draw();
+//            this.draw3DInfo(false);
         }
     },
 
@@ -89,7 +89,8 @@ exports.Layout = Montage.create(Component, {
 
             if(this.application.ninja.documentController.activeDocument.currentView === "design"){
                 // Make an array copy of the line node list which is not an array like object
-                this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0);
+//                this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0);
+                this.domTree = this.application.ninja.currentDocument.model.views.design.getLiveNodeList(true);
                 // Index of the current container
                 containerIndex = this.domTree.indexOf(this.application.ninja.currentSelectedContainer);
 
diff --git a/js/stage/stage-deps.js b/js/stage/stage-deps.js
index 0d53696b..d018b03b 100755
--- a/js/stage/stage-deps.js
+++ b/js/stage/stage-deps.js
@@ -26,38 +26,12 @@ exports.StageDeps = Montage.create(Component, {
         value: drawUtils
     },
 
-    _userContentLeft: {
-        value: null
-    },
-
-    userContentLeft: {
-        get: function() { return this._userContentLeft; },
-        set: function(value) {
-            if(value != null) {
-                viewUtils.setUserContentLeft(value);
-            }
-        }
-    },
-
-    _userContentTop: {
-        value: null
-    },
-
-    userContentTop: {
-        get: function() { return this._userContentTop; },
-        set: function(value) {
-            if(value != null) {
-                viewUtils.setUserContentTop(value);
-            }
-        }
-    },
-
     deserializedFromTemplate: {
         value: function() {
 
             this.eventManager.addEventListener("appLoaded", this, false);
-            this.eventManager.addEventListener("openDocument", this, false);
-            this.eventManager.addEventListener("switchDocument", this, false);
+//            this.eventManager.addEventListener("openDocument", this, false);
+//            this.eventManager.addEventListener("switchDocument", this, false);
 
             // Initialize Deps
             // HACK
@@ -76,19 +50,6 @@ exports.StageDeps = Montage.create(Component, {
 
     handleAppLoaded: {
         value: function() {
-
-            Object.defineBinding(this, "userContentLeft", {
-                boundObject: this.stage,
-                boundObjectPropertyPath: "_userContentLeft",
-                oneway: true
-            });
-
-            Object.defineBinding(this, "userContentTop", {
-                boundObject: this.stage,
-                boundObjectPropertyPath: "_userContentTop",
-                oneway: true
-            });
-
             // Setup the snap manager pointer to the app model
             snapManager.appModel = this.application.ninja.appModel;
             // bind the snap properties to the snap manager
@@ -105,7 +66,8 @@ exports.StageDeps = Montage.create(Component, {
 
             workingPlane = [0,0,1,0];
 
-            snapManager.reload2DCache();
+//            snapManager.reload2DCache();
+            snapManager._isCacheInvalid = true;
             snapManager.setupDragPlaneFromPlane (workingPlane);
 
             drawUtils.initializeFromDocument();
@@ -116,9 +78,9 @@ exports.StageDeps = Montage.create(Component, {
         value: function(){
             workingPlane = [0,0,1,0];
 
+            snapManager._isCacheInvalid = true;
             snapManager.setupDragPlaneFromPlane (workingPlane);
-            snapManager.reload2DCache();
-
+//            snapManager.reload2DCache();
 
             drawUtils.initializeFromDocument();
         }
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 69cfa7ba..a3903ac7 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -235,14 +235,6 @@ exports.Stage = Montage.create(Component, {
             this._context = this._canvas.getContext("2d");
             this._drawingContext= this._drawingCanvas.getContext("2d");
 
-            this._scrollLeft = this._iframeContainer.scrollLeft;
-            this._scrollTop = this._iframeContainer.scrollTop;
-            this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder;
-            this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder;
-
-            // TODO: Fix the mouse wheel scroll
-            // this._canvas.addEventListener("mousewheel", this, false);
-
             // Setup event listeners
             this._drawingCanvas.addEventListener("mousedown", this, false);
             this._drawingCanvas.addEventListener("mouseup", this, false);
@@ -269,30 +261,38 @@ exports.Stage = Montage.create(Component, {
     // Event details will contain the active document prior to opening a new one
     handleOpenDocument: {
         value: function(evt) {
+            var designView = this.application.ninja.currentDocument.model.views.design;
+
             this.hideCanvas(false);
 
             // Recalculate the canvas sizes because of splitter resizing
             this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ;
             this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11;
 
-
-            this.userContentBorder = 0;
-
-            this._scrollLeft = 0;
-            this._scrollTop = 0;
-            this._userContentLeft = this._documentOffsetLeft;
-            this._userContentTop = this._documentOffsetTop;
-
             this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this._canvas.width - 11;
             this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this._canvas.height - 11;
-            this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false);
-
-            // TODO - We will need to modify this once we support switching between multiple documents
-            this.application.ninja.toolsData.selectedToolInstance._configure(true);
+            designView.iframe.contentWindow.addEventListener("scroll", this, false);
 
             this.addPropertyChangeListener("appModel.show3dGrid", this, false);
 
+            this.stageDeps.handleOpenDocument();
             this.layout.handleOpenDocument();
+
+            if(designView._template) {
+                var initialLeft = parseInt((this.canvas.width - designView._template.size.width)/2);
+                var initialTop = parseInt((this.canvas.height - designView._template.size.height)/2);
+                if(initialLeft > this.documentOffsetLeft) {
+                    this.userPaddingLeft = -initialLeft;
+                }
+                if(initialTop > this.documentOffsetTop) {
+                    this.userPaddingTop = -initialTop;
+                }
+            }
+
+            this.centerStage();
+
+            // TODO - We will need to modify this once we support switching between multiple documents
+            this.application.ninja.toolsData.selectedToolInstance._configure(true);
         }
     },
 
@@ -485,10 +485,7 @@ exports.Stage = Montage.create(Component, {
             // Need to clear the snap cache and set up the drag plane
             //snapManager.setupDragPlaneFromPlane( workingPlane );
             this.stageDeps.snapManager._isCacheInvalid = true;
-
-            this.needsDraw = true;
-            this.layout.draw();
-            //this._toolsList.action("DrawHandles");
+            this.updatedStage = true;
         }
     },
 
@@ -517,16 +514,15 @@ exports.Stage = Montage.create(Component, {
      */
     centerStage: {
         value: function() {
-            if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") {
-                this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this.application.ninja.currentDocument.documentRoot.parentNode.offsetWidth)/2;
-                this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this.application.ninja.currentDocument.documentRoot.parentNode.offsetHeight)/2;
+            var designView = this.application.ninja.currentDocument.model.views.design;
+            if(designView._template) {
+                designView.document.body.scrollLeft = this._documentOffsetLeft - parseInt((this.canvas.width - designView._template.size.width)/2);