11 files changed, 365 insertions, 259 deletions

diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.js b/js/components/layout/bread-crumb.reel/bread-crumb.js
index 45a4d217..f35972b6 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 1fcdf6d0..a7aa0de6 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -11,6 +11,9 @@ var Montage = 		require("montage/core/core").Montage,
     Uuid =                      require("montage/core/uuid").Uuid,
     HTMLDocument =      require("js/document/html-document").HTMLDocument,
     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, {
@@ -289,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)){
@@ -334,7 +342,31 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
                         switch (doc.extension) {
                                 case 'html':
                                         //Open in designer view
-                                        Montage.create(HTMLDocument).initialize(doc, Uuid.generate(), this._createIframeElement(), this._onOpenDocument.bind(this), this.webTemplate);
+                                        Montage.create(HTMLDocument).initialize(doc, Uuid.generate(), this._createIframeElement(), this._onOpenDocument.bind(this));
+                                        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;
+                        }
+        }
+    },
+    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
@@ -453,8 +485,6 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
             this._showCurrentDocument();
 
             NJevent("onOpenDocument", doc);
-//            appDelegateModule.MyAppDelegate.onSetActiveDocument();
-
         }
     },
 
diff --git a/js/document/controllers/document.js b/js/document/controllers/document.js
index f7260957..feba3e0e 100755
--- a/js/document/controllers/document.js
+++ b/js/document/controllers/document.js
@@ -16,7 +16,7 @@ exports.DocumentController = Montage.create(Component, {
         hasTemplate: {
                 enumerable: false,
         value: false
-    }
+    },
     ////////////////////////////////////////////////////////////////////
         //
         save: {
diff --git a/js/document/document-html.js b/js/document/document-html.js
index b48e004a..841e66ed 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -6,8 +6,9 @@ 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;
+var Montage =           require("montage/core/core").Montage,
+        Component =         require("montage/ui/component").Component;
+    HtmlDocumentModel = require("js/document/models/html").HtmlDocumentModel;
 ////////////////////////////////////////////////////////////////////////
 //      
 exports.HtmlDocument = Montage.create(Component, {
@@ -16,9 +17,306 @@ exports.HtmlDocument = Montage.create(Component, {
         hasTemplate: {
                 enumerable: false,
         value: false
-    }
+    },
+
+    model: {
+        value: null
+    },
+
+    loadDelegate: {
+        value: null
+    },
+
+    delegateContext: {
+        value: null
+    },
+
+    // Getters for the model.
+    // TODO: Change how these properties are accessed through Ninja
+    name: {
+        get: function() {
+            return this.model._name;
+        },
+        set: function(value) {
+            this.model._name = value;
+        }
+    },
+
+    // View Properties
+    // TODO: Move those into a view object - for now dump it here
+    iframe: {
+        value: null
+    },
+
+    uuid: {
+        get: function() {
+            return this._uuid;
+        }
+    },
         ////////////////////////////////////////////////////////////////////
         ////////////////////////////////////////////////////////////////////
+    init: {
+        value:function(file, context, callback) {
+            this.model = Montage.create(HtmlDocumentModel, {
+                file: {
+                    value: file
+                }
+            });
+
+            this.name = file.name;
+
+            // this.init(file.name, file.uri, file.extension, iframe, uuid, callback);
+
+            this.iframe = this.createView();
+            this.iframe.addEventListener("load", this.handleWebTemplateLoad.bind(this), true);
+
+            //this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"];
+            //this.currentView = "design";
+            //
+
+            this.delegateContext = context;
+            this.loadDelegate = callback;
+        }
+    },
+
+    // Create View
+    // Move this into a base view object
+    createView: {
+        value: function() {
+            var ifr = document.createElement("iframe");
+            ifr.id = "document_" + this._uuid;
+
+
+            ifr.style.border = "none";
+            ifr.style.background = "#FFF";
+            ifr.style.height = "100%";
+            ifr.style.width = "100%";
+
+            // TODO: Reable opacity to display only when done loading
+//            ifr.style.opacity = 0;
+