From 7a22f7b368ef549a5b30c58a0f3900685b764bdb Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Fri, 18 May 2012 16:56:16 -0700 Subject: integrated open code view document in new dom architecture Signed-off-by: Ananya Sen --- js/document/document-text.js | 43 +++++++++- js/document/models/text.js | 4 +- js/document/views/code.js | 193 ++++++++++++++++++++++++++++++++++++++++++- 3 files changed, 231 insertions(+), 9 deletions(-) (limited to 'js/document') diff --git a/js/document/document-text.js b/js/document/document-text.js index 2a469144..533b32c9 100755 --- a/js/document/document-text.js +++ b/js/document/document-text.js @@ -7,7 +7,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; + Component = require("montage/ui/component").Component, + TextDocumentModel = require("js/document/models/text").TextDocumentModel, + CodeDocumentView = require("js/document/views/code").CodeDocumentView; //////////////////////////////////////////////////////////////////////// // exports.TextDocument = Montage.create(Component, { @@ -16,9 +18,44 @@ exports.TextDocument = Montage.create(Component, { hasTemplate: { enumerable: false, value: false - } - //////////////////////////////////////////////////////////////////// + }, //////////////////////////////////////////////////////////////////// + // + model: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // + + init:{ + enumerable: false, + value : function(file, context, callback, view){ + var codeDocumentView = CodeDocumentView.create(), container = null; + codeDocumentView.initialize(); + + //Creating instance of Text Document Model + this.model = Montage.create(TextDocumentModel,{ + file: {value: file}, + parentContainer: {value: document.getElementById("codeViewContainer")}, + views: {value: {'code': codeDocumentView, 'design': null}} + }); + + codeDocumentView.textArea.value = file.content; + codeDocumentView.initializeTextView(file, this); + + if (view === 'code') { + //TODO: Remove reference and use as part of model + this.currentView = 'code'; + //Setting current view object to design + this.model.currentView = this.model.views.code; + } + + + callback.call(context, this); + } + } +//////////////////////////////////////////////////////////////////// +//////////////////////////////////////////////////////////////////// }); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// \ No newline at end of file diff --git a/js/document/models/text.js b/js/document/models/text.js index ebf9993e..5a5e86ef 100755 --- a/js/document/models/text.js +++ b/js/document/models/text.js @@ -7,7 +7,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot //////////////////////////////////////////////////////////////////////// // var Montage = require("montage/core/core").Montage, - BaseDocumentModel = require("js/document/models/text").BaseDocumentModel; + BaseDocumentModel = require("js/document/models/base").BaseDocumentModel; //////////////////////////////////////////////////////////////////////// // exports.TextDocumentModel = Montage.create(BaseDocumentModel, { @@ -17,8 +17,6 @@ exports.TextDocumentModel = Montage.create(BaseDocumentModel, { enumerable: false, value: false } - //////////////////////////////////////////////////////////////////// - //////////////////////////////////////////////////////////////////// }); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// \ No newline at end of file diff --git a/js/document/views/code.js b/js/document/views/code.js index cd3e02d4..de12881c 100755 --- a/js/document/views/code.js +++ b/js/document/views/code.js @@ -11,15 +11,202 @@ var Montage = require("montage/core/core").Montage, BaseDocumentView = require("js/document/views/base").BaseDocumentView; //////////////////////////////////////////////////////////////////////// // -exports.CodeDocumentView = Montage.create(BaseDocumentView, { +var CodeDocumentView = exports.CodeDocumentView = Montage.create(BaseDocumentView, { //////////////////////////////////////////////////////////////////// // hasTemplate: { enumerable: false, value: false + }, + + //////////////////////////////////////////////////////////////////// + // + _editor: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // + editor: { + get: function() {return this._editor;}, + set: function(value) {this._editor= value;} + }, + //////////////////////////////////////////////////////////////////// + // + _textArea: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // + textArea: { + get: function() {return this._textArea;}, + set: function(value) {this._textArea= value;} + }, + + //////////////////////////////////////////////////////////////////// + //remove _extParentContainer after moving to bucket structure for documents + _textParentContainer: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // + textParentContainer: { + get: function() {return this._textParentContainer;}, + set: function(value) {this._textParentContainer= value;} + }, + //////////////////////////////////////////////////////////////////// + // + _textViewContainer: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // + textViewContainer: { + get: function() {return this._textViewContainer;}, + set: function(value) {this._textViewContainer= value;} + }, + //////////////////////////////////////////////////////////////////// + // + + /** + * Public method + */ + initialize:{ + value: function(){ + //populate _textParentContainer + this.textParentContainer = document.getElementById("codeViewContainer"); + + //create contianer + this.textViewContainer = document.createElement("div"); + //this.textViewContainer.id = "codemirror_" + uuid; + this.textViewContainer.style.display = "block"; + this.textParentContainer.appendChild(this.textViewContainer); + + //create text area + this.textArea = this.createTextAreaElement(); + } + }, + + /** + * Public method + * Creates a textarea element which will contain the content of the opened text document. + */ + createTextAreaElement: { + value: function() { + var textArea = document.createElement("textarea"); +// textArea.id = "code"; +// textArea.name = "code"; + this.textViewContainer.appendChild(textArea); + + return textArea; + } + }, + //////////////////////////////////////////////////////////////////// + // + /** + * Public method + * Creates a new instance of a code editor + */ + initializeTextView: { + value: function(file, textDocument) { + var type; + + if(this.activeDocument) { + //need to hide only if another document was open before +// this.application.ninja.documentController._hideCurrentDocument(); +// this.hideOtherDocuments(doc.uuid); + } + + switch(file.extension) { + case "css" : + type = "css"; + break; + case "js" : + type = "javascript"; + break; + case "html" : + type = "htmlmixed"; + break; + case "json" : + type = "javascript"; + break; + case "php" : + type = "php"; + break; + case "pl" : + type = "perl"; + break; + case "py" : + type = "python"; + break; + case "rb" : + type = "ruby"; + break; + case "xml" : + type = "xml"; + break; + } + this.textViewContainer.style.display="block"; + + this.editor = this.application.ninja.codeEditorController.createEditor(this, type, file.extension, textDocument); + this.editor.hline = this.editor.setLineClass(0, "activeline"); + + + } + }, + //////////////////////////////////////////////////////////////////// + // + + showRulers:{ + value:function(){ + this.application.ninja.rulerTop.style.display = "block"; + this.application.ninja.rulerLeft.style.display = "block"; + } + }, + hideRulers:{ + value:function(){ + this.application.ninja.rulerTop.style.display = "none"; + this.application.ninja.rulerLeft.style.display = "none"; + } + }, + showCodeViewBar:{ + value:function(isCodeView){ + if(isCodeView === true) { + this.application.ninja.editorViewOptions.element.style.display = "block"; + this.application.ninja.documentBar.element.style.display = "none"; + } else { + this.application.ninja.documentBar.element.style.display = "block"; + this.application.ninja.editorViewOptions.element.style.display = "none"; + } + } + }, + + collapseAllPanels:{ + value:function(){ + this.application.ninja.panelSplitter.collapse(); + this.application.ninja.timelineSplitter.collapse(); + this.application.ninja.toolsSplitter.collapse(); + this.application.ninja.optionsSplitter.collapse(); + } + }, + restoreAllPanels:{ + value:function(){ + this.application.ninja.panelSplitter.restore(); + this.application.ninja.timelineSplitter.restore(); + this.application.ninja.toolsSplitter.restore(); + this.application.ninja.optionsSplitter.restore(); + } + }, + + applyTheme:{ + value:function(themeClass){ + //Todo: change for bucket structure of documents + this.textParentContainer.className = "codeViewContainer "+themeClass; + } } - //////////////////////////////////////////////////////////////////// - //////////////////////////////////////////////////////////////////// + + +//////////////////////////////////////////////////////////////////////// +//////////////////////////////////////////////////////////////////////// }); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// \ No newline at end of file -- cgit v1.2.3 From 6f5ffa17c72dd0aef7a02e3496154514750143c2 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Fri, 18 May 2012 18:38:09 -0700 Subject: save for code view documents in the new dom architecture Signed-off-by: Ananya Sen --- js/document/document-text.js | 10 ++++++++- js/document/models/text.js | 53 +++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 61 insertions(+), 2 deletions(-) (limited to 'js/document') diff --git a/js/document/document-text.js b/js/document/document-text.js index 533b32c9..09525f4e 100755 --- a/js/document/document-text.js +++ b/js/document/document-text.js @@ -53,8 +53,16 @@ exports.TextDocument = Montage.create(Component, { callback.call(context, this); } - } + }, //////////////////////////////////////////////////////////////////// + // + closeDocument: { + value: function (context, callback) { + var closed = this.model.close(null); + + callback.call(context, this); + } + } //////////////////////////////////////////////////////////////////// }); //////////////////////////////////////////////////////////////////////// diff --git a/js/document/models/text.js b/js/document/models/text.js index 5a5e86ef..d21666d0 100755 --- a/js/document/models/text.js +++ b/js/document/models/text.js @@ -16,7 +16,58 @@ exports.TextDocumentModel = Montage.create(BaseDocumentModel, { hasTemplate: { enumerable: false, value: false - } + }, +//////////////////////////////////////////////////////////////////// + // + save: { + enumerable: false, + value: function (callback) { + this.application.ninja.documentController.activeDocument.model.views.code.editor.save();//save to textarea + + var self = this; + + this.application.ninja.ioMediator.fileSave({ + mode: ""+ self.file.extension, + file: self.file, + content:self.views.code.textArea.value + }, this.handleSaved.bind({callback: callback, model: this})); + } + }, +//////////////////////////////////////////////////////////////////// + // + handleSaved: { + value: function (result) { + // + if (result.status === 204) { + this.model.needsSave = false; + } + // + if (this.callback) this.callback(result); + } + }, + //////////////////////////////////////////////////////////////////// + // + close: { + value: function (view, callback) { + //Outcome of close (pending on save logic) + var success; + // + if (this.needsSave) { + //Prompt user to save of lose data + } else { + //Close file + success = true; + } + // + this.views.code.textParentContainer.removeChild(this.views.code.textViewContainer); + this.views.code.restoreAllPanels(); + this.views.code.showCodeViewBar(false); + this.views.code = null; + + // + return success; + } + } }); //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// \ No newline at end of file -- cgit v1.2.3 From c3c2ffc8d057660b7c42b45442885cd0d2d598bc Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Sun, 20 May 2012 15:16:06 -0700 Subject: use documents parent container property Signed-off-by: Ananya Sen --- js/document/document-text.js | 3 ++- js/document/models/text.js | 2 +- js/document/views/code.js | 21 +++------------------ 3 files changed, 6 insertions(+), 20 deletions(-) (limited to 'js/document') diff --git a/js/document/document-text.js b/js/document/document-text.js index 09525f4e..bb63f5f8 100755 --- a/js/document/document-text.js +++ b/js/document/document-text.js @@ -31,7 +31,6 @@ exports.TextDocument = Montage.create(Component, { enumerable: false, value : function(file, context, callback, view){ var codeDocumentView = CodeDocumentView.create(), container = null; - codeDocumentView.initialize(); //Creating instance of Text Document Model this.model = Montage.create(TextDocumentModel,{ @@ -40,6 +39,8 @@ exports.TextDocument = Montage.create(Component, { views: {value: {'code': codeDocumentView, 'design': null}} }); + codeDocumentView.initialize(this.model.parentContainer); + codeDocumentView.textArea.value = file.content; codeDocumentView.initializeTextView(file, this); diff --git a/js/document/models/text.js b/js/document/models/text.js index d21666d0..fe02953c 100755 --- a/js/document/models/text.js +++ b/js/document/models/text.js @@ -59,7 +59,7 @@ exports.TextDocumentModel = Montage.create(BaseDocumentModel, { success = true; } // - this.views.code.textParentContainer.removeChild(this.views.code.textViewContainer); + this.parentContainer.removeChild(this.views.code.textViewContainer); this.views.code.restoreAllPanels(); this.views.code.showCodeViewBar(false); this.views.code = null; diff --git a/js/document/views/code.js b/js/document/views/code.js index de12881c..711479a8 100755 --- a/js/document/views/code.js +++ b/js/document/views/code.js @@ -41,18 +41,6 @@ var CodeDocumentView = exports.CodeDocumentView = Montage.create(BaseDocumentVie get: function() {return this._textArea;}, set: function(value) {this._textArea= value;} }, - - //////////////////////////////////////////////////////////////////// - //remove _extParentContainer after moving to bucket structure for documents - _textParentContainer: { - value: null - }, - //////////////////////////////////////////////////////////////////// - // - textParentContainer: { - get: function() {return this._textParentContainer;}, - set: function(value) {this._textParentContainer= value;} - }, //////////////////////////////////////////////////////////////////// // _textViewContainer: { @@ -71,15 +59,12 @@ var CodeDocumentView = exports.CodeDocumentView = Montage.create(BaseDocumentVie * Public method */ initialize:{ - value: function(){ - //populate _textParentContainer - this.textParentContainer = document.getElementById("codeViewContainer"); - + value: function(parentContainer){ //create contianer this.textViewContainer = document.createElement("div"); //this.textViewContainer.id = "codemirror_" + uuid; this.textViewContainer.style.display = "block"; - this.textParentContainer.appendChild(this.textViewContainer); + parentContainer.appendChild(this.textViewContainer); //create text area this.textArea = this.createTextAreaElement(); @@ -200,7 +185,7 @@ var CodeDocumentView = exports.CodeDocumentView = Montage.create(BaseDocumentVie applyTheme:{ value:function(themeClass){ //Todo: change for bucket structure of documents - this.textParentContainer.className = "codeViewContainer "+themeClass; + this.textViewContainer.className = "codeViewContainer "+themeClass; } } -- cgit v1.2.3 From 2cc8e58f6bb9f64a7473e62aecd013fa55167231 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Mon, 21 May 2012 16:42:26 -0700 Subject: - added opening multiple code and design view documents - switching between multiple code and design view documents - Note: closing of documents, when multiple documents are open, is not yet implemented Signed-off-by: Ananya Sen --- js/document/models/text.js | 4 ++-- js/document/views/code.js | 54 ++++++++++++---------------------------------- 2 files changed, 16 insertions(+), 42 deletions(-) (limited to 'js/document') diff --git a/js/document/models/text.js b/js/document/models/text.js index fe02953c..d1252b7d 100755 --- a/js/document/models/text.js +++ b/js/document/models/text.js @@ -60,8 +60,8 @@ exports.TextDocumentModel = Montage.create(BaseDocumentModel, { } // this.parentContainer.removeChild(this.views.code.textViewContainer); - this.views.code.restoreAllPanels(); - this.views.code.showCodeViewBar(false); + this.application.ninja.stage.showCodeViewBar(false); + this.application.ninja.stage.restoreAllPanels(); this.views.code = null; // diff --git a/js/document/views/code.js b/js/document/views/code.js index 711479a8..66d1c702 100755 --- a/js/document/views/code.js +++ b/js/document/views/code.js @@ -140,56 +140,30 @@ var CodeDocumentView = exports.CodeDocumentView = Montage.create(BaseDocumentVie }, //////////////////////////////////////////////////////////////////// // - - showRulers:{ - value:function(){ - this.application.ninja.rulerTop.style.display = "block"; - this.application.ninja.rulerLeft.style.display = "block"; - } - }, - hideRulers:{ - value:function(){ - this.application.ninja.rulerTop.style.display = "none"; - this.application.ninja.rulerLeft.style.display = "none"; - } - }, - showCodeViewBar:{ - value:function(isCodeView){ - if(isCodeView === true) { - this.application.ninja.editorViewOptions.element.style.display = "block"; - this.application.ninja.documentBar.element.style.display = "none"; - } else { - this.application.ninja.documentBar.element.style.display = "block"; - this.application.ninja.editorViewOptions.element.style.display = "none"; - } - } - }, - - collapseAllPanels:{ - value:function(){ - this.application.ninja.panelSplitter.collapse(); - this.application.ninja.timelineSplitter.collapse(); - this.application.ninja.toolsSplitter.collapse(); - this.application.ninja.optionsSplitter.collapse(); + show: { + value: function (callback) { + this.textViewContainer.style.display = "block"; + // + if (callback) callback(); } }, - restoreAllPanels:{ - value:function(){ - this.application.ninja.panelSplitter.restore(); - this.application.ninja.timelineSplitter.restore(); - this.application.ninja.toolsSplitter.restore(); - this.application.ninja.optionsSplitter.restore(); + //////////////////////////////////////////////////////////////////// + // + hide: { + value: function (callback) { + this.textViewContainer.style.display = "none"; + // + if (callback) callback(); } }, - + //////////////////////////////////////////////////////////////////// + // applyTheme:{ value:function(themeClass){ //Todo: change for bucket structure of documents this.textViewContainer.className = "codeViewContainer "+themeClass; } } - - //////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////// }); -- cgit v1.2.3 From 9b6da637d9654727426c6d78f17e3804bbd84ce5 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 22 May 2012 14:42:43 -0700 Subject: fixing a few document switching issues. Signed-off-by: Valerio Virgillito --- js/document/document-html.js | 2 +- js/document/views/base.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) (limited to 'js/document') diff --git a/js/document/document-html.js b/js/document/document-html.js index 983da966..bb391793 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js @@ -155,7 +155,7 @@ exports.HtmlDocument = Montage.create(Component, { // Pause the videos this.model.views.design.pauseVideos(); - this.model.isActive = false; +// this.model.isActive = false; } }, //////////////////////////////////////////////////////////////////// diff --git a/js/document/views/base.js b/js/document/views/base.js index d1c65b5e..db72cc60 100755 --- a/js/document/views/base.js +++ b/js/document/views/base.js @@ -39,6 +39,7 @@ exports.BaseDocumentView = Montage.create(Component, { value: function (callback) { if (this.iframe) { this.iframe.style.display = 'block'; + this.iframe.style.opacity = 1; } else { console.log('Error: View has no iframe to show!'); } @@ -52,6 +53,7 @@ exports.BaseDocumentView = Montage.create(Component, { value: function (callback) { if (this.iframe) { this.iframe.style.display = 'none'; + this.iframe.style.opacity = 0; } else { console.log('Error: View has no iframe to hide!'); } -- cgit v1.2.3