diff options
author | Nivesh Rajbhandari | 2012-02-03 11:34:53 -0800 |
---|---|---|
committer | Nivesh Rajbhandari | 2012-02-03 11:34:53 -0800 |
commit | 91de8f585e93d1a959c7fe56775df371ce6f50d6 (patch) | |
tree | 1621764c65cf2d0044e31e35b486e8409b31039f /js/panels/properties/content.reel/content.js | |
parent | c203ea7413b5a2b2232d7f8346cd1b9932f2575b (diff) | |
parent | 01efeff045e7196bab37fc60f7030969ad650d6c (diff) | |
download | ninja-91de8f585e93d1a959c7fe56775df371ce6f50d6.tar.gz |
Merge branch 'refs/heads/NiveshColor' into ToolFixes
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
Diffstat (limited to 'js/panels/properties/content.reel/content.js')
-rw-r--r-- | js/panels/properties/content.reel/content.js | 129 |
1 files changed, 43 insertions, 86 deletions
diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js index e2ea1374..20dc308f 100644 --- a/js/panels/properties/content.reel/content.js +++ b/js/panels/properties/content.reel/content.js | |||
@@ -112,9 +112,9 @@ exports.Content = Montage.create(Component, { | |||
112 | this.threeD.xAngle = ElementsMediator.get3DProperty(el, "xAngle"); | 112 | this.threeD.xAngle = ElementsMediator.get3DProperty(el, "xAngle"); |
113 | this.threeD.yAngle = ElementsMediator.get3DProperty(el, "yAngle"); | 113 | this.threeD.yAngle = ElementsMediator.get3DProperty(el, "yAngle"); |
114 | this.threeD.zAngle = ElementsMediator.get3DProperty(el, "zAngle"); | 114 | this.threeD.zAngle = ElementsMediator.get3DProperty(el, "zAngle"); |
115 | } | ||
116 | } | 115 | } |
117 | } | 116 | } |
117 | } | ||
118 | }, | 118 | }, |
119 | 119 | ||
120 | handleSelectionChange: { | 120 | handleSelectionChange: { |
@@ -155,7 +155,8 @@ exports.Content = Montage.create(Component, { | |||
155 | 155 | ||
156 | displayElementProperties: { | 156 | displayElementProperties: { |
157 | value: function (el) { | 157 | value: function (el) { |
158 | var customPI; | 158 | var customPI, |
159 | currentValue; | ||
159 | 160 | ||
160 | this.elementName = el.elementModel.selection; | 161 | this.elementName = el.elementModel.selection; |
161 | this.elementId.value = el.getAttribute("id") || ""; | 162 | this.elementId.value = el.getAttribute("id") || ""; |
@@ -194,90 +195,49 @@ exports.Content = Montage.create(Component, { | |||
194 | for(var j = 0, fields; fields = customSec.Section[j]; j++) { | 195 | for(var j = 0, fields; fields = customSec.Section[j]; j++) { |
195 | for(var k = 0, control; control = fields[k]; k++) { | 196 | for(var k = 0, control; control = fields[k]; k++) { |
196 | 197 | ||
197 | if(control.prop !== "border-color" && control.prop !== "background-color") { | 198 | if(control.type !== "color") { |
198 | var currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator); | 199 | currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator); |
199 | if(currentValue === null) | 200 | currentValue ? currentValue = currentValue : currentValue = control.defaultValue; |
201 | this.customSections[0].content.controls[control.id] = currentValue; | ||
202 | } | ||
203 | else | ||
204 | { | ||
205 | currentValue = ElementsMediator.getColor2(el, control.prop, control.valueMutator); | ||
206 | if(control.prop === "border") | ||
207 | { | ||
208 | this.application.ninja.colorController.colorModel.input = "stroke"; | ||
209 | } | ||
210 | else if(control.prop === "background") | ||
211 | { | ||
212 | this.application.ninja.colorController.colorModel.input = "fill"; | ||
213 | } | ||
214 | |||
215 | if(currentValue) | ||
200 | { | 216 | { |
201 | currentValue = control.defaultValue; | 217 | if(currentValue.mode === "gradient") |
218 | { | ||
219 | this.application.ninja.colorController.colorModel["gradient"] = | ||
220 | {value: currentValue.color, wasSetByCode: true, type: 'change'}; | ||
221 | } | ||
222 | else | ||
223 | { | ||
224 | if (currentValue.color.a !== undefined) | ||
225 | { | ||
226 | this.application.ninja.colorController.colorModel.alpha = | ||
227 | {value: currentValue.color.a, wasSetByCode: true, type: 'change'}; | ||
228 | } | ||
229 | this.application.ninja.colorController.colorModel[currentValue.color.mode] = currentValue.color; | ||
230 | } | ||
231 | } | ||
232 | else | ||
233 | { | ||
234 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
235 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
202 | } | 236 | } |
203 | this.customSections[i].content.controls[control.id] = currentValue; | ||
204 | } | 237 | } |
205 | } | 238 | } |
206 | } | 239 | } |
207 | } | 240 | } |
208 | |||
209 | |||
210 | //TODO: Once logic for color and gradient is established, this needs to be revised | ||
211 | |||
212 | var color, background, backgroundImage, borderColor = ElementsMediator.getProperty(el, "border-color"), borderImage = ElementsMediator.getProperty(el, "border-image"); | ||
213 | this.application.ninja.colorController.colorModel.input = "stroke"; | ||
214 | if(borderColor || borderImage) { | ||
215 | if (borderImage && borderImage !== 'none' && borderImage.indexOf('-webkit') >= 0) { | ||
216 | //Gradient | ||
217 | color = this.application.ninja.colorController.getColorObjFromCss(borderImage); | ||
218 | if (color && color.value) { | ||
219 | this.application.ninja.colorController.colorModel[color.mode] = {value: color.value, wasSetByCode: true, type: 'change'}; | ||
220 | } else { | ||
221 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
222 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
223 | } | ||
224 | } else { | ||
225 | //Solid | ||
226 | color = this.application.ninja.colorController.getColorObjFromCss(borderColor); | ||
227 | if (color && color.value) { | ||
228 | color.value.wasSetByCode = true; | ||
229 | color.value.type = 'change'; | ||
230 | if (color.value.a) { | ||
231 | this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, wasSetByCode: true, type: 'change'}; | ||
232 | } | ||
233 | this.application.ninja.colorController.colorModel[color.mode] = color.value; | ||
234 | } else { | ||
235 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
236 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
237 | } | ||
238 | } | ||
239 | } else { | ||
240 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
241 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
242 | } | ||
243 | // | ||
244 | background = ElementsMediator.getProperty(el, "background-color"); | ||
245 | backgroundImage = ElementsMediator.getProperty(el, "background-image"); | ||
246 | this.application.ninja.colorController.colorModel.input = "fill"; | ||
247 | if(background || backgroundImage) { | ||
248 | if (backgroundImage && backgroundImage !== 'none' && backgroundImage.indexOf('-webkit') >= 0) { | ||
249 | //Gradient | ||
250 | color = this.application.ninja.colorController.getColorObjFromCss(backgroundImage); | ||
251 | if (color && color.value) { | ||
252 | this.application.ninja.colorController.colorModel[color.mode] = {value: color.value, wasSetByCode: true, type: 'change'}; | ||
253 | } else { | ||
254 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
255 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
256 | } | ||
257 | } else { | ||
258 | //Solid | ||
259 | color = this.application.ninja.colorController.getColorObjFromCss(background); | ||
260 | if (color && color.value) { | ||
261 | color.value.wasSetByCode = true; | ||
262 | color.value.type = 'change'; | ||
263 | if (color.value.a) { | ||
264 | this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, wasSetByCode: true, type: 'change'}; | ||
265 | } | ||
266 | this.application.ninja.colorController.colorModel[color.mode] = color.value; | ||
267 | } else { | ||
268 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
269 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
270 | } | ||
271 | } | ||
272 | } else { | ||
273 | this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'}; | ||
274 | this.application.ninja.colorController.colorModel.applyNoColor(); | ||
275 | } | ||
276 | |||
277 | |||
278 | |||
279 | |||
280 | |||
281 | } | 241 | } |
282 | }, | 242 | }, |
283 | 243 | ||
@@ -317,16 +277,12 @@ exports.Content = Montage.create(Component, { | |||
317 | 277 | ||
318 | handlePropertyChange: { | 278 | handlePropertyChange: { |
319 | value: function(e) { | 279 | value: function(e) { |
280 | if(e.wasSetByCode) return; | ||
281 | |||
320 | var newValue; | 282 | var newValue; |
321 | 283 | ||
322 | e.units ? newValue = e.value + e.units : newValue = e.value; | 284 | e.units ? newValue = e.value + e.units : newValue = e.value; |
323 | 285 | ||
324 | if(e.prop === "border-width") {// || e.prop === "border-style") { | ||
325 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Change", "pi"); | ||
326 | } else if(e.prop === "border-style") { | ||
327 | ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-width", [this.customSections[0].content.controls.borderWidth + "px"], "Change", "pi"); | ||
328 | } | ||
329 | |||
330 | ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [newValue], "Change", "pi"); | 286 | ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [newValue], "Change", "pi"); |
331 | 287 | ||
332 | } | 288 | } |
@@ -334,6 +290,7 @@ exports.Content = Montage.create(Component, { | |||
334 | 290 | ||
335 | handlePropertyChanging: { | 291 | handlePropertyChanging: { |
336 | value: function(e) { | 292 | value: function(e) { |
293 | if(e.wasSetByCode) return; | ||
337 | 294 | ||
338 | // ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Changing", "pi"); | 295 | // ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Changing", "pi"); |
339 | ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [e.value + "px"], "Changing", "pi"); | 296 | ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [e.value + "px"], "Changing", "pi"); |