aboutsummaryrefslogtreecommitdiff
path: root/js/panels/properties/sections/position-and-size.reel/position-and-size.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/properties/sections/position-and-size.reel/position-and-size.js')
-rw-r--r--js/panels/properties/sections/position-and-size.reel/position-and-size.js89
1 files changed, 75 insertions, 14 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..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
@@ -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,17 @@ 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
153 var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value);
154
155 if(!isFinite(newWidth)) newWidth = this.heightControl.value;
156
157 this.widthControl.value = newWidth;
158 this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Change", "pi");
159 }
160
124 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); 161 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition);
125 this.savedPosition = null; 162 this.savedPosition = null;
126 } 163 }
@@ -135,9 +172,23 @@ exports.PosSize = Montage.create(Component, {
135 if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; 172 if(this.savedPosition) prevPosition = [this.savedPosition + "px"];
136 173
137 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; 174 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
175
176 if(this.bindButton.value) {
177
178 var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value);
179
180 if(!isFinite(newHeight)) newHeight = this.widthControl.value;
181
182 this.heightControl.value = newHeight;
183 this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Change", "pi");
184
185 }
186
138 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); 187 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition);
139 this.savedPosition = null; 188 this.savedPosition = null;
189
140 } 190 }
191
141 } 192 }
142 }, 193 },
143 194
@@ -166,24 +217,22 @@ exports.PosSize = Montage.create(Component, {
166 var items; 217 var items;
167 if(!event.wasSetByCode) { 218 if(!event.wasSetByCode) {
168 219
220 if(!this.savedPosition) this.savedPosition = this.heightSize;
221
222 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
223
169 if(this.bindButton.value) { 224 if(this.bindButton.value) {
170 if(!this.savedPosition) this.savedPosition = this.heightSize;
171 var delta = this.heightControl.value - this.savedPosition;
172 225
173 var hwRatio = Math.round(Math.round(this.widthControl.value / this.savedPosition * 10) / 10); 226 var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value);
174 var newWidth = this.widthControl.value + hwRatio * delta; 227
228 if(!isFinite(newWidth)) newWidth = this.heightControl.value;
175 229
176 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
177 this.widthControl.value = newWidth; 230 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"); 231 this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Changing", "pi");
180 } else { 232 }
181 233
182 if(!this.savedPosition) this.savedPosition = this.heightSize; 234 this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Changing", "pi");
183 235
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 } 236 }
188 } 237 }
189 }, 238 },
@@ -192,8 +241,20 @@ exports.PosSize = Montage.create(Component, {
192 value: function(event) { 241 value: function(event) {
193 var items; 242 var items;
194 if(!event.wasSetByCode) { 243 if(!event.wasSetByCode) {
244
195 if(!this.savedPosition) this.savedPosition = this.widthSize; 245 if(!this.savedPosition) this.savedPosition = this.widthSize;
246
196 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; 247 this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot];
248
249 if(this.bindButton.value) {
250 var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value);
251
252 if(!isFinite(newHeight)) newHeight = this.widthControl.value;
253
254 this.heightControl.value = newHeight;
255 this.application.ninja.elementMediator.setProperty(items, "height", [newHeight + "px"] , "Changing", "pi");
256 }
257
197 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Changing", "pi"); 258 this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Changing", "pi");
198 } 259 }
199 } 260 }