From fa50874d9ca03540dc5741fb51261ef2b56f89ea Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 25 May 2012 15:34:44 -0700 Subject: IKNinja-1491 - Adding slice value to border gradients. Note that using "circle cover" comes close to matching our canvas 2d/WebGL shape's stroke gradients, but still a little off. Signed-off-by: Nivesh Rajbhandari --- js/controllers/elements/element-controller.js | 23 +++++++++++++++++++++-- 1 file changed, 21 insertions(+), 2 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index 20225c61..7bb07976 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js @@ -159,8 +159,6 @@ exports.ElementController = Montage.create(Component, { el.elementModel.stroke = null; return; case 'gradient': - this.setProperty(el, "border-image", color.color.css); - this.setProperty(el, "border-color", "none"); if(color.borderInfo) { if(color.borderInfo.borderWidth) { this.setProperty(el, "border-width", color.borderInfo.borderWidth + color.borderInfo.borderUnits); @@ -169,9 +167,11 @@ exports.ElementController = Montage.create(Component, { this.setProperty(el, "border-style", color.borderInfo.borderStyle); } } + this.setGradientBorder(el, color.color.gradientMode, color.color.css); break; default: this.setProperty(el, "border-image", "none"); + this.setProperty(el, "border-image-slice", ""); this.setProperty(el, "border-color", color.color.css); if(color.borderInfo) { if(color.borderInfo.borderWidth) { @@ -188,6 +188,25 @@ exports.ElementController = Montage.create(Component, { } }, + setGradientBorder: { + value: function(el, gradientMode, css) { + if(gradientMode === "radial") { + this.setProperty(el, "border-image", css.replace("ellipse", "circle")); + } else { + this.setProperty(el, "border-image", css); + } + this.setProperty(el, "border-color", "none"); + // gradient slice = borderWidth/totalWidth + var b = parseInt(this.getProperty(el, "border-left-width", true)), + w = parseInt(this.getProperty(el, "width", true)), + h = parseInt(this.getProperty(el, "height", true)); + if(h > w) { + w = h; + } + this.setProperty(el, "border-image-slice", Math.floor(b/(w+b+b) * 100) + "%"); + } + }, + getStroke: { value: function(el) { // TODO - Need to figure out which border side user wants -- cgit v1.2.3 From 4c3aac5eabd93052b1554a03d78235215bb49db4 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 29 May 2012 00:34:40 -0700 Subject: document bindings phase 1 - using array controller to bind the current document to all ninja components - removed open document event - removed references to the document controller Signed-off-by: Valerio Virgillito --- js/controllers/document-controller.js | 182 ++++++--------------------- js/controllers/elements/shapes-controller.js | 4 +- js/controllers/selection-controller.js | 61 +++++---- js/controllers/styles-controller.js | 93 +++++++++----- js/controllers/undo-controller.js | 8 -- 5 files changed, 134 insertions(+), 214 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js index 2c34eedf..948e4550 100755 --- a/js/controllers/document-controller.js +++ b/js/controllers/document-controller.js @@ -8,38 +8,18 @@ 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, HTMLDocument = require("js/document/document-html").HtmlDocument, TextDocument = require("js/document/document-text").TextDocument; //////////////////////////////////////////////////////////////////////// // exports.DocumentController = Montage.create(Component, { // - hasTemplate: {value: false}, - _documents: {value: []}, - //TODO: what is this?!?! - _hackInitialStyles: {value: true}, - _activeDocument: { value: null }, - //TODO: Are any of these needed? - _iframeCounter: { value: 1, enumerable: false }, - _iframeHolder: { value: null, enumerable: false }, - _textHolder: { value: null, enumerable: false }, - _codeMirrorCounter: {value: 1, enumerable: false}, - - activeDocument: { - get: function() { - return this._activeDocument; - }, - set: function(doc) { - //if(!!this._activeDocument){ this._activeDocument.isActive = false;} - - this._activeDocument = doc; - - if(!!this._activeDocument){ - if(this._documents.indexOf(doc) === -1) this._documents.push(doc); - this._activeDocument.isActive = true; - } - } + hasTemplate: { + value: false + }, + + documents: { + value: [] }, deserializedFromTemplate: { @@ -52,8 +32,6 @@ exports.DocumentController = Montage.create(Component, { this.eventManager.addEventListener("executeSaveAll", this, false); this.eventManager.addEventListener("executeFileClose", this, false); this.eventManager.addEventListener("executeFileCloseAll", this, false); - - this.eventManager.addEventListener("styleSheetDirty", this, false); } }, @@ -70,11 +48,11 @@ exports.DocumentController = Montage.create(Component, { if (this.redirectRequests && request.parentFrameId !== -1) { //Checking for proper URL redirect (from different directories) if (request.url.indexOf('js/document/templates/banner') !== -1) { - return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/banner/'))[1]}; + return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/banner/'))[1]}; } else if (request.url.indexOf('js/document/templates/html') !== -1) { - return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/html/'))[1]}; + return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/html/'))[1]}; } else if (request.url.indexOf('js/document/templates/app') !== -1) { - return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/app/'))[1]}; + return {redirectUrl: this.application.ninja.coreIoApi.rootUrl+this.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+request.url.split(chrome.extension.getURL('js/document/templates/app/'))[1]}; } else { //Error, not a valid folder } @@ -98,13 +76,7 @@ exports.DocumentController = Montage.create(Component, { }, //////////////////////////////////////////////////////////////////// - - - - - - - + handleExecuteFileOpen: { value: function(event) { var pickerSettings = event._event.settings || {}; @@ -325,44 +297,6 @@ exports.DocumentController = Montage.create(Component, { } }, - //todo: remove this funciton as it is not used - textDocumentOpened: { - value: function(doc) { - - - - this.application.ninja.stage.stageView.createTextView(doc); - - /* - DocumentManager._hideCurrentDocument(); - stageManagerModule.stageManager._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe - DocumentManager.activeDocument = doc; - - var type; - - switch(doc.documentType) { - case "css" : - type = "css"; - break; - case "js" : - type = "javascript"; - break; - } - - DocumentManager._codeEditor.editor = CodeMirror.fromTextArea(doc.textArea, { - lineNumbers: true, - mode: type, - onCursorActivity: function() { - DocumentManager._codeEditor.editor.setLineClass(DocumentManager._codeEditor.hline, null); - DocumentManager._codeEditor.hline = DocumentManager._codeEditor.editor.setLineClass(DocumentManager._codeEditor.editor.getCursor().line, "activeline"); - } - }); - DocumentManager._codeEditor.hline = DocumentManager._codeEditor.editor.setLineClass(0, "activeline"); - */ - - } - }, - closeFile: { value: function(document) { document.closeDocument(this, this.onCloseFile); @@ -373,7 +307,8 @@ exports.DocumentController = Montage.create(Component, { value: function(doc) { var previousFocusedDocument; - this._documents.splice(this._documents.indexOf(doc), 1); +// this._documents.splice(this._documents.indexOf(doc), 1); + this.application.ninja.docController.removeObjects(this._documents.indexOf(doc)); if(this._documents.length > 0) { previousFocusedDocument = this._documents[this._documents.length - 1]; @@ -433,48 +368,44 @@ exports.DocumentController = Montage.create(Component, { // Open document callback _onOpenDocument: { value: function(doc){ - var currentDocument; - if(this.activeDocument) { + + + // Bypass all and call main. + // TODO: Call ninja directly once this is all cleaned up. + + this.application.ninja.handleOnOpenDocument(doc); + + +// var currentDocument; +// if(this.activeDocument) { // There is a document currently opened - currentDocument = this.activeDocument; - } else { +// currentDocument = this.activeDocument; +// } else { // There is no document opened - // Show the rulers - // TODO: Move this indo design view - this.application.ninja.stage.showRulers(); - - // Show the canvas - this.application.ninja.stage.hideCanvas(false); - } +// } // Set the active document - this.activeDocument = doc; +// this.activeDocument = doc; + + +// this.switchDocuments(currentDocument, doc, true); - // Initialize the documentRoot styles - this.initializeRootStyles(doc.model.documentRoot); - // Flag to stop stylesheet dirty event - this._hackInitialStyles = false; - this.switchDocuments(currentDocument, doc, true); } }, _onOpenTextDocument: { value: function(doc) { - var currentDocument = null; - if(this.activeDocument) { - // There is a document currently opened - currentDocument = this.activeDocument; - } - this.application.ninja.currentDocument = this.activeDocument = doc; + this.application.ninja.handleOnOpenDocument(doc); - document.getElementById("iframeContainer").style.display = "none"; - this.application.ninja.codeEditorController.applySettings(); + // Main DIFFERENCE -- + // TODO: Implement Code View here + //document.getElementById("iframeContainer").style.display = "none"; + //this.application.ninja.codeEditorController.applySettings(); - this.switchDocuments(currentDocument, doc, true); } }, @@ -512,10 +443,10 @@ exports.DocumentController = Montage.create(Component, { this.application.ninja.stage.hideRulers(); } - this.application.ninja.stage.clearAllCanvas(); +// this.application.ninja.stage.clearAllCanvas(); if(didCreate) { - newDocument.model.currentView.show(); +// newDocument.model.currentView.show(); if(newDocument.currentView === "design") { NJevent("onOpenDocument", newDocument); @@ -566,46 +497,5 @@ exports.DocumentController = Montage.create(Component, { return false; } - }, - - handleStyleSheetDirty:{ - value:function(){ - if(!this._hackInitialStyles) { - this.activeDocument.model.needsSave = true; - } - } - }, - - // TODO: Move this into the design views - initializeRootStyles: { - value: function(documentRoot) { - var sc = this.application.ninja.stylesController, - styles = {}, - needsRule = false, - rule; - - if(sc.getElementStyle(documentRoot, "width", false, false) == null) { - styles['width'] = '100%'; - needsRule = true; - } - if(sc.getElementStyle(documentRoot, "height", false, false) == null) { - styles['height'] = '100%'; - needsRule = true; - } - if(sc.getElementStyle(documentRoot, "-webkit-transform", false, false) == null) { - styles['-webkit-transform'] = 'perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'; - needsRule = true; - } - if(sc.getElementStyle(documentRoot, "-webkit-transform-style", false, false) == null) { - styles['-webkit-transform-style'] = 'preserve-3d'; - needsRule = true; - } - - if(needsRule) { - rule = sc.addRule('.ninja-body{}'); - sc.setStyles(rule, styles); - sc.addClass(documentRoot, "ninja-body"); - } - } } }); diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js index 38f133b5..626dedb6 100755 --- a/js/controllers/elements/shapes-controller.js +++ b/js/controllers/elements/shapes-controller.js @@ -213,7 +213,7 @@ exports.ShapesController = Montage.create(CanvasController, { default: CanvasController.setProperty(el, p, value); } - this.application.ninja.documentController.activeDocument.model.needsSave = true; + this.application.ninja.currentDocument.model.needsSave = true; } }, @@ -559,7 +559,7 @@ exports.ShapesController = Montage.create(CanvasController, { } } el.elementModel.shapeModel.GLWorld.render(); - this.application.ninja.documentController.activeDocument.model.needsSave = true; + this.application.ninja.currentDocument.model.needsSave = true; } }, diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js index 75bffc5c..db8bdf51 100755 --- a/js/controllers/selection-controller.js +++ b/js/controllers/selection-controller.js @@ -20,6 +20,41 @@ exports.SelectionController = Montage.create(Component, { } }, + _currentDocument: { + value : null, + enumerable : false + }, + + currentDocument : { + get : function() { + return this._currentDocument; + }, + set : function(value) { + if (value === this._currentDocument) { + return; + } + + this._currentDocument = value; + + if(this._currentDocument.currentView === "design") { + + /* + this._isDocument = true; + + if(currentSelectionArray) { + this.application.ninja.selectedElements = currentSelectionArray; + if(currentSelectionArray.length) { + this._isDocument = false; + NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": this._isDocument}); + } + } + + this._selectionContainer = this.application.ninja.currentSelectedContainer; + */ + } + } + }, + /* * Bound property to the ninja currentSelectedContainer */ @@ -52,32 +87,6 @@ exports.SelectionController = Montage.create(Component, { } }, - /** - * Get the current document selection array. If nothing is selected the currentSelectionArray should be null - */ - handleOpenDocument: { - value: function() { - // Handle initializing the selection array here. - this.initWithDocument([]); - } - }, - - initWithDocument: { - value: function(currentSelectionArray) { - this._isDocument = true; - - if(currentSelectionArray) { - this.application.ninja.selectedElements = currentSelectionArray; - if(currentSelectionArray.length) { - this._isDocument = false; - NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": this._isDocument}); - } - } - - this._selectionContainer = this.application.ninja.currentSelectedContainer; - } - }, - handleSwitchDocument: { value: function() { // if(this.application.ninja.documentController.activeDocument.currentView === "design"){ diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 534f77c7..217a536d 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -50,10 +50,10 @@ var stylesController = exports.StylesController = Montage.create(Component, { handleAppLoaded : { value: function() { - ///// Bind app's activeDocument property to - ///// styles controller's _activeDocument property + ///// Bind app's currentDocument property to + ///// styles controller's _currentDocument property -// Object.defineBinding(this, "activeDocument", { +// Object.defineBinding(this, "currentDocument", { // boundObject: this.application.ninja, // boundObjectPropertyPath: "currentDocument", // oneway: true @@ -69,20 +69,20 @@ var stylesController = exports.StylesController = Montage.create(Component, { }, ///// Active document gets automatically set when the ///// document controller changes it - _activeDocument : { + _currentDocument : { value : null, enumerable : false }, - activeDocument : { + currentDocument : { get : function() { - return this._activeDocument; + return this._currentDocument; }, set : function(document) { ///// If the document is null set default stylesheets to null if(!document || document.currentView === "code") { - this._activeDocument = null; + this._currentDocument = null; this._stageStylesheet = null; this.defaultStylesheet = null; this.userStyleSheets = []; @@ -91,7 +91,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { } ///// setting document via binding - this._activeDocument = document; + this._currentDocument = document; ///// Stage stylesheet should always be found this._stageStylesheet = this.getSheetFromElement(this.CONST.STAGE_SHEET_ID); @@ -103,6 +103,8 @@ var stylesController = exports.StylesController = Montage.create(Component, { return sheet !== this._stageStylesheet; }, this); + this.initializeRootStyles(); + NJevent('styleSheetsReady', this); }, enumerable : false @@ -129,10 +131,10 @@ var stylesController = exports.StylesController = Montage.create(Component, { return false; } //check that the document has a design view - else if(this._activeDocument.model && this._activeDocument.model.views && this._activeDocument.model.views.design){ + else if(this._currentDocument.model && this._currentDocument.model.views && this._currentDocument.model.views.design){ ///// Use the last stylesheet in the document as the default - var sheets = this._activeDocument.model.views.design.document.styleSheets, + var sheets = this._currentDocument.model.views.design.document.styleSheets, lastIndex = sheets.length-1; ///// If the only sheet is the stage stylesheet, this will be true @@ -148,7 +150,37 @@ var stylesController = exports.StylesController = Montage.create(Component, { } } }, - + + initializeRootStyles: { + value: function() { + var styles = {}, + needsRule = false, + rule; + + if(this.getElementStyle(this.currentDocument.model.documentRoot, "width", false, false) == null) { + styles['width'] = '100%'; + needsRule = true; + } + if(this.getElementStyle(this.currentDocument.model.documentRoot, "height", false, false) == null) { + styles['height'] = '100%'; + needsRule = true; + } + if(this.getElementStyle(this.currentDocument.model.documentRoot, "-webkit-transform", false, false) == null) { + styles['-webkit-transform'] = 'perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'; + needsRule = true; + } + if(this.getElementStyle(this.currentDocument.model.documentRoot, "-webkit-transform-style", false, false) == null) { + styles['-webkit-transform-style'] = 'preserve-3d'; + needsRule = true; + } + + if(needsRule) { + rule = this.addRule('.ninja-body{}'); + this.setStyles(rule, styles); + this.addClass(this.currentDocument.model.documentRoot, "ninja-body"); + } + } + }, /* ----------------- Rule methods ----------------- */ ///// Add Rule @@ -538,7 +570,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { return true; } - var doc = document || this._activeDocument; + var doc = document || this._currentDocument; ///// TODO: somehow cache the number of elements affected ///// by the rule, because querySelectorAll() is expensive return !!(doc.querySelectorAll(rule.selectorText).length > 1); @@ -887,7 +919,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { getAnimationRuleWithName : { value: function(name, document) { - var doc = document || this._activeDocument.model.views.design.document, + var doc = document || this._currentDocument.model.views.design.document, animRules = this.getDocumentAnimationRules(doc), rule, i; @@ -909,7 +941,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { getDocumentAnimationRules : { value: function(document) { - var sheets = (document) ? document.styleSheets : this._activeDocument.model.views.design.document.styleSheets, + var sheets = (document) ? document.styleSheets : this._currentDocument.model.views.design.document.styleSheets, rules = []; nj.toArray(sheets).forEach(function(sheet) { @@ -1272,7 +1304,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { createStylesheet : { value: function(id, document) { - var doc = document || this._activeDocument.model.views.design.document, + var doc = document || this._currentDocument.model.views.design.document, sheetElement, sheet; sheetElement = nj.make('style', { @@ -1329,15 +1361,12 @@ var stylesController = exports.StylesController = Montage.create(Component, { getSheetFromElement : { value : function(element, context) { - var doc = context || this._activeDocument.model.views.design.document, + var doc = context || this._currentDocument.model.views.design.document, el = (typeof element === 'string') ? nj.$(element, doc) : element; if(el && el.sheet) { return el.sheet; } - - return; - } }, @@ -1363,7 +1392,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { ///// If the sheet doesn't already exist in the list of modified ///// sheets, dispatch dirty event and add the sheet to the list if(sheetSearch.length === 0) { - NJevent('styleSheetDirty', eventData); + this.currentDocument.model.needsSave = true; this.dirtyStyleSheets.push({ document : sheet.ownerNode.ownerDocument, stylesheet : sheet @@ -1572,7 +1601,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { getStyleTest : function() { var properties = ['background-position', 'width', 'height']; - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); properties.forEach(function(prop) { console.log('Getting value for "' + prop + '": ' + stylesController.getElementStyle(el, prop, true)); @@ -1591,7 +1620,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { }); }, getMatchingRulesTest : function() { - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'), + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'), mRules; this.addRulesTest(); @@ -1606,7 +1635,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { ///// apply a new style using setElementStyle, and print out the new ///// value. - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'), + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'), bg; console.log('----- Set Element Style Test -----'); @@ -1631,14 +1660,14 @@ var stylesController = exports.StylesController = Montage.create(Component, { var rules = ['#UserContent div { background-color: blue }']; rules.forEach(function(rule) { stylesController.addRule(rule); }); - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); stylesController.setElementStyle(el, 'color', 'red'); ///// the #Div_1 rule created by tag tool should have the color style }, setElementStyle3Test : function() { ///// First, draw a div onto the stage - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); //// now add a multi-target rule overriding the bg color var rules = [ @@ -1655,14 +1684,14 @@ var stylesController = exports.StylesController = Montage.create(Component, { }, setGroupStyleTest : function() { ///// draw 2 divs on stage - var el1 = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); - var el2 = stylesController.activeDocument.model.views.design.document.getElementById('Div_2'); + var el1 = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); + var el2 = stylesController.currentDocument.model.views.design.document.getElementById('Div_2'); var dominantRule = stylesController.getDominantRuleForGroup([el1, el2], 'color'); }, setElementStylesTest : function() { ///// draw a div on stage - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); mRules = stylesController.getMatchingRules(el, true); mRules.forEach(function(rule) { @@ -1681,7 +1710,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { console.log('----- Create Override Rule Test -----'); - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'), + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'), rule = stylesController.addRule('#UserContent div { background-color: blue }'), override; @@ -1693,7 +1722,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { }, deleteRulesTest : function() { // drag one div on stage - var el = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); + var el = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); this.addRulesTest(); mRules = stylesController.getMatchingRules(el, true); @@ -1705,8 +1734,8 @@ var stylesController = exports.StylesController = Montage.create(Component, { matchesElementsExclusivelyTest : function() { /// drag two divs on stage var rule = stylesController.addRule('#Div_1, #Div_3 { color:black; }'); - var el1 = stylesController.activeDocument.model.views.design.document.getElementById('Div_1'); - var el2 = stylesController.activeDocument.model.views.design.document.getElementById('Div_2'); + var el1 = stylesController.currentDocument.model.views.design.document.getElementById('Div_1'); + var el2 = stylesController.currentDocument.model.views.design.document.getElementById('Div_2'); console.log('Does rule match elements exclusively? ' + stylesController.matchesElementsExclusively(rule, [el1, el2])); } diff --git a/js/controllers/undo-controller.js b/js/controllers/undo-controller.js index 19cfb6e6..8514df3d 100755 --- a/js/controllers/undo-controller.js +++ b/js/controllers/undo-controller.js @@ -113,20 +113,12 @@ exports.UndoController = Montage.create( Component, { deserializedFromTemplate: { value: function(){ - this.eventManager.addEventListener( "openDocument", this, false); this.eventManager.addEventListener( "sendToUndo", this, false); this.eventManager.addEventListener( "executeUndo", this, false); this.eventManager.addEventListener( "executeRedo", this, false); } }, - handleOpenDocument: { - value: function(undoQueue, redoQueue) { -// this._undoQueue = undoQueue; -// this._redoQueue = redoQueue; - } - }, - handleSendToUndo: { value: function(event) { this.undoQueue.push(event.detail); -- cgit v1.2.3 From 42c2a480a3883389e47d4ec291dfb55d99cf4b7f Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Tue, 29 May 2012 10:26:19 -0700 Subject: Cache perspective distance lookup to speed up user interaction. Signed-off-by: Nivesh Rajbhandari --- js/controllers/styles-controller.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 534f77c7..e76e5a1b 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -1229,9 +1229,10 @@ var stylesController = exports.StylesController = Montage.create(Component, { } } if(isNaN(dist)) { - dist = null; + return "none"; + } else { + return dist; } - return dist; } }, -- cgit v1.2.3 From 4fa08fe2ce439a5f5c248c568f72d3828ee11b36 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 29 May 2012 11:43:55 -0700 Subject: fix for the document tab close button and rulers on initial document Signed-off-by: Valerio Virgillito --- js/controllers/selection-controller.js | 40 +--------------------------------- 1 file changed, 1 insertion(+), 39 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js index db8bdf51..0d34ff25 100755 --- a/js/controllers/selection-controller.js +++ b/js/controllers/selection-controller.js @@ -20,44 +20,7 @@ exports.SelectionController = Montage.create(Component, { } }, - _currentDocument: { - value : null, - enumerable : false - }, - - currentDocument : { - get : function() { - return this._currentDocument; - }, - set : function(value) { - if (value === this._currentDocument) { - return; - } - - this._currentDocument = value; - - if(this._currentDocument.currentView === "design") { - - /* - this._isDocument = true; - - if(currentSelectionArray) { - this.application.ninja.selectedElements = currentSelectionArray; - if(currentSelectionArray.length) { - this._isDocument = false; - NJevent("selectionChange", {"elements": this.application.ninja.selectedElements, "isDocument": this._isDocument}); - } - } - - this._selectionContainer = this.application.ninja.currentSelectedContainer; - */ - } - } - }, - - /* - * Bound property to the ninja currentSelectedContainer - */ + // Bound property to the ninja currentSelectedContainer _selectionContainer: { value: null }, @@ -77,7 +40,6 @@ exports.SelectionController = Montage.create(Component, { deserializedFromTemplate: { value: function() { - this.eventManager.addEventListener("openDocument", this, false); this.eventManager.addEventListener("elementAdded", this, false); this.eventManager.addEventListener("elementsRemoved", this, false); this.eventManager.addEventListener("elementReplaced", this, false); -- cgit v1.2.3 From 5d7dff15e1e603e3b37057b9843e4b1eef1b2dca Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 29 May 2012 15:32:47 -0700 Subject: cleanup and handling the document views in the document controller for now. Signed-off-by: Valerio Virgillito --- js/controllers/document-controller.js | 60 +++++++++++++++-------------------- 1 file changed, 26 insertions(+), 34 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js index 948e4550..eba950b9 100755 --- a/js/controllers/document-controller.js +++ b/js/controllers/document-controller.js @@ -22,6 +22,30 @@ exports.DocumentController = Montage.create(Component, { value: [] }, + _currentDocument: { + value : null + }, + + currentDocument : { + get : function() { + return this._currentDocument; + }, + set : function(value) { + if (value === this._currentDocument || value.getProperty("currentView") !== "design") { + return; + } + + if(this._currentDocument) { + this._currentDocument.model.currentView.hide(); + } + + this._currentDocument = value; + + this._currentDocument.model.currentView.show(); + + } + }, + deserializedFromTemplate: { value: function() { //TODO: Add event naming consistency (save, fileOpen and newFile should be consistent, all file events should be executeFile[operation name]) this.eventManager.addEventListener("appLoaded", this, false); @@ -280,11 +304,11 @@ exports.DocumentController = Montage.create(Component, { //Open in designer view this.redirectRequests = false; - Montage.create(HTMLDocument).init(file, this, this._onOpenDocument, 'design', template); + Montage.create(HTMLDocument).init(file, this.application.ninja, this.application.ninja.openDocument, 'design', template); break; default: //Open in code view - Montage.create(TextDocument).init(file, this, this._onOpenTextDocument, 'code'); + Montage.create(TextDocument).init(file, this.application.ninja, this.application.ninja.openDocument, 'code'); break; } } @@ -365,42 +389,10 @@ exports.DocumentController = Montage.create(Component, { } }, - // Open document callback - _onOpenDocument: { - value: function(doc){ - - - // Bypass all and call main. - // TODO: Call ninja directly once this is all cleaned up. - - this.application.ninja.handleOnOpenDocument(doc); - - -// var currentDocument; -// if(this.activeDocument) { - // There is a document currently opened -// currentDocument = this.activeDocument; -// } else { - // There is no document opened - -// } - - // Set the active document -// this.activeDocument = doc; - - -// this.switchDocuments(currentDocument, doc, true); - - - } - }, - _onOpenTextDocument: { value: function(doc) { - this.application.ninja.handleOnOpenDocument(doc); - // Main DIFFERENCE -- // TODO: Implement Code View here //document.getElementById("iframeContainer").style.display = "none"; -- cgit v1.2.3 From 31b094ee21102f99a4021d505bc3a28527c9e23d Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 30 May 2012 01:33:20 -0700 Subject: Fixing the close document. Signed-off-by: Valerio Virgillito --- js/controllers/document-controller.js | 72 +++++----------------------------- js/controllers/selection-controller.js | 1 - 2 files changed, 9 insertions(+), 64 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js index eba950b9..4f122b3b 100755 --- a/js/controllers/document-controller.js +++ b/js/controllers/document-controller.js @@ -31,7 +31,7 @@ exports.DocumentController = Montage.create(Component, { return this._currentDocument; }, set : function(value) { - if (value === this._currentDocument || value.getProperty("currentView") !== "design") { + if (value === this._currentDocument) { return; } @@ -41,7 +41,13 @@ exports.DocumentController = Montage.create(Component, { this._currentDocument = value; - this._currentDocument.model.currentView.show(); + if(!value) { + + } else { + this._currentDocument.model.currentView.show(); + } + + } }, @@ -323,7 +329,7 @@ exports.DocumentController = Montage.create(Component, { closeFile: { value: function(document) { - document.closeDocument(this, this.onCloseFile); + document.closeDocument(this.application.ninja, this.application.ninja.closeFile); } }, @@ -357,39 +363,6 @@ exports.DocumentController = Montage.create(Component, { } }, - closeDocument: { - value: function(id) { - var doc = this._findDocumentByUUID(id); - - var closeDocumentIndex = this._findIndexByUUID(id); - this._documents.splice(this._findIndexByUUID(id), 1); - - if(this.activeDocument.uuid === id && this._documents.length > 0) {//closing the active document tab - var nextDocumentIndex = -1 ; - if((this._documents.length > 0) && (closeDocumentIndex === 0)){ - nextDocumentIndex = 0; - }else if((this._documents.length > 0) && (closeDocumentIndex > 0)){ - nextDocumentIndex = closeDocumentIndex - 1; - } - this.application.ninja.stage.stageView.switchDocument(this._documents[nextDocumentIndex]); - if(typeof doc.stopVideos !== "undefined"){doc.stopVideos();} - doc.container.parentNode.removeChild(doc.container); - }else if(this._documents.length === 0){ - // See above - }else{//closing inactive document tab - just clear DOM - if(typeof doc.pauseAndStopVideos !== "undefined"){ - doc.pauseAndStopVideos(); - } - doc.container.parentNode.removeChild(doc.container); - } - - NJevent("closeDocument", doc.uri); - - doc=null; - } - }, - - _onOpenTextDocument: { value: function(doc) { @@ -462,32 +435,5 @@ exports.DocumentController = Montage.create(Component, { } } } - }, - - /** - * VIEW Related Methods - */ - - // PRIVATE - _findDocumentByUUID: { - value: function(uuid) { - var len = this._documents.length; - for(var i = 0; i < len; i++) { - if(this._documents[i].uuid === uuid) return this._documents[i]; - } - - return false; - } - }, - - _findIndexByUUID: { - value: function(uuid) { - var len = this._documents.length; - for(var i = 0; i < len; i++) { - if(this._documents[i].uuid === uuid) return i; - } - - return false; - } } }); diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js index 0d34ff25..848355da 100755 --- a/js/controllers/selection-controller.js +++ b/js/controllers/selection-controller.js @@ -45,7 +45,6 @@ exports.SelectionController = Montage.create(Component, { this.eventManager.addEventListener("elementReplaced", this, false); this.eventManager.addEventListener("selectAll", this, false); this.eventManager.addEventListener("switchDocument", this, false); - this.eventManager.addEventListener("closeDocument", this, false); } }, -- cgit v1.2.3 From 0a769756547acb93346d8e1b4126931a78845255 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 30 May 2012 17:45:38 -0700 Subject: opening code view documents Signed-off-by: Valerio Virgillito --- js/controllers/code-editor-controller.js | 47 ++++++++++++++++------ js/controllers/document-controller.js | 67 ++++++++++---------------------- 2 files changed, 56 insertions(+), 58 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/code-editor-controller.js b/js/controllers/code-editor-controller.js index e7163bd8..d0b1f179 100644 --- a/js/controllers/code-editor-controller.js +++ b/js/controllers/code-editor-controller.js @@ -9,11 +9,34 @@ 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; -var CodeEditorController = exports.CodeEditorController = Montage.create(Component, { +exports.CodeEditorController = Montage.create(Component, { hasTemplate: { value: false }, + _currentDocument: { + value : null + }, + + currentDocument : { + get : function() { + return this._currentDocument; + }, + set : function(value) { + if (value === this._currentDocument) { + return; + } + + this._currentDocument = value; + + if(!value) { + + } else if(this._currentDocument.currentView === "code") { + this.applySettings(); + } + } + }, + _codeEditor : { value:null }, @@ -213,22 +236,22 @@ var CodeEditorController = exports.CodeEditorController = Montage.create(Compone autoFormatSelection:{ value: function(){ - var range = this.getSelectedRange(this.application.ninja.documentController.activeDocument.model.views.code.editor); - this.application.ninja.documentController.activeDocument.model.views.code.editor.autoFormatRange(range.from, range.to); + var range = this.getSelectedRange(this.currentDocument.model.views.code.editor); + this.currentDocument.model.views.code.editor.autoFormatRange(range.from, range.to); } }, commentSelection:{ value: function(isComment){ - var range = this.getSelectedRange(this.application.ninja.documentController.activeDocument.model.views.code.editor); - this.application.ninja.documentController.activeDocument.model.views.code.editor.commentRange(isComment, range.from, range.to); + var range = this.getSelectedRange(this.currentDocument.model.views.code.editor); + this.currentDocument.model.views.code.editor.commentRange(isComment, range.from, range.to); } }, handleThemeSelection:{ value: function(){ - this.application.ninja.documentController.activeDocument.model.views.code.editor.setOption("theme", this.editorTheme); - this.application.ninja.documentController.activeDocument.model.views.code.applyTheme("cm-s-"+this.editorTheme); + this.currentDocument.model.views.code.editor.setOption("theme", this.editorTheme); + this.currentDocument.model.views.code.applyTheme("cm-s-"+this.editorTheme); } }, @@ -236,10 +259,10 @@ var CodeEditorController = exports.CodeEditorController = Montage.create(Compone value:function(value){ var originalFont=13,originalLineHeight=16; this._zoomFactor = value; - this.application.ninja.documentController.activeDocument.model.views.code.textViewContainer.style.fontSize = ""+((value/100)*originalFont)+"px"; - this.application.ninja.documentController.activeDocument.model.views.code.textViewContainer.style.cursor = "text"; - this.application.ninja.documentController.activeDocument.model.views.code.textViewContainer.querySelector(".CodeMirror").style.lineHeight = ""+((value/100)*originalLineHeight)+"px"; - this.application.ninja.documentController.activeDocument.model.views.code.editor.refresh();//refresh editor display for xoom + this.currentDocument.model.views.code.textViewContainer.style.fontSize = ""+((value/100)*originalFont)+"px"; + this.currentDocument.model.views.code.textViewContainer.style.cursor = "text"; + this.currentDocument.model.views.code.textViewContainer.querySelector(".CodeMirror").style.lineHeight = ""+((value/100)*originalLineHeight)+"px"; + this.currentDocument.model.views.code.editor.refresh();//refresh editor display for xoom } }, @@ -248,7 +271,7 @@ var CodeEditorController = exports.CodeEditorController = Montage.create(Compone //set theme this.handleThemeSelection(); //check autocomplete support - this.handleCodeCompletionSupport(this.application.ninja.documentController.activeDocument.model.file.extension); + this.handleCodeCompletionSupport(this.currentDocument.model.file.extension); //set zoom this.handleZoom(this._zoomFactor); } diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js index 4f122b3b..e059e7e1 100755 --- a/js/controllers/document-controller.js +++ b/js/controllers/document-controller.js @@ -18,6 +18,14 @@ exports.DocumentController = Montage.create(Component, { value: false }, + iframeContainer: { + value: null + }, + + codeContainer: { + value: null + }, + documents: { value: [] }, @@ -42,13 +50,15 @@ exports.DocumentController = Montage.create(Component, { this._currentDocument = value; if(!value) { - - } else { + document.getElementById("iframeContainer").style.display = "block"; + document.getElementById("codeViewContainer").style.display = "block"; + } else if(this._currentDocument.currentView === "design") { + this._currentDocument.model.currentView.show(); + } else { + document.getElementById("iframeContainer").style.display = "none"; this._currentDocument.model.currentView.show(); } - - } }, @@ -64,7 +74,13 @@ exports.DocumentController = Montage.create(Component, { this.eventManager.addEventListener("executeFileCloseAll", this, false); } }, - + + didCreate: { + value: function() { + this.iframeContainer = document.getElementById("iframeContainer"); + this.codeContainer = document.getElementById("codeViewContainer"); + } + }, //TODO: Ensure these APIs are not needed redirectRequests: { @@ -333,47 +349,6 @@ exports.DocumentController = Montage.create(Component, { } }, - onCloseFile: { - value: function(doc) { - var previousFocusedDocument; - -// this._documents.splice(this._documents.indexOf(doc), 1); - this.application.ninja.docController.removeObjects(this._documents.indexOf(doc)); - - if(this._documents.length > 0) { - previousFocusedDocument = this._documents[this._documents.length - 1]; - this.activeDocument = previousFocusedDocument; - this.switchDocuments(this.activeDocument, previousFocusedDocument, false); - } else { - this.activeDocument = null; - this.application.ninja.stage.hideRulers(); - - this.application.ninja.stage.hideCanvas(true); - } - - //TODO: Use references for those instead of calling getElementById - if(this._documents.length === 0){ - document.getElementById("iframeContainer").style.display="block"; - document.getElementById("codeViewContainer").style.display="block"; - } - - NJevent("closeDocument", doc.model.file.uri); - - //TODO: Delete object here - } - }, - - _onOpenTextDocument: { - value: function(doc) { - - // Main DIFFERENCE -- - // TODO: Implement Code View here - //document.getElementById("iframeContainer").style.display = "none"; - //this.application.ninja.codeEditorController.applySettings(); - - } - }, - switchDocuments: { value: function(currentDocument, newDocument, didCreate) { -- cgit v1.2.3 From 322532ba45158835f7228f0149ddf6e22215bfa3 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 30 May 2012 22:54:36 -0700 Subject: Attempting to track clean nodes Need to figure out CSS overwrite issue