aboutsummaryrefslogtreecommitdiff
path: root/js/panels/properties/sections
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/properties/sections')
-rw-r--r--js/panels/properties/sections/position-and-size.reel/position-and-size.js94
1 files 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, {
28 value: null 28 value: null
29 }, 29 },
30 30
31 aspectRatioWidth: {
32 value: null
33 },
34
35 aspectRatioHeight: {
36 value: null
37 },
38
31 _disablePosition: { 39 _disablePosition: {
32 value: true 40 value: true
33 }, 41 },
@@ -62,9 +70,8 @@ exports.PosSize = Montage.create(Component, {
62 this.widthControl.addEventListener("change", this, false); 70 this.widthControl.addEventListener("change", this, false);
63 this.widthControl.addEventListener("changing", this, false); 71 this.widthControl.addEventListener("changing", this, false);
64 72
65 73 this.bindButton.identifier = "ratio";
66 //this._controlList[0].control.addEventListener("action", this._handleStageEvent.bind(this), false); 74 this.bindButton.addEventListener("action", this, false);
67 //PropertiesPanelModule.PropertiesPanelBase.PIControlList["stageWidthHeightLock"] = this._controlList[0].control;
68 75
69 } 76 }
70 }, 77 },
@@ -87,6 +94,25 @@ exports.PosSize = Montage.create(Component, {
87 } 94 }
88 }, 95 },
89 96
97 /**
98 * Calculate the current aspect ration when the bind button is pressed.
99 * If one of the values is 0, then use 1:1 as the ratio;
100 */
101 handleRatioAction: {
102 value: function() {
103 if(this.bindButton.value) {
104 this.aspectRatioWidth = this.heightControl.value / this.widthControl.value;
105 if(isNaN(this.aspectRatioWidth) || !isFinite(this.aspectRatioWidth) || this.aspectRatioWidth === 0) this.aspectRatioWidth = 1;
106
107 this.aspectRatioHeight = this.widthControl.value / this.heightControl.value;
108 if(isNaN(this.aspectRatioHeight) || !isFinite(this.aspectRatioHeight) || this.aspectRatioHeight === 0) this.aspectRatioHeight = 1;
109 } else {
110 this.aspectRatioWidth = 1;
111 this.aspectRatioHeight = 1;
112 }
113 }
114 },
115
90 handleLeftChange: { 116 handleLeftChange: {
91 value: function(event) { 117 value: function(event) {
92 var prevPosition; 118 var prevPosition;
@@ -121,6 +147,16 @@ exports.PosSize = Montage.create(Component, {
121 if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; 147 if(this.savedPosition) prevPosition = [this.savedPosition + "px"];
122 148
123 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; 149 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
150
151 if(this.bindButton.value) {
152 var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value);
153
154 if(!isFinite(newWidth)) newWidth = this.heightControl.value;
155
156 this.widthControl.value = newWidth;
157 this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Change", "pi");
158 }
159
124 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); 160 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition);
125 this.savedPosition = null; 161 this.savedPosition = null;
126 } 162 }
@@ -135,9 +171,25 @@ exports.PosSize = Montage.create(Component, {
135 if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; 171 if(this.savedPosition) prevPosition = [this.savedPosition + "px"];
136 172
137 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; 173 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
138 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); 174
139 this.savedPosition = null; 175 if(this.bindButton.value) {
176
177 var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value);
178
179 if(!isFinite(newHeight)) newHeight = this.widthControl.value;
180
181 this.heightControl.value = newHeight;
182 this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Change", "pi");
183
184 } else {
185
186 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition);
187 this.savedPosition = null;
188 }
189
190
140 } 191 }
192
141 } 193 }
142 }, 194 },
143 195
@@ -166,24 +218,22 @@ exports.PosSize = Montage.create(Component, {
166 var items; 218 var items;
167 if(!event.wasSetByCode) { 219 if(!event.wasSetByCode) {
168 220
221 if(!this.savedPosition) this.savedPosition = this.heightSize;
222
223 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
224
169 if(this.bindButton.value) { 225 if(this.bindButton.value) {
170 if(!this.savedPosition) this.savedPosition = this.heightSize;
171 var delta = this.heightControl.value - this.savedPosition;
172 226
173 var hwRatio = Math.round(Math.round(this.widthControl.value / this.savedPosition * 10) / 10); 227 var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value);
174 var newWidth = this.widthControl.value + hwRatio * delta; 228
229 if(!isFinite(newWidth)) newWidth = this.heightControl.value;
175 230
176 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
177 this.widthControl.value = newWidth; 231 this.widthControl.value = newWidth;
178 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi");
179 this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Changing", "pi"); 232 this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Changing", "pi");
180 } else { 233 }
181 234
182 if(!this.savedPosition) this.savedPosition = this.heightSize; 235 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi");
183 236
184 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
185 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi");
186 }
187 } 237 }
188 } 238 }
189 }, 239 },
@@ -192,8 +242,20 @@ exports.PosSize = Montage.create(Component, {
192 value: function(event) { 242 value: function(event) {
193 var items; 243 var items;
194 if(!event.wasSetByCode) { 244 if(!event.wasSetByCode) {
245
195 if(!this.savedPosition) this.savedPosition = this.widthSize; 246 if(!this.savedPosition) this.savedPosition = this.widthSize;
247
196 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; 248 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
249
250 if(this.bindButton.value) {
251 var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value);
252
253 if(!isFinite(newHeight)) newHeight = this.widthControl.value;
254
255 this.heightControl.value = newHeight;
256 this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Changing", "pi");
257 }
258
197 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Changing", "pi"); 259 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Changing", "pi");
198 } 260 }
199 } 261 }