aboutsummaryrefslogtreecommitdiff
path: root/js/panels/properties
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/properties')
-rw-r--r--js/panels/properties/content.reel/content.js129
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");