24 files changed, 383 insertions, 334 deletions

diff --git a/css/ninja.css b/css/ninja.css
index 8ce60a10..0eecf33b 100755
--- a/css/ninja.css
+++ b/css/ninja.css
@@ -74,7 +74,7 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #appWorkspace { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; -webkit-box-sizing: stretch; position: relative; padding: 2px 0px; border: 1px solid #333; overflow: hidden; }
 
-#topMenu { background-color: #474747; position: absolute; height: 28px; width: 100%; top: 0px; left: 0px; z-index: 9999; }
+#topMenu { background-color: #474747; position: absolute; height: 28px; width: 100%; top: 0px; left: 0px; z-index: 6995; }
 
 #topPanelContainer, #leftPanelContainer, #rightPanelContainer, #bottomPanelContainer { background-color: #282828; }
 
diff --git a/js/components/layout/document-entry.reel/document-entry.js b/js/components/layout/document-entry.reel/document-entry.js
index 1431e76f..2a33548a 100755
--- a/js/components/layout/document-entry.reel/document-entry.js
+++ b/js/components/layout/document-entry.reel/document-entry.js
@@ -101,7 +101,7 @@ exports.DocumentEntry = Montage.create(Component, {
                 this.application.ninja.documentController.closeDocument(this._uuid);
             } else {
                 if(!this._document.isActive) {
-                    this.application.ninja.stage.stageView.switchCodeView(this.application.ninja.documentController._findDocumentByUUID(this._uuid));
+                    this.application.ninja.stage.stageView.switchDocument(this.application.ninja.documentController._findDocumentByUUID(this._uuid));
                 }
             }
         }
diff --git a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html
index b5da0e6e..bd427f97 100755
--- a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html
+++ b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html
@@ -10,36 +10,6 @@
     <link rel="stylesheet" type="text/css" href="pickerNavigator.css">
     <script type="text/montage-serialization">
         {
-            "okButton": {
-                "module": "montage/ui/button.reel",
-                "name": "Button",
-                "properties": {
-                    "element": {"#": "okButton"},
-                    "identifier": "okButton"
-                },
-                "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
-                ]
-            },
-
-            "cancelButton": {
-                "module": "montage/ui/button.reel",
-                "name": "Button",
-                "properties": {
-                    "element": {"#": "cancelButton"},
-                    "identifier": "cancelButton"
-                },
-                "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
-                ]
-            },
-
             "owner":{
                 "module": "js/components/ui/FilePicker/pickerNavigator.reel",
                 "name":"PickerNavigator",
diff --git a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js
index 268ec41a..d7a19c14 100644
--- a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js
+++ b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.js
@@ -245,6 +245,9 @@ var PickerNavigator = exports.PickerNavigator = Montage.create(Component, {
             this.resultsArea.addEventListener("click", function(evt){that.handleResultsAreaClick(evt);}, false);
             this.element.addEventListener("click", function(evt){that.handlePickerNavClick(evt);}, false);
 
+            this.okButton.addEventListener("click", function(evt){that.handleOkButtonAction(evt);}, false);
+            this.cancelButton.addEventListener("click", function(evt){that.handleCancelButtonAction(evt);}, false);
+
             //ready to show picker now
             this.element.style.visibility = "visible";
         }
diff --git a/js/io/document/base-document.js b/js/io/document/base-document.js
index d3601de5..ecc92447 100755
--- a/js/io/document/base-document.js
+++ b/js/io/document/base-document.js
@@ -87,7 +87,12 @@ var BaseDocument = exports.BaseDocument = Montage.create(Montage, {
         value: function() {
             // Have the XHR here?
         }
-    }
+    },
 
+    save:{
+        value:function(){
+            //base function - to be overridden
+        }
+    }
 
 });
\ No newline at end of file
diff --git a/js/io/document/document-controller.js b/js/io/document/document-controller.js
index d7a19e35..ca6b4533 100755
--- a/js/io/document/document-controller.js
+++ b/js/io/document/document-controller.js
@@ -15,7 +15,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,
     Uuid = require("montage/core/uuid").Uuid,
-    //nj= ("js/lib/NJUtils.js").NJUtils,
     HTMLDocument = require("js/io/document/html-document").HTMLDocument,
     TextDocument = require("js/io/document/text-document").TextDocument;
 
@@ -71,8 +70,8 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
     deserializedFromTemplate: {
         value: function() {
             this.eventManager.addEventListener("appLoaded", this, false);
-
             this.eventManager.addEventListener("executeFileOpen", this, false);
+            this.eventManager.addEventListener("executeNewFile", this, false);
         }
     },
 
@@ -93,6 +92,46 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
         }
     },
 
+    handleExecuteNewFile: {
+            value: function(event) {
+                var newFileSettings = event._event.settings || {};
+                newFileSettings.callback = this.createNewFile;
+                newFileSettings.callbackScope = this;
+                this.application.ninja.newFileController.showNewFileDialog(newFileSettings);
+            }
+    },
+
+    createNewFile:{
+        value:function(newFileObj){
+            //console.log(newFileObj);//contains the template uri and the new file uri
+            if(!newFileObj) return;
+            this.application.ninja.ioMediator.fileNew(newFileObj.newFilePath, newFileObj.fileTemplateUri, {"operation":this.openNewFileCallback, "thisScope":this});
+
+            if((newFileObj.fileExtension !== ".html") && (newFileObj.fileExtension !== ".htm")){//open code view
+
+            }else{
+                //open design view
+            }
+        }
+    },
+
+    /**
+     * Public method
+     * doc contains:
+     *      type : file type, like js, css, etc
+     *      name : file name
+     *      source : file content
+     *      uri : file uri
+     */
+    openNewFileCallback:{
+        value:function(doc){
+            if(!doc){
+                doc = {"type": "js", "name": "filename", "source": "test file content", "uri": "/fs/fsd/"}  ;
+            }
+            this.openDocument(doc);
+        }
+    },
+
     openFileWithURI: {
         value: function(uriArrayObj) {
             var uri = "", fileContent = "", response=null, filename="", fileType="js";
@@ -101,20 +140,21 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
             }
             //console.log("URI is: ", uri);