From 8504b61aefb25fdab931f02c4568916d2bf8345c Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Thu, 2 Feb 2012 00:52:44 -0800 Subject: changes to open multiple code view tabs and switch between the code views, added nj-skinned css class for the buttons in file picker, new file dialog and save as dialog Signed-off-by: Ananya Sen --- .../layout/documents-tab.reel/documents-tab.js | 4 +- .../pickerNavigator.reel/pickerNavigator.html | 4 +- js/io/document/base-document.js | 13 +++++- js/io/document/document-controller.js | 36 ++++++++------- js/io/document/text-document.js | 4 +- .../new-file-options-navigator.html | 4 +- .../save-as-dialog.reel/save-as-dialog.css | 34 ++++++++++++++ .../save-as-dialog.reel/save-as-dialog.html | 4 +- js/stage/stage-view.reel/stage-view.js | 54 ++++++++++++++++++++-- 9 files changed, 124 insertions(+), 33 deletions(-) (limited to 'js') diff --git a/js/components/layout/documents-tab.reel/documents-tab.js b/js/components/layout/documents-tab.reel/documents-tab.js index e874a73c..982f6ecd 100755 --- a/js/components/layout/documents-tab.reel/documents-tab.js +++ b/js/components/layout/documents-tab.reel/documents-tab.js @@ -7,8 +7,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage; var Component = require("montage/ui/component").Component; -var documentManagerModule = require("js/io/document/document-controller"); - exports.DocumentsTab = Montage.create(Component, { openDocuments: { @@ -19,7 +17,7 @@ exports.DocumentsTab = Montage.create(Component, { enumerable: false, value: function() { // console.log("Change this to be inside the Ninja Reel"); - this.openDocuments = documentManagerModule.DocumentController._documents; + this.openDocuments = this.application.ninja.documentController._documents; // this.eventManager.addEventListener( "appLoaded", this, false); } }, diff --git a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html index b4aee4b2..b5da0e6e 100755 --- a/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html +++ b/js/components/ui/FilePicker/pickerNavigator.reel/pickerNavigator.html @@ -97,8 +97,8 @@
- - + +
diff --git a/js/io/document/base-document.js b/js/io/document/base-document.js index 44f54f78..af96c851 100755 --- a/js/io/document/base-document.js +++ b/js/io/document/base-document.js @@ -12,6 +12,7 @@ var BaseDocument = exports.BaseDocument = Montage.create(Montage, { /** Private Members **/ _name: { value: null, enumerable: false }, _uri: { value: null, enumerable: false }, + _externalUri: {value: null, enumerable:false}, _documentType: { value: null, enumerable: false }, _container: {value: null, enumerable: false }, _uuid: { value: null, enumerable: false }, @@ -31,6 +32,11 @@ var BaseDocument = exports.BaseDocument = Montage.create(Montage, { set: function(value) { this._uri = value; } }, + externalUri: { + get: function() { return this._externalUri; }, + set: function(value) { this._externalUri = value; } + }, + documentType: { get: function() { return this._documentType; }, set: function(value) { this._documentType = value; } @@ -68,13 +74,18 @@ var BaseDocument = exports.BaseDocument = Montage.create(Montage, { /** Base Methods **/ init: { - value: function(name, uri, type, container, uuid, callback) { + value: function(name, uri, type, container, uuid, callback, externalUri) { this.name = name; this.uri = uri; this.documentType = type; this.container = container; this.uuid = uuid; this.callback = callback; + if(!!externalUri){ + this.externalUri = externalUri; + this.container.setAttribute("data-uri", externalUri); + } + } }, diff --git a/js/io/document/document-controller.js b/js/io/document/document-controller.js index bba7e0e7..7fe94c12 100755 --- a/js/io/document/document-controller.js +++ b/js/io/document/document-controller.js @@ -99,9 +99,8 @@ var DocumentController = exports.DocumentController = Montage.create(Component, if(!!uriArrayObj && !!uriArrayObj.uri && (uriArrayObj.uri.length > 0)){ uri = uriArrayObj.uri[0]; } - console.log("URI is: ", uri); + //console.log("URI is: ", uri); - // Get file from Jose Code with a callback to here if(!!uri){ response = this.application.ninja.coreIoApi.openFile({"uri":uri}); if((response.success === true) && ((response.status === 200) || (response.status === 304))){ @@ -113,7 +112,7 @@ var DocumentController = exports.DocumentController = Montage.create(Component, if(uri.indexOf('.') != -1){ fileType = uri.substr(uri.lastIndexOf('.') + 1); } - this.openDocument({"type": ""+fileType, "name": ""+filename, "source": fileContent}); + this.openDocument({"type": ""+fileType, "name": ""+filename, "source": fileContent, "externalUri": uri}); } } @@ -124,7 +123,6 @@ var DocumentController = exports.DocumentController = Montage.create(Component, value: function(uri) { console.log("URI is: ", uri); - // Get project from Jose Code with a callback to here } }, @@ -158,18 +156,6 @@ var DocumentController = exports.DocumentController = Montage.create(Component, } }, - // Document has been loaded into the Iframe. Dispatch the event. - // Event Detail: Contains the current ActiveDocument - _onOpenDocument: { - value: function(doc){ - - DocumentController.activeDocument = doc; - - NJevent("onOpenDocument", doc); - - } - }, - textDocumentOpened: { value: function(doc) { @@ -209,13 +195,31 @@ var DocumentController = exports.DocumentController = Montage.create(Component, closeDocument: { value: function(id) { + + //if file dirty then save + var doc = this._findDocumentByUUID(id); this._removeDocumentView(doc.container); this._documents.splice(this._findIndexByUUID(id), 1); if(this.activeDocument.uuid === id && this._documents.length > 0) { + + var closeDocumentIndex = this._findIndexByUUID(id); + var nextDocumentIndex = -1 ; + if((this._documents.length > 0) && (closeDocumentIndex === 0)){ + nextDocumentIndex = 1; + }else if((this._documents.length > 0) && (closeDocumentIndex > 0)){ + nextDocumentIndex = closeDocumentIndex - 1; + } + + //remove the codemirror div if this is for a code view + /////test + + ////end- test + this.switchDocument(this._documents[0].uuid); + } } }, diff --git a/js/io/document/text-document.js b/js/io/document/text-document.js index 599d311c..a9081cb5 100755 --- a/js/io/document/text-document.js +++ b/js/io/document/text-document.js @@ -45,10 +45,10 @@ var TextDocument = exports.TextDocument = Montage.create(baseDocumentModule.Base // PUBLIC METHODS initialize: { value: function(doc, uuid, textArea, callback) { - this.init(doc.name, doc.uri, doc.type, textArea, uuid); - + this.init(doc.name, doc.uri, doc.type, textArea, uuid, null, doc.externalUri); this.currentView = "code"; this.textArea = textArea; + // this._loadContent(); } }, diff --git a/js/io/workflow/newFileDialog/new-file-options-navigator.reel/new-file-options-navigator.html b/js/io/workflow/newFileDialog/new-file-options-navigator.reel/new-file-options-navigator.html index 36e937e0..dc090b99 100755 --- a/js/io/workflow/newFileDialog/new-file-options-navigator.reel/new-file-options-navigator.html +++ b/js/io/workflow/newFileDialog/new-file-options-navigator.reel/new-file-options-navigator.html @@ -84,8 +84,8 @@
- - + +
diff --git a/js/io/workflow/save-as-dialog.reel/save-as-dialog.css b/js/io/workflow/save-as-dialog.reel/save-as-dialog.css index 7082f485..40434c25 100644 --- a/js/io/workflow/save-as-dialog.reel/save-as-dialog.css +++ b/js/io/workflow/save-as-dialog.reel/save-as-dialog.css @@ -63,4 +63,38 @@ .saveAsDialog .fileInputField{ margin-left:3px; +} + +.saveAsDialog .okButton{ + margin-right:25px; + -webkit-box-align: center; + text-align: center; + cursor: default; + padding: 0px 6px 0px; + border:2px solid #d1d1d1; + background-color: #e1e1e1; + box-sizing: border-box; + border-radius:10px; + background-image: -webkit-linear-gradient(bottom, #e1e1e1 13%, #d1d1d1 58%, #e1e1e1 40%); + cursor:pointer; +} + +.saveAsDialog .cancelButton{ + -webkit-box-align: center; + text-align: center; + cursor: default; + padding: 0px 6px 0px; + border:2px solid #d1d1d1; + background-color: #e1e1e1; + box-sizing: border-box; + border-radius:10px; + background-image: -webkit-linear-gradient(bottom, #e1e1e1 13%, #d1d1d1 58%, #e1e1e1 40%); + cursor:pointer; +} + +.saveAsDialog input[type="button"]:disabled{ + background-color: #a1a1a1; + border:2px solid #a1a1a1; + background-image:none; + cursor:auto; } \ No newline at end of file diff --git a/js/io/workflow/save-as-dialog.reel/save-as-dialog.html b/js/io/workflow/save-as-dialog.reel/save-as-dialog.html index eca6801f..2ce16119 100644 --- a/js/io/workflow/save-as-dialog.reel/save-as-dialog.html +++ b/js/io/workflow/save-as-dialog.reel/save-as-dialog.html @@ -77,8 +77,8 @@
- - + +
diff --git a/js/stage/stage-view.reel/stage-view.js b/js/stage/stage-view.reel/stage-view.js index 727c16eb..c0b0b83e 100755 --- a/js/stage/stage-view.reel/stage-view.js +++ b/js/stage/stage-view.reel/stage-view.js @@ -49,6 +49,8 @@ exports.StageView = Montage.create(Component, { // Temporary function to create a Codemirror text view createTextView: { value: function(doc) { + var documentController = this.application.ninja.documentController; + this.application.ninja.documentController._hideCurrentDocument(); this.application.ninja.currentDocument.container.parentNode.style["display"] = "none"; @@ -79,8 +81,8 @@ exports.StageView = Montage.create(Component, { lineNumbers: true, mode: type, onCursorActivity: function() { - this.application.ninja.documentController._codeEditor.editor.setLineClass(this.application.ninja.documentController._codeEditor.hline, null); - this.application.ninja.documentController._codeEditor.hline = this.application.ninja.documentController._codeEditor.editor.setLineClass(this.application.ninja.documentController._codeEditor.editor.getCursor().line, "activeline"); + //documentController._codeEditor.editor.setLineClass(documentController._codeEditor.hline, null); + //documentController._codeEditor.hline = documentController._codeEditor.editor.setLineClass(documentController._codeEditor.editor.getCursor().line, "activeline"); } }); @@ -93,9 +95,15 @@ exports.StageView = Montage.create(Component, { switchCodeView:{ value: function(doc){ - + var documentController = this.application.ninja.documentController; this.application.ninja.documentController._hideCurrentDocument(); + this.application.ninja.documentController.activeDocument = doc; + + this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe + + + //remove any previous Codemirror div var codemirrorDiv = this.element.querySelector(".CodeMirror"); if(!!codemirrorDiv){ @@ -117,13 +125,49 @@ exports.StageView = Montage.create(Component, { lineNumbers: true, mode: type, onCursorActivity: function() { - this.application.ninja.documentController._codeEditor.editor.setLineClass(this.application.ninja.documentController._codeEditor.hline, null); - this.application.ninja.documentController._codeEditor.hline = this.application.ninja.documentController._codeEditor.editor.setLineClass(this.application.ninja.documentController._codeEditor.editor.getCursor().line, "activeline"); + //documentController._codeEditor.editor.setLineClass(documentController._codeEditor.hline, null); + //documentController._codeEditor.hline = documentController._codeEditor.editor.setLineClass(documentController._codeEditor.editor.getCursor().line, "activeline"); } }); //this.application.ninja.documentController._codeEditor.hline = this.application.ninja.documentController._codeEditor.editor.setLineClass(0, "activeline"); } + }, + refreshCodeDocument:{ + value:function(doc){ + + } + }, + addCodeDocument:{ + value:function(doc){ + var type; + switch(doc.documentType) { + case "css" : + type = "css"; + break; + case "js" : + type = "javascript"; + break; + } + + var codeM = CodeMirror.fromTextArea(doc.textArea, { + lineNumbers: true, + mode: type, + onCursorActivity: function() { + //documentController._codeEditor.editor.setLineClass(documentController._codeEditor.hline, null); + //documentController._codeEditor.hline = documentController._codeEditor.editor.setLineClass(documentController._codeEditor.editor.getCursor().line, "activeline"); + } + }); + } + }, + removeCodeDocument:{ + value:function(){ + //remove any previous Codemirror div + var codemirrorDiv = this.element.querySelector(".CodeMirror"); + if(!!codemirrorDiv){ + codemirrorDiv.parentNode.removeChild(codemirrorDiv); + } + } } }); \ No newline at end of file -- cgit v1.2.3