diff options
author | Pushkar Joshi | 2012-03-02 12:24:33 -0800 |
---|---|---|
committer | Pushkar Joshi | 2012-03-02 12:24:33 -0800 |
commit | 4419209a1fd850ab468209b562b66b0242b42a9c (patch) | |
tree | bd7ca04f963f5a3aeb4b3c06db6f187903307d45 /js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js | |
parent | 1b68bb87c458877cb850a96d8a093d6064bc41dc (diff) | |
parent | ff0a956f33df034e9a009cfcb8999e469456a4b5 (diff) | |
download | ninja-4419209a1fd850ab468209b562b66b0242b42a9c.tar.gz |
Merge branch 'master' into brushtool
Diffstat (limited to 'js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js')
-rwxr-xr-x | js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js | 264 |
1 files changed, 264 insertions, 0 deletions
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 new file mode 100755 index 00000000..49117090 --- /dev/null +++ b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js | |||
@@ -0,0 +1,264 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage; | ||
8 | var Component = require("montage/ui/component").Component; | ||
9 | |||
10 | exports.PosSize = Montage.create(Component, { | ||
11 | leftPosition: { | ||
12 | value: 0 | ||
13 | }, | ||
14 | |||
15 | topPosition: { | ||
16 | value: 0 | ||
17 | }, | ||
18 | |||
19 | heightSize: { | ||
20 | value: 0 | ||
21 | }, | ||
22 | |||
23 | widthSize: { | ||
24 | value: 0 | ||
25 | }, | ||
26 | |||
27 | savedPosition: { | ||
28 | value: null | ||
29 | }, | ||
30 | |||
31 | aspectRatioWidth: { | ||
32 | value: null | ||
33 | }, | ||
34 | |||
35 | aspectRatioHeight: { | ||
36 | value: null | ||
37 | }, | ||
38 | |||
39 | _disablePosition: { | ||
40 | value: true | ||
41 | }, | ||
42 | |||
43 | disablePosition: { | ||
44 | get: function () { | ||
45 | return this._disablePosition; | ||
46 | }, | ||
47 | set: function (value) { | ||
48 | if(value !== this._disablePosition) { | ||
49 | this._disablePosition = value; | ||
50 | this.needsDraw = true; | ||
51 | } | ||
52 | } | ||
53 | }, | ||
54 | |||
55 | prepareForDraw: { | ||
56 | value: function() { | ||
57 | this.leftControl.identifier = "left"; | ||
58 | this.leftControl.addEventListener("change", this, false); | ||
59 | this.leftControl.addEventListener("changing", this, false); | ||
60 | |||
61 | this.topControl.identifier = "top"; | ||
62 | this.topControl.addEventListener("change", this, false); | ||
63 | this.topControl.addEventListener("changing", this, false); | ||
64 | |||
65 | this.heightControl.identifier = "height"; | ||
66 | this.heightControl.addEventListener("change", this, false); | ||
67 | this.heightControl.addEventListener("changing", this, false); | ||
68 | |||
69 | this.widthControl.identifier = "width"; | ||
70 | this.widthControl.addEventListener("change", this, false); | ||
71 | this.widthControl.addEventListener("changing", this, false); | ||
72 | |||
73 | this.bindButton.identifier = "ratio"; | ||
74 | this.bindButton.addEventListener("action", this, false); | ||
75 | |||
76 | } | ||
77 | }, | ||
78 | |||
79 | draw: { | ||
80 | value: function() { | ||
81 | if(this._disablePosition) { | ||
82 | this.leftPosition = 0; | ||
83 | this.leftControl.enabled = false; | ||
84 | this.topPosition = 0; | ||
85 | this.topControl.enabled = false; | ||
86 | this.leftLabel.classList.add("disabled"); | ||
87 | this.topLabel.classList.add("disabled"); | ||
88 | } else { | ||
89 | this.leftControl.enabled = true; | ||
90 | this.topControl.enabled = true; | ||
91 | this.leftLabel.classList.remove("disabled"); | ||
92 | this.topLabel.classList.remove("disabled"); | ||
93 | } | ||
94 | } | ||
95 | }, | ||
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 | |||
116 | handleLeftChange: { | ||
117 | value: function(event) { | ||
118 | var prevPosition; | ||
119 | |||
120 | if(!event.wasSetByCode) { | ||
121 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
122 | |||
123 | this.application.ninja.elementMediator.setProperty(this.application.ninja.selectedElements, "left", [this.leftControl.value + "px"] , "Change", "pi", prevPosition); | ||
124 | this.savedPosition = null; | ||
125 | } | ||
126 | } | ||
127 | }, | ||
128 | |||
129 | handleTopChange: { | ||
130 | value: function(event) { | ||
131 | var prevPosition; | ||
132 | |||
133 | if(!event.wasSetByCode) { | ||
134 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
135 | |||
136 | this.application.ninja.elementMediator.setProperty(this.application.ninja.selectedElements, "top", [this.topControl.value + "px"] , "Change", "pi", prevPosition); | ||
137 | this.savedPosition = null; | ||
138 | } | ||
139 | } | ||
140 | }, | ||
141 | |||
142 | handleHeightChange: { | ||
143 | value: function(event) { | ||
144 | var prevPosition, items; | ||
145 | |||
146 | if(!event.wasSetByCode) { | ||
147 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
148 | |||
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 | |||
161 | this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); | ||
162 | this.savedPosition = null; | ||
163 | } | ||
164 | } | ||
165 | }, | ||
166 | |||
167 | handleWidthChange: { | ||
168 | value: function(event) { | ||
169 | var prevPosition, items; | ||
170 | |||
171 | if(!event.wasSetByCode) { | ||
172 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
173 | |||
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 | |||
187 | this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Change", "pi", prevPosition); | ||
188 | this.savedPosition = null; | ||
189 | |||
190 | } | ||
191 | |||
192 |