From 495a56081219c0c77814cb72f2d787195ef58285 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 17 May 2012 12:23:31 -0700 Subject: fixing the breadcrumb Signed-off-by: Valerio Virgillito --- .../layout/bread-crumb.reel/bread-crumb.html | 37 ++++++++-------------- .../layout/bread-crumb.reel/bread-crumb.js | 24 ++++---------- 2 files changed, 19 insertions(+), 42 deletions(-) diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.html b/js/components/layout/bread-crumb.reel/bread-crumb.html index ae3e2022..0dabc781 100755 --- a/js/components/layout/bread-crumb.reel/bread-crumb.html +++ b/js/components/layout/bread-crumb.reel/bread-crumb.html @@ -32,30 +32,23 @@ } ], "bindings": { - "label": { - "boundObject": {"@": "repetition1"}, - "boundObjectPropertyPath": "objectAtCurrentIteration.label", - "oneway": true - }, - "value": { - "boundObject": {"@": "repetition1"}, - "boundObjectPropertyPath": "objectAtCurrentIteration.nodeUuid", - "oneway": true - } + "label": {"<-": "@buttonsList.objectAtCurrentIteration.label"}, + "value": {"<-": "@buttonsList.objectAtCurrentIteration.nodeUuid"} + } + }, + + "buttonsListController": { + "prototype": "montage/ui/controller/array-controller", + "bindings": { + "content": {"<<->": "@owner.containerElements"} } }, - "repetition1": { + "buttonsList": { "prototype": "montage/ui/repetition.reel", "properties": { - "element": {"#": "breadcrumb_container"} - }, - "bindings": { - "objects": { - "boundObject": {"@": "owner"}, - "boundObjectPropertyPath": "containerElements", - "oneway": true - } + "element": {"#": "breadcrumb_container"}, + "contentController": {"@": "buttonsListController"} } }, @@ -65,11 +58,7 @@ "element": {"#": "disabledCondition"} }, "bindings": { - "condition": { - "boundObject": {"@": "owner"}, - "boundObjectPropertyPath": "disabled", - "oneway": true - } + "condition": {"<-": "@owner.disabled"} } } } diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.js b/js/components/layout/bread-crumb.reel/bread-crumb.js index c1b021a3..d2a6b1e4 100755 --- a/js/components/layout/bread-crumb.reel/bread-crumb.js +++ b/js/components/layout/bread-crumb.reel/bread-crumb.js @@ -60,30 +60,18 @@ exports.Breadcrumb = Montage.create(Component, { value: function() { var parentNode; - this.containerElements.length = 0; +// delete this.containerElements; + this.containerElements = []; parentNode = this.container; - // This is for the old template support. - // TODO: Remove marker for old template: NINJA-STAGE-REWORK - if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { - while(parentNode.id !== "UserContent") { - this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName}); - parentNode = parentNode.parentNode; - } - - // This is always the top container which is now hardcoded to body - this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": "Body"}); - } else { - while(parentNode !== this.application.ninja.currentDocument.documentRoot) { - this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName}); - parentNode = parentNode.parentNode; - } - - // This is always the top container which is now hardcoded to body + while(parentNode !== this.application.ninja.currentDocument.documentRoot) { this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName}); + parentNode = parentNode.parentNode; } + // This is always the top container which is now hardcoded to body + this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName}); } }, -- cgit v1.2.3 From 792c83a0fe8f7f22d139684ed6d711a2c334c098 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 17 May 2012 16:55:19 -0700 Subject: Adding component initialization on open This is for opening components, selection is still not reflecting component data. --- js/document/views/design.js | 29 +++++++++-------- js/mediators/io-mediator.js | 78 +++++++++++++++++++++++++-------------------- 2 files changed, 59 insertions(+), 48 deletions(-) diff --git a/js/document/views/design.js b/js/document/views/design.js index 2ccb82d1..bd8c25ec 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js @@ -184,8 +184,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { this._bodyFragment = null; //Calling standard method to finish opening document this.bodyContentLoaded(null); - - // TODO: Clean up this code + //TODO: Move this to be set via the controller this.application.ninja.stage.documentOffsetLeft = parseInt((this.document.body.scrollWidth - this._template.size.width)/2); this.application.ninja.stage.documentOffsetTop = parseInt((this.document.body.scrollHeight - this._template.size.height)/2); } @@ -243,17 +242,15 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { } } } - //Checking and initializing webGL + //Checking for script tags then parsing check for montage and webgl if (scripttags.length > 0) { + //Checking and initializing webGL this.initWebGl(scripttags); - } //Else there is not data to parse - - - - //TODO: Load Montage Components (blocking) - //this.initMontage(); - - + //Checking and initializing Montage + this.initMontage(scripttags); + } else { + //Else there is not data to parse + } //Makign callback if specified if (this._callback) this._callback(); } @@ -350,8 +347,14 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { //////////////////////////////////////////////////////////////////// // initMontage: { - value: function () { - //initWithDocument(window.document) instantiateWithOwnerAndDocument(null, window.document) + value: function (scripttags) { + // + this.iframe.contentWindow.document.body.addEventListener('mjsTemplateReady', function () { + //Initializing template with user's seriliazation + var template = this.iframe.contentWindow.mjsTemplate.create(); + template.initWithDocument(this.iframe.contentWindow.document); + template.instantiateWithOwnerAndDocument(null, this.iframe.contentWindow.document, function (e){/*Nothing just a required extra parameter*/}); + }.bind(this), false); } }, //////////////////////////////////////////////////////////////////// diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js index b1916446..c506e186 100644 --- a/js/mediators/io-mediator.js +++ b/js/mediators/io-mediator.js @@ -225,7 +225,7 @@ exports.IoMediator = Montage.create(Component, { mjsCreator = template.mjsTemplateCreator.create(), mJsSerialization, montageTemplate; - // + //Creating instance of template creator montageTemplate = mjsCreator.initWithDocument(template.document); //Setting up expression for parsing URLs regexRootUrl = new RegExp(rootUrl.replace(/\//gi, '\\\/'), 'gi'); @@ -239,7 +239,6 @@ exports.IoMediator = Montage.create(Component, { template.file.content.document.head.innerHTML = template.head.innerHTML.replace(regexRootUrl, ''); template.file.content.document.body.innerHTML = template.body.innerHTML.replace(regexRootUrl, ''); } - //Copying attributes to maintain same properties as the for (var n in template.body.attributes) { if (template.body.attributes[n].value) { @@ -250,6 +249,7 @@ exports.IoMediator = Montage.create(Component, { //TODO: Add attribute copying for and + //console.log(template.file.content.document.getElementsByTagName('html')[0].innerHTML); //Getting all CSS (style or link) tags @@ -266,7 +266,7 @@ exports.IoMediator = Montage.create(Component, { } ////////////////////////////////////////////////// - // + //Adding to tags to be removed form template for (var f in njtemplatetags) { if (njtemplatetags[f].getAttribute) toremovetags.push(njtemplatetags[f]); } @@ -405,6 +405,31 @@ exports.IoMediator = Montage.create(Component, { } } } + // + var matchingtags = [], scripts = template.file.content.document.getElementsByTagName('script'), webgltag, webgljstag, webgllibtag, webglrdgetag, mjstag, mjslibtag; + // + for (var i in scripts) { + if (scripts[i].getAttribute) { + if (scripts[i].getAttribute('data-ninja-webgl') !== null) {//TODO: Use querySelectorAll + matchingtags.push(scripts[i]); + } + if (scripts[i].getAttribute('data-ninja-webgl-js') !== null) { + webgljstag = scripts[i]; // TODO: Add logic to delete unneccesary tags + } + if (scripts[i].getAttribute('data-ninja-webgl-lib') !== null) { + webgllibtag = scripts[i]; // TODO: Add logic to delete unneccesary tags + } + if (scripts[i].getAttribute('data-ninja-webgl-rdge') !== null) { + webglrdgetag = scripts[i]; // TODO: Add logic to delete unneccesary tags + } + if (scripts[i].getAttribute('type') === 'text/montage-serialization') { + mjstag = scripts[i]; // TODO: Add logic to delete unneccesary tags + } + if (scripts[i].getAttribute('data-mjs-lib') !== null) { + mjslibtag = scripts[i]; // TODO: Add logic to delete unneccesary tags + } + } + } //Checking for webGL elements in document if (template.webgl && template.webgl.length > 1) {//TODO: Should be length 0, hack for a temp fix var rdgeDirName, rdgeVersion; @@ -420,31 +445,6 @@ exports.IoMediator = Montage.create(Component, { } } // - var json, matchingtags = [], webgltag, scripts = template.file.content.document.getElementsByTagName('script'), webgljstag, webgllibtag, webglrdgetag, mjstag, mjslibtag; - // - for (var i in scripts) { - if (scripts[i].getAttribute) { - if (scripts[i].getAttribute('data-ninja-webgl') !== null) {//TODO: Use querySelectorAll - matchingtags.push(scripts[i]); - } - if (scripts[i].getAttribute('data-ninja-webgl-js') !== null) { - webgljstag = scripts[i]; // TODO: Add logic to delete unneccesary tags - } - if (scripts[i].getAttribute('data-ninja-webgl-lib') !== null) { - webgllibtag = scripts[i]; // TODO: Add logic to delete unneccesary tags - } - if (scripts[i].getAttribute('data-ninja-webgl-rdge') !== null) { - webglrdgetag = scripts[i]; // TODO: Add logic to delete unneccesary tags - } - if (scripts[i].getAttribute('type') === 'text/montage-serialization') { - mjstag = scripts[i]; // TODO: Add logic to delete unneccesary tags - } - if (scripts[i].getAttribute('data-mjs-lib') !== null) { - mjslibtag = scripts[i]; // TODO: Add logic to delete unneccesary tags - } - } - } - // if (matchingtags.length) { if (matchingtags.length === 1) { webgltag = matchingtags[0]; @@ -510,7 +510,7 @@ function loadWebGL (e) {\n\ }\ "; //TODO: This data should be saved to a JSON file eventually - json = '\n({\n\t"version": "' + rdgeVersion + '",\n\t"directory": "' + rdgeDirName + '/",\n\t"data": ['; + var json = '\n({\n\t"version": "' + rdgeVersion + '",\n\t"directory": "' + rdgeDirName + '/",\n\t"data": ['; //Looping through data to create escaped array for (var j = 0; template.webgl[j]; j++) { if (j === 0) { @@ -524,11 +524,6 @@ function loadWebGL (e) {\n\ //Setting string in tag webgltag.innerHTML = json; } - - - - - //Checking for Montage if (mJsSerialization) { //Copy Montage library if needed @@ -538,8 +533,21 @@ function loadWebGL (e) {\n\ mjsDirName = (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name + this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version).toLowerCase(); mjsVersion = this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version; this.application.ninja.coreIoApi.ninjaLibrary.copyLibToCloud(template.file.root, mjsDirName); + + + //TODO: Fix to allow no overwrite and nested locations - var packjson = this.application.ninja.coreIoApi.createFile({ uri: template.file.root + 'package.json', contents: '{"mappings": {"montage": "' + mjsDirName + '/montage/"}}' }); + var mjsCheck, mjsPath = template.file.root + 'package.json'; + mjsCheck = this.application.ninja.coreIoApi.fileExists({uri: mjsPath}); + // + if (!mjsCheck || mjsCheck.status !== 204) { + var packjson = this.application.ninja.coreIoApi.createFile({ uri: mjsPath, contents: '{"mappings": {"montage": "' + mjsDirName + '/montage/"}}' }); + } else { + //Already exists + } + + + } else { //TODO: Error handle no available library to copy } -- cgit v1.2.3 From 66edf78c7e5df11218ef733686965beab05c7c7d Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Fri, 18 May 2012 14:01:00 -0700 Subject: fixing a scrolling issue when multiple documents are switched Signed-off-by: Valerio Virgillito --- js/document/document-html.js | 11 ++++-- js/document/models/html.js | 17 ++++++++++ js/helper-classes/3D/view-utils.js | 9 ----- js/stage/stage.reel/stage.js | 69 ++++++++------------------------------ 4 files changed, 40 insertions(+), 66 deletions(-) diff --git a/js/document/document-html.js b/js/document/document-html.js index 0037c94d..983da966 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js @@ -139,7 +139,11 @@ exports.HtmlDocument = Montage.create(Component, { //this.gridVerticalSpacing = this.application.ninja.stage.drawUtils.gridVerticalSpacing; // Serialize the current scroll position - // TODO: Implement + this.model.scrollLeft = this.application.ninja.stage._scrollLeft; + this.model.scrollTop = this.application.ninja.stage._scrollTop; + this.model.userContentLeft = this.application.ninja.stage._userContentLeft; + this.model.userContentTop = this.application.ninja.stage._userContentTop; + // Serialize the selection this.model.selection = this.application.ninja.selectedElements.slice(0); @@ -163,7 +167,10 @@ exports.HtmlDocument = Montage.create(Component, { //this.application.ninja.stage.drawUtils.gridVerticalSpacing = this.gridVerticalSpacing; // Deserialize the current scroll position - // TODO: Implement + this.application.ninja.stage._scrollLeft = this.model.scrollLeft; + this.application.ninja.stage._scrollTop = this.model.scrollTop; + this.application.ninja.stage._userContentLeft = this.model.userContentLeft; + this.application.ninja.stage._userContentTop = this.model.userContentTop; this.application.ninja.selectedElements = this.model.selection.slice(0); diff --git a/js/document/models/html.js b/js/document/models/html.js index 67457863..a97b4b5a 100755 --- a/js/document/models/html.js +++ b/js/document/models/html.js @@ -27,6 +27,23 @@ exports.HtmlDocumentModel = Montage.create(BaseDocumentModel, { draw3DGrid: { value: false }, + //////////////////////////////////////////////////////////////////// + // + scrollLeft: { + value: null + }, + + scrollTop: { + value: null + }, + + userContentLeft: { + value: null + }, + + userContentTop: { + value: null + }, //////////////////////////////////////////////////////////////////// // baseHref: { diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js index 20f61be1..75530af3 100755 --- a/js/helper-classes/3D/view-utils.js +++ b/js/helper-classes/3D/view-utils.js @@ -1303,15 +1303,6 @@ exports.ViewUtils = Montage.create(Component, { // MISCELLANEOUS // event.layerX/Y: var pt = viewUtils.getMousePoint(event); - getStageDimension: { - value: function() - { - var width = parseInt(this.application.ninja.stage.documentRoot.elementModel.stageDimension.style.getProperty("width")); - var height= parseInt(this.application.ninja.stage.documentRoot.elementModel.stageDimension.style.getProperty("height")); - return[width,height]; - } - }, - getStage: { value: function() { diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 8da89fb9..73d3aaf4 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -108,7 +108,6 @@ exports.Stage = Montage.create(Component, { // We will set this to false while moving objects to improve performance showSelectionBounds: { value: true }, - _documentRoot: { value: null }, _viewport: { value: null }, _documentOffsetLeft: { value: 0 }, _documentOffsetTop: { value: 0 }, @@ -121,11 +120,6 @@ exports.Stage = Montage.create(Component, { _maxHorizontalScroll: { value: 0 }, _maxVerticalScroll: { value: 0 }, - documentRoot: { - get: function () { return this._documentRoot; }, - set: function(value) { this._documentRoot = value; } - }, - viewport: { get: function () { return this._viewport; }, set: function(value) { this._viewport = value; } @@ -195,10 +189,7 @@ exports.Stage = Montage.create(Component, { set: function(value) { this._userPaddingLeft = value; this._documentOffsetLeft = -value; - if(!this._documentRoot) { - this._documentRoot = this.application.ninja.currentDocument.documentRoot; - } - this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px"; + this.application.ninja.currentDocument.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px"; this.userContentLeft = this._documentOffsetLeft; this.updatedStage = true; } @@ -209,10 +200,7 @@ exports.Stage = Montage.create(Component, { set: function(value) { this._userPaddingTop = value; this._documentOffsetTop = -value; - if(!this._documentRoot) { - this._documentRoot = this.application.ninja.currentDocument.documentRoot; - } - this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px"; + this.application.ninja.currentDocument.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px"; this.userContentTop = this._documentOffsetTop; this.updatedStage = true; } @@ -287,46 +275,17 @@ exports.Stage = Montage.create(Component, { this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ; this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11; - this._documentRoot = this.application.ninja.currentDocument.documentRoot; - - // Hardcode this value so that it does not fail for the new stage architecture - // TODO: Remove marker for old template: NINJA-STAGE-REWORK - if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { - this._viewport = this.application.ninja.currentDocument.documentRoot.parentNode; - - this.documentOffsetLeft = this._viewport.offsetLeft; - this.documentOffsetTop = this._viewport.offsetTop; - - // Center the stage - this.centerStage(); - - this._scrollLeft = this._iframeContainer.scrollLeft; - this._scrollTop = this._iframeContainer.scrollTop; - this.application.ninja.currentDocument.savedLeftScroll = this._iframeContainer.scrollLeft; - this.application.ninja.currentDocument.savedTopScroll = this._iframeContainer.scrollTop; - - this.userContentBorder = parseInt(this._documentRoot.elementModel.controller.getProperty(this._documentRoot, "border")); - - this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; - this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; - - this._iframeContainer.addEventListener("scroll", this, false); - this.application.ninja.currentDocument.iframe.style.opacity = 1.0; - } else { - this.userContentBorder = 0; - - this._scrollLeft = 0; - this._scrollTop = 0; - this._userContentLeft = this._documentOffsetLeft; - this._userContentTop = this._documentOffsetTop; - - this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; - this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; - this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false); - } + this.userContentBorder = 0; + this._scrollLeft = 0; + this._scrollTop = 0; + this._userContentLeft = this._documentOffsetLeft; + this._userContentTop = this._documentOffsetTop; + this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this._canvas.width - 11; + this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this._canvas.height - 11; + this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false); // TODO - We will need to modify this once we support switching between multiple documents this.application.ninja.toolsData.selectedToolInstance._configure(true); @@ -526,8 +485,8 @@ exports.Stage = Montage.create(Component, { // TODO - scroll events are not dependable. We may need to use a timer to simulate // scrollBegin and scrollEnd. For now, the Pan Tool will keep track of the stage's scroll values // on mouse down. -// this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; -// this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; +// this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this._canvas.width - 11; +// this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this._canvas.height - 11; } // Need to clear the snap cache and set up the drag plane @@ -566,8 +525,8 @@ exports.Stage = Montage.create(Component, { centerStage: { value: function() { if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { - this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this._documentRoot.parentNode.offsetWidth)/2; - this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this._documentRoot.parentNode.offsetHeight)/2; + this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this.application.ninja.currentDocument.documentRoot.parentNode.offsetWidth)/2; + this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this.application.ninja.currentDocument.documentRoot.parentNode.offsetHeight)/2; this._scrollLeft = this._iframeContainer.scrollLeft; this._scrollTop = this._iframeContainer.scrollTop; -- cgit v1.2.3 From d878aa470074d5698a316512b513949fa22073f2 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Fri, 18 May 2012 15:23:15 -0700 Subject: Fixing save logic Moved dirty marker clearing code to model. --- js/controllers/document-controller.js | 15 ++++++++------- js/document/models/base.js | 18 +++++++++++++++--- js/mediators/io-mediator.js | 1 + 3 files changed, 24 insertions(+), 10 deletions(-) diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js index f1523d87..cf618360 100755 --- a/js/controllers/document-controller.js +++ b/js/controllers/document-controller.js @@ -145,18 +145,19 @@ var DocumentController = exports.DocumentController = Montage.create(Component, value: function(event) { // if((typeof this.activeDocument !== "undefined") && this.application.ninja.coreIoApi.cloudAvailable()){ - // - this.activeDocument.model.save(this.testCallback.bind(this)); //this.fileSaveResult.bind(this) + //Currently we don't need a callback handler + //this.activeDocument.model.save(this.saveExecuted.bind(this)); + this.activeDocument.model.save(); } else { - //Error: + //Error: cloud not available and/or no active document } } }, - testCallback: { + //////////////////////////////////////////////////////////////////// + // + saveExecuted: { value: function (value) { - console.log(value); - //TODO: Move this to the model.save() - this.activeDocument.model.needsSave = false; + //File saved, any callbacks or events should go here } }, //////////////////////////////////////////////////////////////////// diff --git a/js/document/models/base.js b/js/document/models/base.js index df341b2f..c99e36c7 100755 --- a/js/document/models/base.js +++ b/js/document/models/base.js @@ -151,7 +151,7 @@ exports.BaseDocumentModel = Montage.create(Component, { head: this.views.design.iframe.contentWindow.document.head, body: this.views.design.iframe.contentWindow.document.body, mjsTemplateCreator: this.views.design.iframe.contentWindow.mjsTemplateCreator - }, callback.bind(this)); + }, this.handleSaved.bind({callback: callback, model: this})); } else { //TODO: Add logic to save code view data } @@ -180,7 +180,7 @@ exports.BaseDocumentModel = Montage.create(Component, { head: this.views.design.iframe.contentWindow.document.head, body: this.views.design.iframe.contentWindow.document.body, mjsTemplateCreator: this.views.design.iframe.contentWindow.mjsTemplateCreator - }, callback.bind(this)); + }, this.handleSaved.bind({callback: callback, model: this})); } else { //TODO: Add logic to save code view data } @@ -190,7 +190,7 @@ exports.BaseDocumentModel = Montage.create(Component, { //////////////////////////////////////////////////////////////////// // saveAs: { - value: function () { + value: function (callback) { // if (this.needsSave) { //Save current file on memory @@ -199,6 +199,18 @@ exports.BaseDocumentModel = Montage.create(Component, { } } }, + //////////////////////////////////////////////////////////////////// + // + handleSaved: { + value: function (result) { + // + if (result.status === 204) { + this.model.needsSave = false; + } + // + if (this.callback) this.callback(result); + } + }, //////////////////////////////////////////////////////////////////// // close: { diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js index c506e186..ade27728 100644 --- a/js/mediators/io-mediator.js +++ b/js/mediators/io-mediator.js @@ -557,6 +557,7 @@ function loadWebGL (e) {\n\ mjslibtag = template.file.content.document.createElement('script'); mjslibtag.setAttribute('type', 'text/javascript'); mjslibtag.setAttribute('src', mjsDirName + '/montage/montage.js'); + mjslibtag.setAttribute('data-package', '.'); mjslibtag.setAttribute('data-mjs-lib', 'true'); if (ninjaWrapper) { template.file.content.document.body.getElementsByTagName('ninja-content')[0].appendChild(mjslibtag); -- cgit v1.2.3 From fdfba499f0b84360b96096fa866a981e96e8756c Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Fri, 18 May 2012 16:35:56 -0700 Subject: fixing the color chip for the document root Signed-off-by: Valerio Virgillito --- js/components/ui/color-chip.reel/color-chip.js | 13 +++++++++++-- js/controllers/document-controller.js | 2 ++ js/controllers/elements/body-controller.js | 2 +- js/document/views/design.js | 5 +++++ js/ninja.reel/ninja.js | 2 +- js/panels/properties.reel/properties.js | 25 +++++++++++++++++++++---- 6 files changed, 41 insertions(+), 8 deletions(-) diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js index 4e64b2e8..630dcd4b 100755 --- a/js/components/ui/color-chip.reel/color-chip.js +++ b/js/components/ui/color-chip.reel/color-chip.js @@ -33,6 +33,11 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { value: {r:0, g:0, b:0, a:1, css:'rgb(0,0,0)', mode:'rgb'} }, + chipBtn: { + serializable: true, + value: null + }, + changeDelegate: { value: function(event) { this.color = event._event.color; @@ -60,7 +65,7 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { this.icon.style.display = "none"; } - this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset}; + this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, nocolor: true, offset: this.offset}; this.application.ninja.colorController.addButton(this.mode, this.chipBtn); } @@ -80,9 +85,13 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { b = colorObj.value.b; a = colorObj.value.a; css = colorObj.css; + this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css}); + } else { + mode = "nocolor"; + this.chipBtn.color(mode, null); + } - this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css}); this.chipBtn.addEventListener("change", this, false); } } diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js index f1523d87..7721d32d 100755 --- a/js/controllers/document-controller.js +++ b/js/controllers/document-controller.js @@ -489,6 +489,8 @@ var DocumentController = exports.DocumentController = Montage.create(Component, if(currentDocument) { currentDocument.serializeDocument(); + this.application.ninja.selectionController._selectionContainer = null; + currentDocument.model.views.design.propertiesPanel.clear(); currentDocument.model.views.design.hide(); } diff --git a/js/controllers/elements/body-controller.js b/js/controllers/elements/body-controller.js index 5c23dcf7..7a3a66f5 100755 --- a/js/controllers/elements/body-controller.js +++ b/js/controllers/elements/body-controller.js @@ -30,7 +30,7 @@ exports.BodyController = Montage.create(ElementController, { value: function(el, p) { switch(p) { case "background" : - return this.application.ninja.colorController.getColorObjFromCss(this.application.ninja.stylesController.getElementStyle(el, "background-color", true, true)); + return this.application.ninja.colorController.getColorObjFromCss(this.application.ninja.stylesController.getElementStyle(el, "background-color", false, true)); case "border": return 0; case "height": diff --git a/js/document/views/design.js b/js/document/views/design.js index 2ccb82d1..44f1a5e8 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js @@ -64,6 +64,11 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { }, //////////////////////////////////////////////////////////////////// // + propertiesPanel: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // initialize: { value: function (parent) { //Creating iFrame for view diff --git a/js/ninja.reel/ninja.js b/js/ninja.reel/ninja.js index 6d41cd53..80d1b406 100755 --- a/js/ninja.reel/ninja.js +++ b/js/ninja.reel/ninja.js @@ -280,7 +280,7 @@ exports.Ninja = Montage.create(Component, { this.currentDocument = event.detail; if(this.currentDocument.documentRoot) { - this.application.ninja.currentSelectedContainer = this.currentDocument.documentRoot; + this.currentSelectedContainer = this.currentDocument.documentRoot; } else { alert("The current document has not loaded yet"); return; diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js index 4d048472..eb362796 100755 --- a/js/panels/properties.reel/properties.js +++ b/js/panels/properties.reel/properties.js @@ -46,7 +46,7 @@ exports.Properties = Montage.create(Component, { prepareForDraw: { value : function() { - + this.eventManager.addEventListener("openDocument", this, false); this.eventManager.addEventListener("selectionChange", this, false); // This will be a toggle option @@ -54,8 +54,6 @@ exports.Properties = Montage.create(Component, { this.eventManager.addEventListener( "elementChanging", this, false); } - this.eventManager.addEventListener("openDocument", this, false); - this.elementId.element.addEventListener("blur", this, false); this.elementId.element.addEventListener("focus", this, false); this.elementId.element.addEventListener("keyup", this, false); @@ -70,6 +68,9 @@ exports.Properties = Montage.create(Component, { value: function() { this.eventManager.addEventListener( "elementChange", this, false); + // Save a reference of the pi inside the document view to be able to clear + this.application.ninja.currentDocument.model.views.design.propertiesPanel = this; + // Display the default document root PI this.displayElementProperties(this.application.ninja.currentDocument.documentRoot); } @@ -165,6 +166,15 @@ exports.Properties = Montage.create(Component, { } }, + clear: { + value: function() { + this.elementName.value = ""; + this.elementId.value = ""; + this.elementClass.value = ""; + this.customPi = null; + } + }, + displayElementProperties: { value: function (el) { var customPI, currentValue, isRoot = this.application.ninja.selectionController.isDocument; @@ -210,9 +220,16 @@ exports.Properties = Montage.create(Component, { this.displayCustomProperties(el, el.elementModel.pi); } + // Root element color chip if(isRoot) { var backgroundChip = this.customSections[0].content.controls["background"]; - if(backgroundChip) backgroundChip.color = ElementsMediator.getProperty(el, "background"); + var rootBackgroundColor = ElementsMediator.getProperty(el, "background"); + + if(rootBackgroundColor) { + backgroundChip.color = rootBackgroundColor; + } else { + backgroundChip.color = null; + } } var previousInput = this.application.ninja.colorController.colorModel.input; -- cgit v1.2.3