22 files changed, 783 insertions, 109 deletions

diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.js b/js/components/layout/bread-crumb.reel/bread-crumb.js
index f35972b6..597577f1 100755
--- a/js/components/layout/bread-crumb.reel/bread-crumb.js
+++ b/js/components/layout/bread-crumb.reel/bread-crumb.js
@@ -63,16 +63,27 @@ exports.Breadcrumb = Montage.create(Component, {
 
             parentNode = this.container;
 
-            while(parentNode.id !== "UserContent") {
+            // This is for the old template support.
+            // TODO: Remove marker for old template: NINJA-STAGE-REWORK
+            if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") {
+                while(parentNode.id !== "UserContent") {
+                    this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName});
+                    parentNode = parentNode.parentNode;
+                }
+
+                // This is always the top container which is now hardcoded to body
+                this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": "Body"});
+            } else {
+                while(parentNode !== this.application.ninja.currentDocument.documentRoot) {
+                    this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName});
+                    parentNode = parentNode.parentNode;
+                }
+
+                // This is always the top container which is now hardcoded to body
                 this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName});
-                parentNode = parentNode.parentNode;
+                console.log("this works!");
             }
 
-            // 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..4be0767a 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -10,8 +10,10 @@ 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;
+
+    // New Document Objects
+var Document =      require("js/document/document-html").HtmlDocument;
 ////////////////////////////////////////////////////////////////////////
 //
 var DocumentController = exports.DocumentController = Montage.create(Component, {
@@ -19,6 +21,10 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
         value: false
     },
 
+    webTemplate: {
+        value: false
+    },
+
     _documents: {
         value: []
     },
@@ -65,6 +71,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 +140,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 +259,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]");
             }
@@ -268,7 +292,12 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
                 this.isNewFilePath = false;//reset path identifier flag
 
                 //Sending full response object
-                this.openDocument(response);   
+                // TODO: Unify those 2 methods. Using if/else for the new template
+                if(this.webTemplate) {
+                    this.openWebDocument(response);
+                } else {
+                    this.openDocument(response);
+                }
             } else if (!!response && (response.status === 404)){
                 alert("Unable to open file.\n [Error: File does not exist]");
             } else if (!!response && (response.status === 500)){
@@ -311,7 +340,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));
                                         break;
@@ -327,6 +356,30 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
                         }
         }
     },
+    openWebDocument: {
+        value: function(doc) {
+            // TODO: HACKS to remove
+                        this.documentHackReference = doc;
+            document.getElementById("iframeContainer").style.overflow = "hidden";
+                        //
+                        switch (doc.extension) {
+                                case 'html':
+                                        //Open in designer view
+                    this._hackRootFlag = false;
+                    Montage.create(Document).init(doc, this, this._onOpenDocument);
+                                        break;
+                                default:
+                                        //Open in code view
+                                        var code = Montage.create(TextDocument, {"source": {value: doc.content}}), docuuid = Uuid.generate(), textArea;
+                                        textArea = this.application.ninja.stage.stageView.createTextAreaElement(docuuid);
+                                        code.initialize(doc, docuuid, textArea, textArea.parentNode);
+                                        //code.init(doc.name, doc.uri, doc.extension, null, docuuid);
+                                        code.textArea.value = doc.content;
+                                        this.application.ninja.stage.stageView.createTextView(code);
+                                        break;
+                        }
+        }
+    },
         ////////////////////////////////////////////////////////////////////
         
         openProjectWithURI: {
@@ -428,11 +481,13 @@ var DocumentController = exports.DocumentController = Montage.create(Component,