Merge branch 'refs/heads/master' into binding

Conflicts:
	js/components/layout/tools-list.reel/tools-list.html
	js/components/layout/tools-properties.reel/tools-properties.html
	js/document/document-html.js
	js/document/templates/app/main.js
	js/panels/Panel.reel/Panel.js
	node_modules/montage/ui/native-control.js

Signed-off-by: Armen Kesablyan <armen@motorola.com>

1 files changed, 221 insertions, 44 deletions

diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 63339c57..33c4fd22 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -11,6 +11,11 @@ var Montage = 	require("montage/core/core").Montage,
 
 exports.Stage = Montage.create(Component, {
 
+    appModel: {
+        value: null,
+        serializable: true
+    },
+
     // TODO - Need to figure out how to remove this dependency
     // Needed by some tools that depend on selectionDrawn event to set up some logic
     drawNow: { value : false },
@@ -25,7 +30,10 @@ exports.Stage = Montage.create(Component, {
         value: null
     },
 
-    _iframeContainer: { value: null },
+    _iframeContainer: {
+        value: null,
+        serializable: true
+    },
 
     _scrollFlag: {value: true, writable: true},
     outFlag: { value: false, writable: true },
@@ -91,29 +99,82 @@ exports.Stage = Montage.create(Component, {
     },
 
     /** MAIN CANVASES **/
-    _canvas: { value: null },   // selection bounds, 3d normals and the overall 3d selection box use this canvas
-    canvas: { get: function() { return this._canvas; } },
+    // selection bounds, 3d normals and the overall 3d selection box use this canvas
+    _canvas: {
+        value: null,
+        serializable: true
+    },
+
+    canvas: {
+        get: function() {
+            return this._canvas;
+        }
+    },
 
     _context: { value: null },
     context: { get: function() { return this._context; } },
 
-    _layoutCanvas: { value: null },
-    layoutCanvas: { get: function() { return this._layoutCanvas; } },
+    _layoutCanvas: {
+        value: null,
+        serializable: true
+    },
 
-    _gridCanvas: { value: null },
-    gridCanvas: { get: function() { return this._gridCanvas; } },
+    layoutCanvas: {
+        get: function() {
+            return this._layoutCanvas;
+        }
+    },
+
+    _gridCanvas: {
+        value: null,
+        serializable: true
+    },
+
+    gridCanvas: {
+        get: function() {
+            return this._gridCanvas;
+        }
+    },
 
     _gridContext: { value: null },
     gridContext: { get: function() { return this._gridContext; } },
 
-    _drawingCanvas: { value: null },
-    drawingCanvas: { get: function() { return this._drawingCanvas; } },
+    _drawingCanvas: {
+        value: null,
+        serializable: true
+    },
+
+    drawingCanvas: {
+        get: function() {
+            return this._drawingCanvas;
+        }
+    },
 
     _drawingContext: { value: null },
     drawingContext: { get: function() { return this._drawingContext; } },
 
     _clickPoint: { value: { x: { value: null }, y: { value: null } } },
 
+    stageDeps: {
+        value: null,
+        serializable: true
+    },
+
+    layout: {
+        value: null,
+        serializable: true
+    },
+
+    textTool: {
+        value: null,
+        serializable: true
+    },
+
+    focusManager: {
+        value: null,
+        serializable: true
+    },
+
     // We will set this to false while moving objects to improve performance
     showSelectionBounds: { value: true },
 
@@ -185,6 +246,13 @@ exports.Stage = Montage.create(Component, {
             if(this.currentDocument && (this.currentDocument.currentView === "design")) {
                 this.currentDocument.model.scrollLeft = this._scrollLeft;
                 this.currentDocument.model.scrollTop = this._scrollTop;
+                this.currentDocument.model.userPaddingLeft = this._userPaddingLeft;
+                this.currentDocument.model.userPaddingTop = this._userPaddingTop;
+                this.currentDocument.model.documentOffsetLeft = this._documentOffsetLeft;
+                this.currentDocument.model.documentOffsetTop = this._documentOffsetTop;
+                this.currentDocument.model.userContentLeft = this._userContentLeft;
+                this.currentDocument.model.userContentTop = this._userContentTop;
+
                 //call configure false with the old document on the selected tool to tear down down any temp. stuff
                 this.application.ninja.toolsData.selectedToolInstance._configure(false);
             }
@@ -279,9 +347,6 @@ exports.Stage = Montage.create(Component, {
 
             this.eventManager.addEventListener( "appMouseUp", this, false);
 
-
-            this.eventManager.addEventListener( "openDocument", this, false);
-            this.eventManager.addEventListener( "switchDocument", this, false);
             this.eventManager.addEventListener( "enableStageMove", this, false);
             this.eventManager.addEventListener( "disableStageMove", this, false);
 
@@ -289,19 +354,9 @@ exports.Stage = Montage.create(Component, {
             this.eventManager.addEventListener( "elementChanging", this, false);
             this.eventManager.addEventListener( "elementChange", this, false);
 
-        }
-    },
-
-    // Event details will contain the active document prior to opening a new one
-    handleOpenDocument: {
-        value: function(evt) {
-            this.initWithDocument();
-        }
-    },
+            this.addPropertyChangeListener("currentDocument.model.domContainer", this, true);
+//            this.addPropertyChangeListener("currentDocument.model.domContainer", this);
 
-    handleSwitchDocument: {
-        value: function(evt) {
-            this.initWithDocument(true);
         }
     },
 
@@ -313,6 +368,23 @@ exports.Stage = Montage.create(Component, {
 
             if(model.scrollLeft != null) {
                 didSwitch = true;
+                this._userPaddingLeft = this.currentDocument.model.userPaddingLeft;
+                this._userPaddingTop = this.currentDocument.model.userPaddingTop;
+                this._documentOffsetLeft = this.currentDocument.model.documentOffsetLeft;
+                this._documentOffsetTop  = this.currentDocument.model.documentOffsetTop;
+                this._userContentLeft = this.currentDocument.model.userContentLeft;
+                this._userContentTop = this.currentDocument.model.userContentTop;
+                this._scrollLeft = this.currentDocument.model.scrollLeft;
+                this._scrollTop = this.currentDocument.model.scrollTop;
+            } else {
+                this._userPaddingLeft = 0;
+                this._userPaddingTop = 0;
+                this._documentOffsetLeft = 0;
+                this._documentOffsetTop  = 0;
+                this._userContentLeft = 0;
+                this._userContentTop = 0;
+                this._scrollLeft = 0;
+                this._scrollTop = 0;
             }
 
             // Recalculate the canvas sizes because of splitter resizing
@@ -323,19 +395,7 @@ exports.Stage = Montage.create(Component, {
 
             this.addPropertyChangeListener("appModel.show3dGrid", this, false);
 
-            this._userPaddingLeft = 0;
-            this._userPaddingTop = 0;
-
-            this._documentOffsetLeft = 0;
-            this._documentOffsetTop  = 0;
-
-            this._userContentLeft = 0;
-            this._userContentTop = 0;
-
-            this._scrollLeft = 0;
-            this._scrollTop = 0;
-
-            this.initialize3DOnOpenDocument();
+            this.initialize3DOnOpenDocument(!didSwitch);
 
             if(designView._template) {
                 var initialLeft = parseInt((this.canvas.width - designView._template.size.width)/2);
@@ -380,6 +440,17 @@ exports.Stage = Montage.create(Component, {
                     this.updatedStage = true;