5 files changed, 165 insertions, 151 deletions

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,
 
             this.activeDocument = doc;
 
-            this._showCurrentDocument();
+            if(!this.webTemplate) {
+                this._showCurrentDocument();
+            }
+
+            this.webTemplate = false;
 
             NJevent("onOpenDocument", doc);
-//            appDelegateModule.MyAppDelegate.onSetActiveDocument();
-
         }
     },
 
@@ -526,7 +581,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
                     this.application.ninja.stage.stageView.showRulers();
                 }else{
                     //hide the iframe when switching to code view
-                    document.getElementById("iframeContainer").style.display="none";
+                    document.getElementById("iframeContainer").style.display = "none";
                 }
         }
         }
diff --git a/js/controllers/elements/canvas-controller.js b/js/controllers/elements/canvas-controller.js
index b5df3911..b8894c18 100755
--- a/js/controllers/elements/canvas-controller.js
+++ b/js/controllers/elements/canvas-controller.js
@@ -34,12 +34,12 @@ exports.CanvasController = Montage.create(ElementController, {
             }
         }
     },
-        
-   setProperties: {
-       value: function(el, props, index) {
-           for(var p in props) {
-               el.elementModel.controller.setProperty(el, p, props[p][index]);
-           }
-       }
+
+    setProperties: {
+        value: function(element, properties) {
+            for(var property in properties) {
+                this.setProperty(element, property, properties[property]);
+            }
+        }
     }
 });
\ No newline at end of file
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 2ac84452..35a543ac 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -47,10 +47,10 @@ exports.ElementController = Montage.create(Component, {
     },
 
     setProperties: {
-        value: function(el, props, index) {
-            for(var p in props) {
-                this.application.ninja.stylesController.setElementStyle(el, p, props[p][index]);
-            }
+        value: function(element, properties) {
+            for(var property in properties) {
+                this.application.ninja.stylesController.setElementStyle(element, property, properties[property]);
+        }
         }
     },
 
@@ -65,37 +65,29 @@ exports.ElementController = Montage.create(Component, {
     // borderSide : "top", "right", "bottom", or "left"
     getColor: {