From e876941eaa6cf5adf0e028d0f3f9402284ea5de2 Mon Sep 17 00:00:00 2001
From: Jose Antonio Marquez
Date: Mon, 2 Apr 2012 10:39:12 -0700
Subject: Setting up document rework

---
 js/document/controllers/base-controller.js | 32 ------------------------------
 js/document/controllers/document.js        | 24 ++++++++++++++++++++++
 js/document/document-html.js               | 24 ++++++++++++++++++++++
 js/document/document-text.js               | 24 ++++++++++++++++++++++
 js/document/mediators/base-mediator.js     | 32 ------------------------------
 js/document/mediators/io.js                | 24 ++++++++++++++++++++++
 js/document/mediators/template.js          | 24 ++++++++++++++++++++++
 js/document/models/base-model.js           | 32 ------------------------------
 js/document/models/html.js                 | 25 +++++++++++++++++++++++
 js/document/models/text.js                 | 24 ++++++++++++++++++++++
 js/document/views/base-view.js             | 32 ------------------------------
 js/document/views/base.js                  | 24 ++++++++++++++++++++++
 js/document/views/code.js                  | 25 +++++++++++++++++++++++
 js/document/views/design.js                | 25 +++++++++++++++++++++++
 14 files changed, 243 insertions(+), 128 deletions(-)
 delete mode 100755 js/document/controllers/base-controller.js
 create mode 100755 js/document/controllers/document.js
 create mode 100755 js/document/document-html.js
 create mode 100755 js/document/document-text.js
 delete mode 100755 js/document/mediators/base-mediator.js
 create mode 100755 js/document/mediators/io.js
 create mode 100755 js/document/mediators/template.js
 delete mode 100755 js/document/models/base-model.js
 create mode 100755 js/document/models/html.js
 create mode 100755 js/document/models/text.js
 delete mode 100755 js/document/views/base-view.js
 create mode 100755 js/document/views/base.js
 create mode 100755 js/document/views/code.js
 create mode 100755 js/document/views/design.js

diff --git a/js/document/controllers/base-controller.js b/js/document/controllers/base-controller.js
deleted file mode 100755
index be441da2..00000000
--- a/js/document/controllers/base-controller.js
+++ /dev/null
@@ -1,32 +0,0 @@
-/* <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,
-	Component = require("montage/ui/component").Component;
-////////////////////////////////////////////////////////////////////////
-//	
-exports.ENTERNAME = Montage.create(Montage, {
-	////////////////////////////////////////////////////////////////////
-	//
-	hasTemplate: {
-		enumerable: false,
-        value: false
-    },
-	////////////////////////////////////////////////////////////////////
-    //
-	deserializedFromTemplate: {
-		enumerable: false,
-		value: function () {
-			//
-		}
-	}
-	////////////////////////////////////////////////////////////////////
-	////////////////////////////////////////////////////////////////////
-});
-////////////////////////////////////////////////////////////////////////
-////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/controllers/document.js b/js/document/controllers/document.js
new file mode 100755
index 00000000..45377b76
--- /dev/null
+++ b/js/document/controllers/document.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.DocumentController = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/document-html.js b/js/document/document-html.js
new file mode 100755
index 00000000..b48e004a
--- /dev/null
+++ b/js/document/document-html.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.HtmlDocument = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/document-text.js b/js/document/document-text.js
new file mode 100755
index 00000000..2a469144
--- /dev/null
+++ b/js/document/document-text.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.TextDocument = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/mediators/base-mediator.js b/js/document/mediators/base-mediator.js
deleted file mode 100755
index be441da2..00000000
--- a/js/document/mediators/base-mediator.js
+++ /dev/null
@@ -1,32 +0,0 @@
-/* <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,
-	Component = require("montage/ui/component").Component;
-////////////////////////////////////////////////////////////////////////
-//	
-exports.ENTERNAME = Montage.create(Montage, {
-	////////////////////////////////////////////////////////////////////
-	//
-	hasTemplate: {
-		enumerable: false,
-        value: false
-    },
-	////////////////////////////////////////////////////////////////////
-    //
-	deserializedFromTemplate: {
-		enumerable: false,
-		value: function () {
-			//
-		}
-	}
-	////////////////////////////////////////////////////////////////////
-	////////////////////////////////////////////////////////////////////
-});
-////////////////////////////////////////////////////////////////////////
-////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/mediators/io.js b/js/document/mediators/io.js
new file mode 100755
index 00000000..972a25e2
--- /dev/null
+++ b/js/document/mediators/io.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.IoDocumentMediator = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/mediators/template.js b/js/document/mediators/template.js
new file mode 100755
index 00000000..c5b45ba1
--- /dev/null
+++ b/js/document/mediators/template.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.TemplateDocumentMediator = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/models/base-model.js b/js/document/models/base-model.js
deleted file mode 100755
index be441da2..00000000
--- a/js/document/models/base-model.js
+++ /dev/null
@@ -1,32 +0,0 @@
-/* <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,
-	Component = require("montage/ui/component").Component;
-////////////////////////////////////////////////////////////////////////
-//	
-exports.ENTERNAME = Montage.create(Montage, {
-	////////////////////////////////////////////////////////////////////
-	//
-	hasTemplate: {
-		enumerable: false,
-        value: false
-    },
-	////////////////////////////////////////////////////////////////////
-    //
-	deserializedFromTemplate: {
-		enumerable: false,
-		value: function () {
-			//
-		}
-	}
-	////////////////////////////////////////////////////////////////////
-	////////////////////////////////////////////////////////////////////
-});
-////////////////////////////////////////////////////////////////////////
-////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/models/html.js b/js/document/models/html.js
new file mode 100755
index 00000000..0ac09f3b
--- /dev/null
+++ b/js/document/models/html.js
@@ -0,0 +1,25 @@
+/* <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,
+	Component = 		require("montage/ui/component").Component,
+	TextDocumentModel = require("js/document/models/text").TextDocumentModel;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.HtmlDocumentModel = Montage.create(TextDocumentModel, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/models/text.js b/js/document/models/text.js
new file mode 100755
index 00000000..c8fba911
--- /dev/null
+++ b/js/document/models/text.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.TextDocumentModel = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/views/base-view.js b/js/document/views/base-view.js
deleted file mode 100755
index be441da2..00000000
--- a/js/document/views/base-view.js
+++ /dev/null
@@ -1,32 +0,0 @@
-/* <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,
-	Component = require("montage/ui/component").Component;
-////////////////////////////////////////////////////////////////////////
-//	
-exports.ENTERNAME = Montage.create(Montage, {
-	////////////////////////////////////////////////////////////////////
-	//
-	hasTemplate: {
-		enumerable: false,
-        value: false
-    },
-	////////////////////////////////////////////////////////////////////
-    //
-	deserializedFromTemplate: {
-		enumerable: false,
-		value: function () {
-			//
-		}
-	}
-	////////////////////////////////////////////////////////////////////
-	////////////////////////////////////////////////////////////////////
-});
-////////////////////////////////////////////////////////////////////////
-////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/views/base.js b/js/document/views/base.js
new file mode 100755
index 00000000..50c0a78d
--- /dev/null
+++ b/js/document/views/base.js
@@ -0,0 +1,24 @@
+/* <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,
+	Component = require("montage/ui/component").Component;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.BaseDocumentView = Montage.create(Component, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/views/code.js b/js/document/views/code.js
new file mode 100755
index 00000000..cd3e02d4
--- /dev/null
+++ b/js/document/views/code.js
@@ -0,0 +1,25 @@
+/* <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,
+	Component = 		require("montage/ui/component").Component,
+	BaseDocumentView = 	require("js/document/views/base").BaseDocumentView;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.CodeDocumentView = Montage.create(BaseDocumentView, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/views/design.js b/js/document/views/design.js
new file mode 100755
index 00000000..84871257
--- /dev/null
+++ b/js/document/views/design.js
@@ -0,0 +1,25 @@
+/* <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,
+	Component = 		require("montage/ui/component").Component,
+	CodeDocumentView = 	require("js/document/views/code").CodeDocumentView;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.DesignDocumentView = Montage.create(CodeDocumentView, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
-- 
cgit v1.2.3


From bc04ee998de7aaadc457f4e932cc4be8327a2a03 Mon Sep 17 00:00:00 2001
From: Jose Antonio Marquez
Date: Wed, 4 Apr 2012 11:35:12 -0700
Subject: Backup for merge

---
 js/document/controllers/document.js | 21 ++++++++++++++++++++
 js/document/models/base.js          | 38 +++++++++++++++++++++++++++++++++++++
 js/document/models/html.js          |  1 -
 js/document/models/text.js          |  4 ++--
 4 files changed, 61 insertions(+), 3 deletions(-)
 create mode 100755 js/document/models/base.js

diff --git a/js/document/controllers/document.js b/js/document/controllers/document.js
index 45377b76..f7260957 100755
--- a/js/document/controllers/document.js
+++ b/js/document/controllers/document.js
@@ -16,6 +16,27 @@ exports.DocumentController = Montage.create(Component, {
 	hasTemplate: {
 		enumerable: false,
         value: false
+    }
+    ////////////////////////////////////////////////////////////////////
+	//
+	save: {
+        value: function () {
+        	//
+        }
+    },
+    ////////////////////////////////////////////////////////////////////
+	//
+	saveAs: {
+        value: function () {
+        	//
+        }
+    },
+    ////////////////////////////////////////////////////////////////////
+	//
+	close: {
+        value: function () {
+        	//
+        }
     }
 	////////////////////////////////////////////////////////////////////
 	////////////////////////////////////////////////////////////////////
diff --git a/js/document/models/base.js b/js/document/models/base.js
new file mode 100755
index 00000000..96156e64
--- /dev/null
+++ b/js/document/models/base.js
@@ -0,0 +1,38 @@
+/* <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;
+////////////////////////////////////////////////////////////////////////
+//	
+exports.BaseDocumentModel = Montage.create(Montage, {
+	////////////////////////////////////////////////////////////////////
+	//
+	hasTemplate: {
+		enumerable: false,
+        value: false
+    },
+    ////////////////////////////////////////////////////////////////////
+	//
+	file: {
+        value: null
+    },
+    ////////////////////////////////////////////////////////////////////
+	//
+	njdata: {
+        value: null
+    },
+    ////////////////////////////////////////////////////////////////////
+	//
+	views: {
+        value: null
+    }
+	////////////////////////////////////////////////////////////////////
+	////////////////////////////////////////////////////////////////////
+});
+////////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/document/models/html.js b/js/document/models/html.js
index 0ac09f3b..5882d389 100755
--- a/js/document/models/html.js
+++ b/js/document/models/html.js
@@ -7,7 +7,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 ////////////////////////////////////////////////////////////////////////
 //
 var Montage = 			require("montage/core/core").Montage,
-	Component = 		require("montage/ui/component").Component,
 	TextDocumentModel = require("js/document/models/text").TextDocumentModel;
 ////////////////////////////////////////////////////////////////////////
 //	
diff --git a/js/document/models/text.js b/js/document/models/text.js
index c8fba911..ebf9993e 100755
--- a/js/document/models/text.js
+++ b/js/document/models/text.js
@@ -7,10 +7,10 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 ////////////////////////////////////////////////////////////////////////
 //
 var Montage = 	require("montage/core/core").Montage,
-	Component = require("montage/ui/component").Component;
+	BaseDocumentModel = require("js/document/models/text").BaseDocumentModel;
 ////////////////////////////////////////////////////////////////////////
 //	
-exports.TextDocumentModel = Montage.create(Component, {
+exports.TextDocumentModel = Montage.create(BaseDocumentModel, {
 	////////////////////////////////////////////////////////////////////
 	//
 	hasTemplate: {
-- 
cgit v1.2.3


From c58dc96130c7eb5d964af53e9ad6e80bba5e647f Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Wed, 18 Apr 2012 17:24:40 -0700
Subject: initial stage web template

Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
 .../layout/bread-crumb.reel/bread-crumb.js         |   4 +-
 js/controllers/document-controller.js              |  30 ++-
 js/data/menu-data.js                               |  61 +++---
 js/document/html-document.js                       | 222 ++++++++++++++++++++-
 js/document/templates/montage-web/default_html.css |  30 +++
 js/document/templates/montage-web/index.html       |  41 ++++
 .../templates/montage-web/main.reel/main.js        |  48 +++++
 js/document/templates/montage-web/package.json     |   8 +
 js/panels/properties.reel/properties.js            |   1 +
 js/stage/stage.reel/stage.js                       |   2 +-
 10 files changed, 409 insertions(+), 38 deletions(-)
 create mode 100755 js/document/templates/montage-web/default_html.css
 create mode 100755 js/document/templates/montage-web/index.html
 create mode 100644 js/document/templates/montage-web/main.reel/main.js
 create mode 100755 js/document/templates/montage-web/package.json

diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.js b/js/components/layout/bread-crumb.reel/bread-crumb.js
index f35972b6..45a4d217 100755
--- a/js/components/layout/bread-crumb.reel/bread-crumb.js
+++ b/js/components/layout/bread-crumb.reel/bread-crumb.js
@@ -58,7 +58,7 @@ exports.Breadcrumb = Montage.create(Component, {
     createContainerElements: {
         value: function() {
             var parentNode;
-
+/*
             this.containerElements.length = 0;
 
             parentNode = this.container;
@@ -70,7 +70,7 @@ exports.Breadcrumb = Montage.create(Component, {
 
             // This is always the top container which is now hardcoded to body
             this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": "Body"});
-
+*/
 
 
         }
diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index ddaeb061..e56c3e31 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -10,8 +10,7 @@ var Montage = 		require("montage/core/core").Montage,
     Component = 	require("montage/ui/component").Component,
     Uuid = 			require("montage/core/uuid").Uuid,
     HTMLDocument =	require("js/document/html-document").HTMLDocument,
-    TextDocument =	require("js/document/text-document").TextDocument,
-    DocumentController;
+    TextDocument =	require("js/document/text-document").TextDocument;
 ////////////////////////////////////////////////////////////////////////
 //
 var DocumentController = exports.DocumentController = Montage.create(Component, {
@@ -19,6 +18,10 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
         value: false
     },
 
+    webTemplate: {
+        value: false
+    },
+
     _documents: {
         value: []
     },
@@ -65,6 +68,10 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
             this.eventManager.addEventListener("styleSheetDirty", this, false);
             
             this.eventManager.addEventListener("addComponentFirstDraw", this, false);
+
+            // Temporary add listeners for the new stage templates
+            this.eventManager.addEventListener("executeWebpageOpen", this, false);
+            this.eventManager.addEventListener("executeNewWebpage", this, false);
         }
     },
     
@@ -130,6 +137,20 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
         }
     },
 
+    handleExecuteWebpageOpen: {
+        value: function(event) {
+            this.webTemplate = true;
+            this.handleExecuteFileOpen(event);
+        }
+    },
+
+    handleExecuteNewWebpage: {
+        value: function(event) {
+            this.webTemplate = true;
+            this.handleExecuteNewFile(event);
+        }
+    },
+
     handleExecuteNewFile: {
             value: function(event) {
                 var newFileSettings = event._event.settings || {};
@@ -235,7 +256,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
                 this.creatingNewFile = true;//flag for timeline to identify new file flow
 
                 this.application.ninja.ioMediator.fileOpen(response.uri, this.openFileCallback.bind(this));
-            }else if(!!response && !response.success){
+            } else if(!!response && !response.success){
                 //Todo: restrict directory path to the sandbox, in the dialog itself
                 alert("Unable to create file.\n [Error: Forbidden directory]");
             }
@@ -313,7 +334,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
 			switch (doc.extension) {
 				case 'html': case 'html':
 					//Open in designer view
-					Montage.create(HTMLDocument).initialize(doc, Uuid.generate(), this._createIframeElement(), this._onOpenDocument.bind(this));
+					Montage.create(HTMLDocument).initialize(doc, Uuid.generate(), this._createIframeElement(), this._onOpenDocument.bind(this), this.webTemplate);
 					break;
 				default:
 					//Open in code view
@@ -420,6 +441,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
     // Event Detail: Contains the current ActiveDocument
     _onOpenDocument: {
         value: function(doc){
+            this.webTemplate = false;
             this.application.ninja.currentDocument = doc;
             this._hideCurrentDocument();
             this.application.ninja.stage.stageView.hideOtherDocuments(doc.uuid);
diff --git a/js/data/menu-data.js b/js/data/menu-data.js
index a1fe2703..9e8bf945 100755
--- a/js/data/menu-data.js
+++ b/js/data/menu-data.js
@@ -39,8 +39,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if(activeDocument !== null){return true;}
-                                    else{return false;}
+                                    return activeDocument !== null;
                                 }
                             },
                             "action": "executeFileClose"
@@ -54,8 +53,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if(activeDocument !== null){return true;}
-                                    else{return false;}
+                                    return activeDocument !== null;
                                 }
                             },
                             "action": "executeFileCloseAll"
@@ -73,8 +71,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if(activeDocument !== null){return true;}
-                                    else{return false;}
+                                    return activeDocument !== null;
                                 }
                             },
                             "action": "executeSave"
@@ -87,9 +84,8 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundObj": "documentController",
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
-                                "boundValueMutator": function(activeDocument){
-                                    if(activeDocument !== null){return true;}
-                                    else{return false;}
+                                "boundValueMutator": function(activeDocument) {
+                                    return activeDocument !== null;
                                 }
                             },
                             "action":"executeSaveAs"
@@ -103,8 +99,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if(activeDocument !== null){return true;}
-                                    else{return false;}
+                                    return activeDocument !== null;
                                 }
                             },
                             "action": "executeSaveAll"
@@ -127,6 +122,26 @@ exports.MenuData = Montage.create( Montage, {
                             "displayText" : "Close Project",
                             "hasSubMenu" : false,
                             "enabled": false
+                        },
+                        {
+                            "displayText" : "",
+                            "separator":    true
+                        },
+                        {
+                            "displayText" : "",
+                            "separator":    true
+                        },
+                        {
+                            "displayText" : "New Webpage",
+                            "hasSubMenu" : false,
+                            "enabled": true,
+                            "action":   "executeNewWebpage"
+                        },
+                        {
+                            "displayText" : "Open Webpage",
+                            "hasSubMenu" : false,
+                            "enabled": true,
+                            "action": "executeWebpageOpen"
                         }
                     ]
                 },
@@ -184,8 +199,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "checked": {
@@ -202,8 +216,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "checked": {
@@ -220,8 +233,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "submenu": true,
@@ -267,8 +279,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "checked": {
@@ -326,8 +337,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "checked": {
@@ -348,8 +358,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "radio": true,
@@ -367,8 +376,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "radio": true,
@@ -386,8 +394,7 @@ exports.MenuData = Montage.create( Montage, {
                                 "boundProperty": "activeDocument",
                                 "oneway": true,
                                 "boundValueMutator": function(activeDocument){
-                                    if((activeDocument !== null) && (activeDocument.currentView === "design")){return true;}
-                                    else{return false;}
+                                    return (activeDocument !== null) && (activeDocument.currentView === "design");
                                 }
                             },
                             "radio": true,
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 2531465d..b79281e4 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -17,6 +17,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
     
     _selectionExclude: { value: null, enumerable: false },
     _htmlTemplateUrl: { value: "js/document/templates/montage-html/index.html", enumerable: false},
+    _webTemplateUrl: { value: "js/document/templates/montage-web/index.html", enumerable: false},
     _iframe: { value: null, enumerable: false },
     _server: { value: null, enumerable: false },
     _templateDocument: { value: null, enumerable: false },
@@ -393,7 +394,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
     ////////////////////////////////////////////////////////////////////
 	//
     initialize: {
-		value: function(file, uuid, iframe, callback) {
+		value: function(file, uuid, iframe, callback, webTemplate) {
 			this.application.ninja.documentController._hackRootFlag = false;
 			//
 			this._userDocument = file;
@@ -404,8 +405,13 @@ exports.HTMLDocument = Montage.create(TextDocument, {
             this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"];
             this.currentView = "design";
 			//
-			this.iframe.src = this._htmlTemplateUrl;
-            this.iframe.addEventListener("load", this, true);
+            if(webTemplate) {
+                this.iframe.src = this._webTemplateUrl;
+                this.iframe.addEventListener("load", this.handleWebTemplateLoad.bind(this), true);
+            } else {
+                this.iframe.src = this._htmlTemplateUrl;
+                this.iframe.addEventListener("load", this, true);
+            }
         }
     },
     ////////////////////////////////////////////////////////////////////
@@ -528,7 +534,215 @@ exports.HTMLDocument = Montage.create(TextDocument, {
   		value: 0
   	},
 */
-  	
+    handleWebTemplateLoad: {
+        value: function(event) {
+            //TODO: Clean up, using for prototyping save
+            this._templateDocument = {};
+            this._templateDocument.html = this.iframe.contentWindow.document;
+//            this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead");
+            this._templateDocument.body = this.documentRoot = this.iframe.contentWindow.document.body;
+            //TODO: Remove, also for prototyping
+            this.application.ninja.documentController._hackRootFlag = true;
+            //
+//            this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG");
+            this._document = this.iframe.contentWindow.document;
+            this._window = this.iframe.contentWindow;
+
+            for (var k in this._document.styleSheets) {
+                if (this._document.styleSheets[k].ownerNode && this._document.styleSheets[k].ownerNode.setAttribute) {
+                    this._document.styleSheets[k].ownerNode.setAttribute('data-ninja-template', 'true');
+                }
+            }
+
+            //Adding a handler for the main user document reel to finish loading
+            this._document.body.addEventListener("userTemplateDidLoad",  this.userTemplateDidLoad.bind(this), false);
+
+            // Live node list of the current loaded document
+            this._liveNodeList = this.documentRoot.getElementsByTagName('*');
+
+            // TODO Move this to the appropriate location
+            var len = this._liveNodeList.length;
+
+            for(var i = 0; i < len; i++) {
+                NJUtils.makeModelFromElement(this._liveNodeList[i]);
+            }
+
+            setTimeout(function () {
+
+                ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+                ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+                ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+                if(this._document.styleSheets.length) {
+                    //Checking all styleSheets in document
+                    for (var i in this._document.styleSheets) {
+                        //If rules are null, assuming cross-origin issue
+                        if(this._document.styleSheets[i].rules === null) {
+                            //TODO: Revisit URLs and URI creation logic, very hack right now
+                            var fileUri, cssUrl, cssData, query, prefixUrl, fileCouldDirUrl, docRootUrl;
+                            //
+                            docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
+                            //TODO: Parse out relative URLs and map them to absolute
+                            if (this._document.styleSheets[i].href.indexOf(this.application.ninja.coreIoApi.rootUrl) !== -1) {
+                                //
+                                cssUrl = this._document.styleSheets[i].href.split(this.application.ninja.coreIoApi.rootUrl)[1];
+                                fileUri = this.application.ninja.coreIoApi.cloudData.root+cssUrl;
+                                //TODO: Add error handling for reading file
+                                cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri});
+                                //
+                                var tag = this.iframe.contentWindow.document.createElement('style');
+                                tag.setAttribute('type', 'text/css');
+                                tag.setAttribute('data-ninja-uri', fileUri);
+                                tag.setAttribute('data-ninja-file-url', cssUrl);
+                                tag.setAttribute('data-ninja-file-read-only', JSON.parse(this.application.ninja.coreIoApi.isFileWritable({uri: fileUri}).content).readOnly);
+                                tag.setAttribute('data-ninja-file-name', cssUrl.split('/')[cssUrl.split('/').length-1]);
+                                //Copying attributes to maintain same properties as the <link>
+                                for (var n in this._document.styleSheets[i].ownerNode.attributes) {
+                                    if (this._document.styleSheets[i].ownerNode.attributes[n].value && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled' && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled') {
+                                        if (this._document.styleSheets[i].ownerNode.attributes[n].value.indexOf(docRootUrl) !== -1) {
+                                            tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value.split(docRootUrl)[1]);
+                                        } else {
+                                            tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value);
+                                        }
+                                    }
+                                }
+                                //
+                                fileCouldDirUrl = this._document.styleSheets[i].href.split(this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1])[0];
+
+                                //TODO: Make public version of this.application.ninja.ioMediator.getNinjaPropUrlRedirect with dynamic ROOT
+                                tag.innerHTML = cssData.content.replace(/url\(()(.+?)\1\)/g, detectUrl);
+
+                                function detectUrl (prop) {
+                                    return prop.replace(/[^()\\""\\'']+/g, prefixUrl);;
+                                }
+
+                                function prefixUrl (url) {
+                                    if (url !== 'url') {
+                                        if (!url.match(/(\b(?:(?:https?|ftp|file|[A-Za-z]+):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$]))/gi)) {
+                                            url = fileCouldDirUrl+url;
+                                        }
+                                    }
+                                    return url;
+                                }
+
+                                //Looping through DOM to insert style tag at location of link element
+                                query = this._templateDocument.html.querySelectorAll(['link']);
+                                for (var j in query) {
+                                    if (query[j].href === this._document.styleSheets[i].href) {
+                                        //Disabling style sheet to reload via inserting in style tag
+                                        query[j].setAttribute('disabled', 'true');
+                                        //Inserting tag
+                                        this._templateDocument.head.insertBefore(tag, query[j]);
+                                    }
+                                }
+                            } else {
+                                console.log('ERROR: Cross-Domain-Stylesheet detected, unable to load in Ninja');
+                                //None local stylesheet, probably on a CDN (locked)
+                                var tag = this.iframe.contentWindow.document.createElement('style');
+                                tag.setAttribute('type', 'text/css');
+                                tag.setAttribute('data-ninja-external-url', this._document.styleSheets[i].href);
+                                tag.setAttribute('data-ninja-file-read-only', "true");
+                                tag.setAttribute('data-ninja-file-name', this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1]);
+                                //Copying attributes to maintain same properties as the <link>
+                                for (var n in this._document.styleSheets[i].ownerNode.attributes) {
+                                    if (this._document.styleSheets[i].ownerNode.attributes[n].value && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled' && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled') {
+                                        if (this._document.styleSheets[i].ownerNode.attributes[n].value.indexOf(docRootUrl) !== -1) {
+                                            tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value.split(docRootUrl)[1]);
+                                        } else {
+                                            tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value);
+                                        }
+                                    }
+                                }
+                                /*
+
+                                //TODO: Figure out cross-domain XHR issue, might need cloud to handle
+                                var xhr = new XMLHttpRequest();
+                                xhr.open("GET", this._document.styleSheets[i].href, true);
+                                xhr.send();
+                                //
+                                if (xhr.readyState === 4) {
+                                    console.log(xhr);
+                                }
+                                //tag.innerHTML = xhr.responseText //xhr.response;
+                                */
+                                //Temp rule so it's registered in the array
+                                tag.innerHTML = 'noRULEjustHACK{background: #000}';
+                                //Disabling external style sheets
+                                query = this._templateDocument.html.querySelectorAll(['link']);
+                                for (var k in query) {
+                                    if (query[k].href === this._document.styleSheets[i].href) {
+
+                                        //TODO: Removed the temp insertion of the stylesheet
+                                        //because it wasn't the proper way to do it
+                                        //need to be handled via XHR with proxy in Cloud Sim
+
+                                        //Disabling style sheet to reload via inserting in style tag
+                                        //var tempCSS = query[k].cloneNode(true);
+                                        //tempCSS.setAttribute('data-ninja-template', 'true');
+                                        query[k].setAttribute('disabled', 'true');
+                                        //this.iframe.contentWindow.document.head.appendChild(tempCSS);
+                                        //Inserting tag
+                                        this._templateDocument.head.insertBefore(tag, query[k]);
+                                    }
+                                }
+                            }
+                        }
+                    }
+                    ////////////////////////////////////////////////////////////////////////////
+                    ////////////////////////////////////////////////////////////////////////////
+
+                    //TODO: Check if this is needed
+                    this._stylesheets = this._document.styleSheets;
+
+                    ////////////////////////////////////////////////////////////////////////////
+                    ////////////////////////////////////////////////////////////////////////////
+
+                    //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");
+
+
+
+                    for(i = 0; i < this._stylesheets.length; i++) {
+                        if(this._stylesheets[i].ownerNode.id === this._stageStyleSheetId) {
+                            this.documentRoot.elementModel.defaultRule = this._stylesheets[i];
+                            break;
+                        }
+                    }
+
+                    //Temporary create properties for each rule we need to save the index of the rule
+                    var len = this.documentRoot.elementModel.defaultRule.cssRules.length;
+                    for(var j = 0; j < len; j++) {
+                        //console.log(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText);
+                        if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "*") {
+
+                            this.documentRoot.elementModel.transitionStopRule = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+                        } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "body") {
+
+                            this.documentRoot.elementModel.body = this.documentRoot.elementModel.defaultRule.cssRules[j];
+
+                        }
+                    }
+
+                    this.callback(this);
+
+                    //Setting webGL data
+                    if (this._templateDocument.webgl) {
+                        this.glData = this._templateDocument.webgl;
+                    }
+                }
+                ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+                ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+                ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
+
+
+
+
+            }.bind(this), 1000);
+        }
+    },
   	
 	////////////////////////////////////////////////////////////////////
 	//
diff --git a/js/document/templates/montage-web/default_html.css b/js/document/templates/montage-web/default_html.css
new file mode 100755
index 00000000..05165898
--- /dev/null
+++ b/js/document/templates/montage-web/default_html.css
@@ -0,0 +1,30 @@
+/* <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> */
+
+* {
+    -webkit-transition-duration: 0s !important;
+    -webkit-animation-duration: 0s !important;
+    -webkit-animation-name: none !important;
+}
+
+html{
+    /*overflow:hidden;*/
+}
+
+body
+{
+    width: 100%;
+    height: 100%;
+	background: pink;
+}
+
+.active-element-outline {
+  outline: #adff2f solid 2px;
+}
+
+.nj-preset-transition {
+    -webkit-transition: all 450ms linear !important;
+}
\ No newline at end of file
diff --git a/js/document/templates/montage-web/index.html b/js/document/templates/montage-web/index.html
new file mode 100755
index 00000000..60946aac
--- /dev/null
+++ b/js/document/templates/montage-web/index.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<!-- <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> -->
+ 
+<html>
+
+	<head>
+	
+		<title>Ninja Prototype</title>
+
+        <link href="default_html.css" id="nj-stage-stylesheet" rel="stylesheet" type="text/css" media="screen"/>
+    
+    	<script type="text/javascript" data-package="." src="../../../../node_modules/montage/montage.js"></script>
+    
+    	<script type="text/javascript">
+      		function getElement(x,y) {
+            	return document.elementFromPoint(x,y);
+        	}
+    	</script>
+
+        <script type="text/montage-serialization">
+        {
+            "owner": {
+                "module": "main.reel",
+                "name": "Main"
+            }
+        }
+        </script>
+
+	</head>
+
+	<body>
+		
+		<!--<ninja-div id="userHead"></ninja-div>-->
+
+	</body>
+
+</html>
\ No newline at end of file
diff --git a/js/document/templates/montage-web/main.reel/main.js b/js/document/templates/montage-web/main.reel/main.js
new file mode 100644
index 00000000..019c675e
--- /dev/null
+++ b/js/document/templates/montage-web/main.reel/main.js
@@ -0,0 +1,48 @@
+/* <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,
+    Component = require("montage/ui/component").Component;
+
+exports.Main = Montage.create(Component, {
+
+    hasTemplate: {
+        value: false
+    },
+
+    /**
+     * Adding window hooks to callback into this object from Ninja.
+     */
+    templateDidLoad: {
+        value: function(){
+            var self = this;
+            window.addComponent = function(element, data, callback) {
+                var component;
+
+                component = require.async(data.path)
+                    .then(function(component) {
+                        var componentRequire = component[data.name];
+                        var componentInstance = componentRequire.create();
+
+                        componentInstance.element = element;
+
+                        componentInstance.needsDraw = true;
+                        componentInstance.ownerComponent = self;
+
+                        callback(componentInstance, element);
+                    })
+                    .end();
+
+            };
+
+            // Dispatch event when this template has loaded.
+            var newEvent = document.createEvent( "CustomEvent" );
+            newEvent.initCustomEvent( "userTemplateDidLoad", false, true );
+
+            document.body.dispatchEvent( newEvent );
+
+        }
+    }
+});
\ No newline at end of file
diff --git a/js/document/templates/montage-web/package.json b/js/document/templates/montage-web/package.json
new file mode 100755
index 00000000..c8bc02fb
--- /dev/null
+++ b/js/document/templates/montage-web/package.json
@@ -0,0 +1,8 @@
+{
+       "directories": {
+           "lib": ""
+       },
+       "mappings": {
+           "montage": "../../../../node_modules/montage/"
+       }
+}
\ No newline at end of file
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js
index d9dca538..7fab1eb0 100755
--- a/js/panels/properties.reel/properties.js
+++ b/js/panels/properties.reel/properties.js
@@ -187,6 +187,7 @@ exports.Properties = Montage.create(Component, {
 
     displayStageProperties: {
         value: function() {
+            /*
             var stage = this.application.ninja.currentDocument.documentRoot;
             //this is test code please remove
             this.elementName.value = "Stage";
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index ec8c0e55..567bc333 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -252,7 +252,7 @@ exports.Stage = Montage.create(Component, {
             this.application.ninja.currentDocument.savedLeftScroll = this._iframeContainer.scrollLeft;
             this.application.ninja.currentDocument.savedTopScroll = this._iframeContainer.scrollTop;
 
-            this.userContentBorder = parseInt(this._documentRoot.elementModel.controller.getProperty(this._documentRoot, "border"));
+            this.userContentBorder = 0;//parseInt(this._documentRoot.elementModel.controller.getProperty(this._documentRoot, "border"));
 
             this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder;
             this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder;
-- 
cgit v1.2.3


From e085f15bcef9f84d9a8d39e4b2a1fe2ee73c3f29 Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Thu, 19 Apr 2012 14:20:17 -0700
Subject: typo fix

Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
 js/controllers/document-controller.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index e56c3e31..1fcdf6d0 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -332,7 +332,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
 			this.documentHackReference = doc;
 			//
 			switch (doc.extension) {
-				case 'html': case 'html':
+				case 'html':
 					//Open in designer view
 					Montage.create(HTMLDocument).initialize(doc, Uuid.generate(), this._createIframeElement(), this._onOpenDocument.bind(this), this.webTemplate);
 					break;
-- 
cgit v1.2.3


From c62273126004f057de40ce91ecda5606643f4c92 Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Fri, 20 Apr 2012 16:37:47 -0700
Subject: reverting old template to current working status. New template work.

Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
 .../layout/bread-crumb.reel/bread-crumb.js         |   4 +-
 js/controllers/document-controller.js              |  38 ++-
 js/document/controllers/document.js                |   2 +-
 js/document/document-html.js                       | 304 ++++++++++++++++++++-
 js/document/html-document.js                       | 223 +--------------
 js/document/models/base.js                         |   4 +
 js/document/models/html.js                         |   4 +-
 js/document/templates/montage-web/default_html.css |  11 -
 js/document/templates/montage