From cd997c18bdb346ff44919880239e705df80079ea Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 8 Feb 2012 14:30:56 -0800 Subject: Fix for the PI Lock button. Fixing the following JIRA bugs: 111 Signed-off-by: Valerio Virgillito --- .../position-and-size.reel/position-and-size.js | 94 ++++++++++++++++++---- 1 file changed, 78 insertions(+), 16 deletions(-) diff --git a/js/panels/properties/sections/position-and-size.reel/position-and-size.js b/js/panels/properties/sections/position-and-size.reel/position-and-size.js index 43f08fcf..e539257d 100644 --- a/js/panels/properties/sections/position-and-size.reel/position-and-size.js +++ b/js/panels/properties/sections/position-and-size.reel/position-and-size.js @@ -28,6 +28,14 @@ exports.PosSize = Montage.create(Component, { value: null }, + aspectRatioWidth: { + value: null + }, + + aspectRatioHeight: { + value: null + }, + _disablePosition: { value: true }, @@ -62,9 +70,8 @@ exports.PosSize = Montage.create(Component, { this.widthControl.addEventListener("change", this, false); this.widthControl.addEventListener("changing", this, false); - - //this._controlList[0].control.addEventListener("action", this._handleStageEvent.bind(this), false); - //PropertiesPanelModule.PropertiesPanelBase.PIControlList["stageWidthHeightLock"] = this._controlList[0].control; + this.bindButton.identifier = "ratio"; + this.bindButton.addEventListener("action", this, false); } }, @@ -87,6 +94,25 @@ exports.PosSize = Montage.create(Component, { } }, + /** + * Calculate the current aspect ration when the bind button is pressed. + * If one of the values is 0, then use 1:1 as the ratio; + */ + handleRatioAction: { + value: function() { + if(this.bindButton.value) { + this.aspectRatioWidth = this.heightControl.value / this.widthControl.value; + if(isNaN(this.aspectRatioWidth) || !isFinite(this.aspectRatioWidth) || this.aspectRatioWidth === 0) this.aspectRatioWidth = 1; + + this.aspectRatioHeight = this.widthControl.value / this.heightControl.value; + if(isNaN(this.aspectRatioHeight) || !isFinite(this.aspectRatioHeight) || this.aspectRatioHeight === 0) this.aspectRatioHeight = 1; + } else { + this.aspectRatioWidth = 1; + this.aspectRatioHeight = 1; + } + } + }, + handleLeftChange: { value: function(event) { var prevPosition; @@ -121,6 +147,16 @@ exports.PosSize = Montage.create(Component, { if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; + + if(this.bindButton.value) { + var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value); + + if(!isFinite(newWidth)) newWidth = this.heightControl.value; + + this.widthControl.value = newWidth; + this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Change", "pi"); + } + this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); this.savedPosition = null; } @@ -135,9 +171,25 @@ exports.PosSize = Montage.create(Component, { if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; - this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); - this.savedPosition = null; + + if(this.bindButton.value) { + + var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value); + + if(!isFinite(newHeight)) newHeight = this.widthControl.value; + + this.heightControl.value = newHeight; + this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Change", "pi"); + + } else { + + this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); + this.savedPosition = null; + } + + } + } }, @@ -166,24 +218,22 @@ exports.PosSize = Montage.create(Component, { var items; if(!event.wasSetByCode) { + if(!this.savedPosition) this.savedPosition = this.heightSize; + + this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; + if(this.bindButton.value) { - if(!this.savedPosition) this.savedPosition = this.heightSize; - var delta = this.heightControl.value - this.savedPosition; - var hwRatio = Math.round(Math.round(this.widthControl.value / this.savedPosition * 10) / 10); - var newWidth = this.widthControl.value + hwRatio * delta; + var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value); + + if(!isFinite(newWidth)) newWidth = this.heightControl.value; - this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; this.widthControl.value = newWidth; - this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi"); this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Changing", "pi"); - } else { + } - if(!this.savedPosition) this.savedPosition = this.heightSize; + this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi"); - this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; - this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi"); - } } } }, @@ -192,8 +242,20 @@ exports.PosSize = Montage.create(Component, { value: function(event) { var items; if(!event.wasSetByCode) { + if(!this.savedPosition) this.savedPosition = this.widthSize; + this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; + + if(this.bindButton.value) { + var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value); + + if(!isFinite(newHeight)) newHeight = this.widthControl.value; + + this.heightControl.value = newHeight; + this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Changing", "pi"); + } + this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Changing", "pi"); } } -- cgit v1.2.3 From 3a8dc4195a166478695bb286493f83258a4be49b Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 8 Feb 2012 16:55:10 -0800 Subject: Tree Components - css fixes --- css/ninja.css | 2 +- js/components/treeview/ninja-branch.reel/ninja-branch.css | 11 ++++++----- js/components/treeview/ninja-leaf.reel/ninja-leaf.css | 2 ++ js/components/treeview/treeview.reel/treeview.html | 2 +- 4 files changed, 10 insertions(+), 7 deletions(-) diff --git a/css/ninja.css b/css/ninja.css index 8ce60a10..ba434f42 100644 --- a/css/ninja.css +++ b/css/ninja.css @@ -408,7 +408,7 @@ span.pp-span-all:focus { -webkit-box-shadow: none; background-color: #b4b4b4; bo #pp-container-list li, #pp-container-list span.span-space { background-repeat: no-repeat; } -#pp-container-list li.directory.open > span.pp-span-all > span.pp-col-files > span.span-space { background-image: url("../images/panels/project-panel/icon-file-folderopen.png"); background-position: 100% 0px; } +#pp-container-list li.directory.open > span.pp-span-all > span.pp-col-files > span.span-space, .branch-label { background-image: url("../images/panels/project-panel/icon-file-folderopen.png"); background-position: 100% 0px; } #pp-container-list li.directory.closed > span.pp-span-all > span.pp-col-files > span.span-space { background-image: url("../images/panels/project-panel/icon-file-folderclosed.png"); background-position: 100% 0px; } diff --git a/js/components/treeview/ninja-branch.reel/ninja-branch.css b/js/components/treeview/ninja-branch.reel/ninja-branch.css index 6a458cc7..d8c212e8 100644 --- a/js/components/treeview/ninja-branch.reel/ninja-branch.css +++ b/js/components/treeview/ninja-branch.reel/ninja-branch.css @@ -18,14 +18,15 @@ width: 100%; } .treeRoot .branch .branch-label { - border-bottom: 1px solid #505050; - cursor: pointer; - padding: 3px 0 4px; background-repeat: no-repeat; background-position: 3px 2px; - box-shadow: 0 0 0 0 rgba(0,0,0,0); - font-weight: bold; + border-bottom: 1px solid #505050; box-shadow: 0 3px 4px -4px rgba(0,0,0,0.2); + color: #FFF; + cursor: pointer; + font-weight: bold; + padding: 3px 0 4px; + text-shadow: 1px 1px 0 #000; } /* First Level */ diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css index b2f427b5..085b11e0 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css @@ -19,6 +19,8 @@ /* Second level */ .branch .branch .leaf-label { background-position: 25px center; + box-shadow: 0 3px 4px -4px rgba(0,0,0,0.2); + color: #FFF; padding-left: 45px; } /* Third level */ diff --git a/js/components/treeview/treeview.reel/treeview.html b/js/components/treeview/treeview.reel/treeview.html index d70b016c..4f9e6a72 100644 --- a/js/components/treeview/treeview.reel/treeview.html +++ b/js/components/treeview/treeview.reel/treeview.html @@ -26,7 +26,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "name" : "Branch" }, "defaultLeaf" : { - "module" : "js/components/treeview/presets-leaf.reel", + "module" : "js/components/treeview/leaf.reel", "name" : "Leaf" }, "scrollview": { -- cgit v1.2.3 From 76377d5378c7c23fd3c267fcab91aba39b30c555 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 8 Feb 2012 17:24:46 -0800 Subject: Updating the sass file. Signed-off-by: Valerio Virgillito --- scss/imports/scss/_PanelUI.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scss/imports/scss/_PanelUI.scss b/scss/imports/scss/_PanelUI.scss index 21ada556..ccac99ca 100644 --- a/scss/imports/scss/_PanelUI.scss +++ b/scss/imports/scss/_PanelUI.scss @@ -563,7 +563,7 @@ span.pp-span-all:focus { #pp-container-list span.span-space { background-repeat: no-repeat; } -#pp-container-list li.directory.open > span.pp-span-all > span.pp-col-files > span.span-space { +#pp-container-list li.directory.open > span.pp-span-all > span.pp-col-files > span.span-space, .branch-label { background-image:url("../images/panels/project-panel/icon-file-folderopen.png"); background-position: 100% 0px; } -- cgit v1.2.3 From 88e80d512bdd125e6d604541c291f699bf5df564 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 8 Feb 2012 17:49:02 -0800 Subject: Correcting the PI lock for height which had a bug in the original pull request. Signed-off-by: Valerio Virgillito --- .../sections/position-and-size.reel/position-and-size.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/js/panels/properties/sections/position-and-size.reel/position-and-size.js b/js/panels/properties/sections/position-and-size.reel/position-and-size.js index e539257d..49117090 100644 --- a/js/panels/properties/sections/position-and-size.reel/position-and-size.js +++ b/js/panels/properties/sections/position-and-size.reel/position-and-size.js @@ -149,6 +149,7 @@ exports.PosSize = Montage.create(Component, { this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; if(this.bindButton.value) { + var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value); if(!isFinite(newWidth)) newWidth = this.heightControl.value; @@ -181,12 +182,10 @@ exports.PosSize = Montage.create(Component, { this.heightControl.value = newHeight; this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Change", "pi"); - } else { - - this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); - this.savedPosition = null; } + this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); + this.savedPosition = null; } -- cgit v1.2.3