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