diff options
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.js | 203 |
1 files changed, 203 insertions, 0 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 new file mode 100644 index 00000000..43f08fcf --- /dev/null +++ b/js/panels/properties/sections/position-and-size.reel/position-and-size.js | |||
@@ -0,0 +1,203 @@ | |||
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 | _disablePosition: { | ||
32 | value: true | ||
33 | }, | ||
34 | |||
35 | disablePosition: { | ||
36 | get: function () { | ||
37 | return this._disablePosition; | ||
38 | }, | ||
39 | set: function (value) { | ||
40 | if(value !== this._disablePosition) { | ||
41 | this._disablePosition = value; | ||
42 | this.needsDraw = true; | ||
43 | } | ||
44 | } | ||
45 | }, | ||
46 | |||
47 | prepareForDraw: { | ||
48 | value: function() { | ||
49 | this.leftControl.identifier = "left"; | ||
50 | this.leftControl.addEventListener("change", this, false); | ||
51 | this.leftControl.addEventListener("changing", this, false); | ||
52 | |||
53 | this.topControl.identifier = "top"; | ||
54 | this.topControl.addEventListener("change", this, false); | ||
55 | this.topControl.addEventListener("changing", this, false); | ||
56 | |||
57 | this.heightControl.identifier = "height"; | ||
58 | this.heightControl.addEventListener("change", this, false); | ||
59 | this.heightControl.addEventListener("changing", this, false); | ||
60 | |||
61 | this.widthControl.identifier = "width"; | ||
62 | this.widthControl.addEventListener("change", this, false); | ||
63 | this.widthControl.addEventListener("changing", this, false); | ||
64 | |||
65 | |||
66 | //this._controlList[0].control.addEventListener("action", this._handleStageEvent.bind(this), false); | ||
67 | //PropertiesPanelModule.PropertiesPanelBase.PIControlList["stageWidthHeightLock"] = this._controlList[0].control; | ||
68 | |||
69 | } | ||
70 | }, | ||
71 | |||
72 | draw: { | ||
73 | value: function() { | ||
74 | if(this._disablePosition) { | ||
75 | this.leftPosition = 0; | ||
76 | this.leftControl.enabled = false; | ||
77 | this.topPosition = 0; | ||
78 | this.topControl.enabled = false; | ||
79 | this.leftLabel.classList.add("disabled"); | ||
80 | this.topLabel.classList.add("disabled"); | ||
81 | } else { | ||
82 | this.leftControl.enabled = true; | ||
83 | this.topControl.enabled = true; | ||
84 | this.leftLabel.classList.remove("disabled"); | ||
85 | this.topLabel.classList.remove("disabled"); | ||
86 | } | ||
87 | } | ||
88 | }, | ||
89 | |||
90 | handleLeftChange: { | ||
91 | value: function(event) { | ||
92 | var prevPosition; | ||
93 | |||
94 | if(!event.wasSetByCode) { | ||
95 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
96 | |||
97 | this.application.ninja.elementMediator.setProperty(this.application.ninja.selectedElements, "left", [this.leftControl.value + "px"] , "Change", "pi", prevPosition); | ||
98 | this.savedPosition = null; | ||
99 | } | ||
100 | } | ||
101 | }, | ||
102 | |||
103 | handleTopChange: { | ||
104 | value: function(event) { | ||
105 | var prevPosition; | ||
106 | |||
107 | if(!event.wasSetByCode) { | ||
108 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
109 | |||
110 | this.application.ninja.elementMediator.setProperty(this.application.ninja.selectedElements, "top", [this.topControl.value + "px"] , "Change", "pi", prevPosition); | ||
111 | this.savedPosition = null; | ||
112 | } | ||
113 | } | ||
114 | }, | ||
115 | |||
116 | handleHeightChange: { | ||
117 | value: function(event) { | ||
118 | var prevPosition, items; | ||
119 | |||
120 | if(!event.wasSetByCode) { | ||
121 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
122 | |||
123 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | ||
124 | this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); | ||
125 | this.savedPosition = null; | ||
126 | } | ||
127 | } | ||
128 | }, | ||
129 | |||
130 | handleWidthChange: { | ||
131 | value: function(event) { | ||
132 | var prevPosition, items; | ||
133 | |||
134 | if(!event.wasSetByCode) { | ||
135 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | ||
136 | |||
137 | 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); | ||
139 | this.savedPosition = null; | ||
140 | } | ||
141 | } | ||
142 | }, | ||
143 | |||
144 | handleLeftChanging: { | ||
145 | value: function(event) { | ||
146 | if(!event.wasSetByCode) { | ||
147 | if(!this.savedPosition) this.savedPosition = this.leftPosition; | ||
148 | this.application.ninja.elementMediator.setProperty(this.application.ninja.selectedElements, "left", [this.leftControl.value + "px"] , "Changing", "pi"); | ||
149 | } | ||
150 | |||
151 | } | ||
152 | }, | ||
153 | |||
154 | handleTopChanging: { | ||
155 | value: function(event) { | ||
156 | if(!event.wasSetByCode) { | ||
157 | if(!this.savedPosition) this.savedPosition = this.topPosition; | ||
158 | this.application.ninja.elementMediator.setProperty(this.application.ninja.selectedElements, "top", [this.topControl.value + "px"] , "Changing", "pi"); | ||
159 | } | ||
160 | |||
161 | } | ||
162 | }, | ||
163 | |||
164 | handleHeightChanging: { | ||
165 | value: function(event) { | ||
166 | var items; | ||
167 | if(!event.wasSetByCode) { | ||
168 | |||
169 | if(this.bindButton.value) { | ||
170 | if(!this.savedPosition) this.savedPosition = this.heightSize; | ||
171 | var delta = this.heightControl.value - this.savedPosition; | ||
172 | |||
173 | var hwRatio = Math.round(Math.round(this.widthControl.value / this.savedPosition * 10) / 10); | ||
174 | var newWidth = this.widthControl.value + hwRatio * delta; | ||
175 | |||
176 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | ||
177 | 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"); | ||
180 | } else { | ||
181 | |||
182 | if(!this.savedPosition) this.savedPosition = this.heightSize; | ||
183 | |||
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 | } | ||
188 | } | ||
189 | }, | ||
190 | |||
191 | handleWidthChanging: { | ||
192 | value: function(event) { | ||
193 | var items; | ||
194 | if(!event.wasSetByCode) { | ||
195 | if(!this.savedPosition) this.savedPosition = this.widthSize; | ||
196 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | ||
197 | this.application.ninja.elementMediator.setProperty(items, "width", [this.widthControl.value + "px"] , "Changing", "pi"); | ||
198 | } | ||
199 | } | ||