- - + +

\ No newline at end of file diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js index 7d55b20f..7a905fc6 100644 --- a/js/mediators/io-mediator.js +++ b/js/mediators/io-mediator.js @@ -84,6 +84,7 @@ exports.IoMediator = Montage.create(Component, { // content = content.replace(/Dimensions@@@/gi, "Dimensions@@@"+template.id); content = content.replace(/ninja-banner {}/gi, "ninja-banner {overflow: visible; width: "+dimensions.width+"; height: "+dimensions.height+"}"); + content = content.replace(/ninja-content-wrapper {}/gi, "ninja-content-wrapper {overflow: hidden; width: "+dimensions.width+"; height: "+dimensions.height+"}"); } // return content; -- cgit v1.2.3 From 7ad96123fcc61f613c199faa3b98bff5d352ceee Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 14 May 2012 17:17:17 -0700 Subject: userContentLeft and userContentTop need to set scroll offsets for 0 also. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage-deps.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/stage/stage-deps.js b/js/stage/stage-deps.js index a71b77be..33ba2359 100755 --- a/js/stage/stage-deps.js +++ b/js/stage/stage-deps.js @@ -52,7 +52,7 @@ exports.StageDeps = Montage.create(Component, { userContentLeft: { get: function() { return this._userContentLeft; }, set: function(value) { - if(value) { + if(value != null) { viewUtils.setUserContentLeft(value); } } @@ -65,7 +65,7 @@ exports.StageDeps = Montage.create(Component, { userContentTop: { get: function() { return this._userContentTop; }, set: function(value) { - if(value) { + if(value != null) { viewUtils.setUserContentTop(value); } } -- cgit v1.2.3 From 8f8eb57f4506987942745c3325492e939ed3caa8 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Mon, 14 May 2012 17:27:32 -0700 Subject: fixing the body pi Signed-off-by: Valerio Virgillito --- js/data/pi/pi-data.js | 18 +-- js/panels/properties.reel/properties.js | 155 +++++---------------- .../position-and-size.reel/position-and-size.html | 30 ++-- .../position-and-size.reel/position-and-size.js | 12 ++ 4 files changed, 54 insertions(+), 161 deletions(-) (limited to 'js') diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js index d1dc9f34..157cbc64 100755 --- a/js/data/pi/pi-data.js +++ b/js/data/pi/pi-data.js @@ -10,20 +10,6 @@ var Montage = require("montage/core/core").Montage, exports.PiData = Montage.create( Montage, { bodyPi: { - value: [ - { - label: "Style", - - Section: [ - [ - - ] - ] - } - ] - }, - - stagePi: { value: [ { label: "Style", @@ -31,8 +17,8 @@ exports.PiData = Montage.create( Montage, { Section: [ [ { - type : "chip", - id : "background", + type: "chip", + id: "background", prop: "background" } ] diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js index 20f670d9..837e74bc 100755 --- a/js/panels/properties.reel/properties.js +++ b/js/panels/properties.reel/properties.js @@ -67,15 +67,11 @@ exports.Properties = Montage.create(Component, { } }, - // Document is opened - Display the current selection handleOpenDocument: { value: function() { - this.eventManager.addEventListener( "elementChange", this, false); - // For now always assume that the stage is selected by default when opening the old template - // TODO: Remove marker for old template: NINJA-STAGE-REWORK - + // Display the default document root PI this.displayElementProperties(this.application.ninja.currentDocument.documentRoot); } }, @@ -156,7 +152,7 @@ exports.Properties = Montage.create(Component, { this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left")); this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top")); this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height")); - this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width")); + this.positionSize.widthSize = ElementsMediator.getProperty(el, "width"); if(this.threeD.inGlobalMode) { this.threeD.x3D = ElementsMediator.get3DProperty(el, "x3D"); @@ -173,8 +169,6 @@ exports.Properties = Montage.create(Component, { handleSelectionChange: { value: function(event) { if(event.detail.isDocument) { -// if(this.application.ninja.currentDocument.documentRoot.nodeName.toLowerCase() === "body") return; -// this.displayStageProperties(); this.displayElementProperties(this.application.ninja.currentDocument.documentRoot); } else { if(this.application.ninja.selectedElements.length === 1) { @@ -187,98 +181,23 @@ exports.Properties = Montage.create(Component, { } }, - displayStageProperties: { - value: function() { - var stage = this.application.ninja.currentDocument.documentRoot; - //this is test code please remove - this.elementName.value = "Stage"; - this.elementId.value = stage.elementModel.id; - this.elementClass.value = ""; - - this.positionSize.disablePosition = true; - this.threeD.disableTranslation = true; - - this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(stage, "height")); - this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(stage, "width")); - - if(this.threeD.inGlobalMode) - { - this.threeD.xAngle = ElementsMediator.get3DProperty(stage, "xAngle"); - this.threeD.yAngle = ElementsMediator.get3DProperty(stage, "yAngle"); - this.threeD.zAngle = ElementsMediator.get3DProperty(stage, "zAngle"); - } - - this.threeD.flatten = ElementsMediator.getProperty(stage, "-webkit-transform-style") !== "preserve-3d"; - - if(this.customPi !== stage.elementModel.pi) { - // We need to unregister color chips from the previous selection from the Color Model - var len = this.customSections.length; - for(var n = 0, controls; n < len; n++) { - controls = this.customSections[n].content.controls; - if(controls["colorSelect"]) { - controls["colorSelect"].destroy(); - } else if(controls["stageBackground"]) { - controls["stageBackground"].destroy(); - } - } - - this.customPi = stage.elementModel.pi; - this.displayCustomProperties(stage, stage.elementModel.pi); - } - - // For now hardcode the background since it is the only custom property - // No need to loop through all the properties. - var backgroundChip = this.customSections[0].content.controls["background"]; - backgroundChip.color = ElementsMediator.getProperty(stage, "background"); - - /* - var customPI = PiData[this.customPi]; - // Get all the custom section for the custom PI - for(var i = 0, customSec; customSec = customPI[i]; i++) { - - // Now set the Fields for the custom PI - for(var j = 0, fields; fields = customSec.Section[j]; j++) { - for(var k = 0, control; control = fields[k]; k++) { - - var colorChipEl = this.customSections[i].content.controls[control.id]; - this.foo = colorChipEl; - colorChipEl.addEventListener("firstDraw", this, false); - - } - } - } - */ - } - }, - - handleFirstDraw: { - value: function() { - this.foo.chipBtn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 0, b: 0}, css: 'rgb(255,0,0)'}); - } - }, - displayElementProperties: { value: function (el) { - var customPI, - currentValue; + var customPI, currentValue, isRoot = this.application.ninja.selectionController.isDocument; this.elementName.value = el.elementModel.selection; this.elementId.value = el.getAttribute("id") || ""; this.elementClass.value = el.getAttribute("class"); - this.positionSize.disablePosition = false; - this.threeD.disableTranslation = false; + this.positionSize.disablePosition = isRoot; + this.threeD.disableTranslation = isRoot; + this.threeD.flatten = ElementsMediator.getProperty(el, "-webkit-transform-style") !== "preserve-3d"; this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left")); this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top")); this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height")); this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width")); - - if(ElementsMediator.getProperty(el, "-webkit-transform-style") === "preserve-3d") { - this.threeD.flatten = false; - } else { - this.threeD.flatten = true; - } +// this.positionSize.widthSize = ElementsMediator.getProperty(el, "width"); if(this.threeD.inGlobalMode) { @@ -306,6 +225,12 @@ exports.Properties = Montage.create(Component, { this.customPi = el.elementModel.pi; this.displayCustomProperties(el, el.elementModel.pi); } + + if(isRoot) { + var backgroundChip = this.customSections[0].content.controls["background"]; + backgroundChip.color = ElementsMediator.getProperty(el, "background"); + } + var previousInput = this.application.ninja.colorController.colorModel.input; customPI = PiData[this.customPi]; // Get all the custom section for the custom PI @@ -317,64 +242,47 @@ exports.Properties = Montage.create(Component, { if(control.type !== "color") { currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator); - if(currentValue === null) - { + if(currentValue === null) { currentValue = control.defaultValue; } this.customSections[i].content.controls[control.id] = currentValue; - } - else - { - if(control.prop === "border") - { + } else { + if(control.prop === "border") { // TODO - For now, always return the top border if multiple border sides currentValue = ElementsMediator.getColor(el, false, "top"); this.application.ninja.colorController.colorModel.input = "stroke"; - } - else if(control.prop === "background") - { + } else if(control.prop === "background") { currentValue = ElementsMediator.getColor(el, true); this.application.ninja.colorController.colorModel.input = "fill"; } - if(currentValue) - { - if(currentValue.color) - { + if(currentValue) { + if(currentValue.color) { currentValue.color.wasSetByCode = true; currentValue.color.type = "change"; } - if(currentValue.mode === "gradient") - { - this.application.ninja.colorController.colorModel["gradient"] = - {value: currentValue.color, wasSetByCode: true, type: 'change'}; - } - else - { - if (currentValue.color.a !== undefined) - { - this.application.ninja.colorController.colorModel.alpha = - {value: currentValue.color.a, wasSetByCode: true, type: 'change'}; + if(currentValue.mode === "gradient") { + this.application.ninja.colorController.colorModel["gradient"] = {value: currentValue.color, wasSetByCode: true, type: 'change'}; + } else { + if (currentValue.color.a !== undefined) { + this.application.ninja.colorController.colorModel.alpha = {value: currentValue.color.a, wasSetByCode: true, type: 'change'}; } - if(currentValue.color.mode) - { + + if(currentValue.color.mode) { this.application.ninja.colorController.colorModel[currentValue.color.mode] = currentValue.color; - } - else - { + } else { this.application.ninja.colorController.colorModel["rgb"] = currentValue.color; } } - } - else - { + } else { this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; this.application.ninja.colorController.colorModel.applyNoColor(); } } } } + this.application.ninja.colorController.colorModel.input = previousInput; var color = this.application.ninja.colorController.colorModel.colorHistory[previousInput][this.application.ninja.colorController.colorModel.colorHistory[previousInput].length-1]; color.c.wasSetByCode = true; @@ -409,6 +317,8 @@ exports.Properties = Montage.create(Component, { displayGroupProperties: { value: function (els) { this.elementName.value = "Multiple Elements"; + this.elementId.value = ""; + this.elementClass.value = ""; } }, @@ -457,10 +367,7 @@ exports.Properties = Montage.create(Component, { value: function(e) { if(e.wasSetByCode) return; -// ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Changing", "pi"); ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [e.value + "px"], "Changing", "pi"); - - } } diff --git a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html index a7aac84e..75cb2944 100755 --- a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html +++ b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html @@ -23,6 +23,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "bindButton": {"@": "bindButton"} } }, + "PosX": { "prototype": "js/components/hottextunit.reel[HotTextUnit]", "properties": { @@ -31,11 +32,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "minValue": -10000 }, "bindings": { - "value": { - "boundObject": {"@": "owner"}, - "boundObjectPropertyPath": "leftPosition", - "oneway": false - } + "value": {"<<->": "@owner.leftPosition"} } }, "PosY": { @@ -46,11 +43,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "minValue": -10000 }, "bindings": { - "value": { - "boundObject": {"@": "owner"}, - "boundObjectPropertyPath": "topPosition", - "oneway": false - } + "value": {"<<->": "@owner.topPosition"} } }, "PosH": { @@ -59,25 +52,20 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "element": {"#": "PosH"} }, "bindings": { - "value": { - "boundObject": {"@": "owner"}, - "boundObjectPropertyPath": "heightSize", - "oneway": false - } + "value": {"<<->": "@owner.heightSize"} } }, "PosW": { "prototype": "js/components/hottextunit.reel[HotTextUnit]", "properties": { - "element": {"#": "PosW"} + "element": {"#": "PosW"}, + "acceptableUnits" : ["px", "%"], + "units": "px" }, "bindings": { - "value": { - "boundObject": {"@": "owner"}, - "boundObjectPropertyPath": "widthSize", - "oneway": false - } + "value": {"<<->": "@owner.widthSize"} } + }, "bindButton": { "prototype": "montage/ui/toggle-button.reel", diff --git a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js index 1e47916f..8842558b 100755 --- a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js +++ b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js @@ -23,7 +23,19 @@ exports.PosSize = Montage.create(Component, { widthSize: { value: 0 }, +/* + widthSize: { + get: function() { return this._widthSize;}, + set: function(value) { + this._widthSize = parseInt(value); + this.widthUnit = value; + } + }, + widthUnit: { + value: "px" + }, +*/ savedPosition: { value: null }, -- cgit v1.2.3 From 5df0e78f2eced2fd04a531652f61c42261d97636 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Mon, 14 May 2012 17:29:57 -0700 Subject: reverting a pi width change Signed-off-by: Valerio Virgillito --- js/panels/properties.reel/properties.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js') diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js index 837e74bc..3ec48687 100755 --- a/js/panels/properties.reel/properties.js +++ b/js/panels/properties.reel/properties.js @@ -152,7 +152,7 @@ exports.Properties = Montage.create(Component, { this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left")); this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top")); this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height")); - this.positionSize.widthSize = ElementsMediator.getProperty(el, "width"); + this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width")); if(this.threeD.inGlobalMode) { this.threeD.x3D = ElementsMediator.get3DProperty(el, "x3D"); -- cgit v1.2.3 From 77c0f0b369d431f6824906c91753b934f749c5d8 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 15 May 2012 11:15:27 -0700 Subject: Finalizing open for new banner templates Moving to implement save. --- js/document/views/design.js | 25 ++++++++++++++++++------- 1 file changed, 18 insertions(+), 7 deletions(-) (limited to 'js') diff --git a/js/document/views/design.js b/js/document/views/design.js index 4c91ff39..48c91aad 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js @@ -160,16 +160,23 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { value: function (e) { //Getting first element in DOM (assumes it's root) //TODO: Ensure wrapper logic is proper - var banner = this._bodyFragment.getElementsByTagName('*')[2], - ninjaBanner = this.document.body.getElementsByTagName('ninja-content')[0]; - //Copying attributes to maintain same properties as the banner root + var wrapper = this._bodyFragment.getElementsByTagName('*')[1], + banner = this._bodyFragment.getElementsByTagName('*')[2], + ninjaBanner = this.document.body.getElementsByTagName('ninja-content')[0], + ninjaWrapper = this.document.body.getElementsByTagName('ninja-viewport')[0]; + //Copying attributes to maintain same properties as the banner wrapper + for (var n in wrapper.attributes) { + if (wrapper.attributes[n].value) { + ninjaWrapper.setAttribute(wrapper.attributes[n].name, wrapper.attributes[n].value); + } + } + //Copying attributes to maintain same properties as the banner content for (var n in banner.attributes) { if (banner.attributes[n].value) { ninjaBanner.setAttribute(banner.attributes[n].name, banner.attributes[n].value); } } //Adjusting margin per size of document - //this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-banner {overflow: visible !important; margin-top: -'+Math.floor(this._template.size.height/2)+'px; margin-left: -'+Math.floor(this._template.size.width/2)+'px}'; this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-content {overflow: visible !important;} ninja-content, ninja-viewport {width: ' + this._template.size.width + 'px; height: ' + this._template.size.height + 'px;}'; //Setting content in template ninjaBanner.innerHTML = banner.innerHTML; @@ -204,7 +211,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { //Removing event, only needed on initial load this._observer.body.disconnect(); this._observer.body = null; - //Removing loading container + //Removing loading container (should be removed) this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]); //Getting style and link tags in document var stags = this.document.getElementsByTagName('style'), @@ -218,8 +225,12 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { for (i = 0; i < ltags.length; i++) { // if (ltags[i].href) { - //TODO: Verify this works for tags in body as well (working in head) - this.document.head.insertBefore(this.getStyleTagFromCssFile(ltags[i]), ltags[i]) || this.document.body.insertBefore(this.getStyleTagFromCssFile(ltags[i]), ltags[i]); + //Inseting + +