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.js119
1 files changed, 43 insertions, 76 deletions
diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js
index fe6faef8..34c38e70 100644
--- a/js/panels/properties/content.reel/content.js
+++ b/js/panels/properties/content.reel/content.js
@@ -141,7 +141,8 @@ exports.Content = Montage.create(Component, {
141 141
142 displayElementProperties: { 142 displayElementProperties: {
143 value: function (el) { 143 value: function (el) {
144 var customPI; 144 var customPI,
145 currentValue;
145 146
146 this.elementName = el.elementModel.selection; 147 this.elementName = el.elementModel.selection;
147 this.elementId.value = el.getAttribute("id") || ""; 148 this.elementId.value = el.getAttribute("id") || "";
@@ -180,87 +181,50 @@ exports.Content = Montage.create(Component, {
180 for(var j = 0, fields; fields = customSec.Section[j]; j++) { 181 for(var j = 0, fields; fields = customSec.Section[j]; j++) {
181 for(var k = 0, control; control = fields[k]; k++) { 182 for(var k = 0, control; control = fields[k]; k++) {
182 183
183 if(control.prop !== "border-color" && control.prop !== "background-color") { 184 if(control.type !== "color") {
184 var currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator); 185 currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator);
185 currentValue ? currentValue = currentValue : currentValue = control.defaultValue; 186 currentValue ? currentValue = currentValue : currentValue = control.defaultValue;
186 this.customSections[0].content.controls[control.id] = currentValue; 187 this.customSections[0].content.controls[control.id] = currentValue;
187 } 188 }
189 else
190 {
191 currentValue = ElementsMediator.getColor2(el, control.prop, control.valueMutator);
192 if(control.prop === "border")
193 {
194 this.application.ninja.colorController.colorModel.input = "stroke";
195 }
196 else if(control.prop === "background")
197 {
198 this.application.ninja.colorController.colorModel.input = "fill";
199 }
200
201 debugger;
202 if(currentValue)
203 {
204 if(currentValue.mode === "gradient")
205 {
206 this.application.ninja.colorController.colorModel["gradient"] =
207 {value: currentValue.color, wasSetByCode: true, type: 'change'};
208 }
209 else
210 {
211 if (currentValue.color.a !== undefined)
212 {
213 this.application.ninja.colorController.colorModel.alpha =
214 {value: currentValue.color.a, wasSetByCode: true, type: 'change'};
215 }
216 this.application.ninja.colorController.colorModel[currentValue.color.mode] = currentValue.color;
217 }
218 }
219 else
220 {
221 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
222 this.application.ninja.colorController.colorModel.applyNoColor();
223 }
224 }
188 } 225 }
189 } 226 }
190 } 227 }
191
192
193 //TODO: Once logic for color and gradient is established, this needs to be revised
194
195 var color, background, backgroundImage, borderColor = ElementsMediator.getProperty(el, "border-color"), borderImage = ElementsMediator.getProperty(el, "border-image");
196 this.application.ninja.colorController.colorModel.input = "stroke";
197 if(borderColor || borderImage) {
198 if (borderImage && borderImage !== 'none' && borderImage.indexOf('-webkit') >= 0) {
199 //Gradient
200 color = this.application.ninja.colorController.getColorObjFromCss(borderImage);
201 if (color && color.value) {
202 this.application.ninja.colorController.colorModel[color.mode] = {value: color.value, wasSetByCode: true, type: 'change'};
203 } else {
204 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
205 this.application.ninja.colorController.colorModel.applyNoColor();
206 }
207 } else {
208 //Solid
209 color = this.application.ninja.colorController.getColorObjFromCss(borderColor);
210 if (color && color.value) {
211 color.value.wasSetByCode = true;
212 color.value.type = 'change';
213 if (color.value.a) {
214 this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, wasSetByCode: true, type: 'change'};
215 }
216 this.application.ninja.colorController.colorModel[color.mode] = color.value;
217 } else {
218 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
219 this.application.ninja.colorController.colorModel.applyNoColor();
220 }
221 }
222 } else {
223 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
224 this.application.ninja.colorController.colorModel.applyNoColor();
225 }
226 //
227 background = ElementsMediator.getProperty(el, "background-color");
228 backgroundImage = ElementsMediator.getProperty(el, "background-image");
229 this.application.ninja.colorController.colorModel.input = "fill";
230 if(background || backgroundImage) {
231 if (backgroundImage && backgroundImage !== 'none' && backgroundImage.indexOf('-webkit') >= 0) {
232 //Gradient
233 color = this.application.ninja.colorController.getColorObjFromCss(backgroundImage);
234 if (color && color.value) {
235 this.application.ninja.colorController.colorModel[color.mode] = {value: color.value, wasSetByCode: true, type: 'change'};
236 } else {
237 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
238 this.application.ninja.colorController.colorModel.applyNoColor();
239 }
240 } else {
241 //Solid
242 color = this.application.ninja.colorController.getColorObjFromCss(background);
243 if (color && color.value) {
244 color.value.wasSetByCode = true;
245 color.value.type = 'change';
246 if (color.value.a) {
247 this.application.ninja.colorController.colorModel.alpha = {value: color.value.a, wasSetByCode: true, type: 'change'};
248 }
249 this.application.ninja.colorController.colorModel[color.mode] = color.value;
250 } else {
251 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
252 this.application.ninja.colorController.colorModel.applyNoColor();
253 }
254 }
255 } else {
256 this.application.ninja.colorController.colorModel.alpha = {value: 1, wasSetByCode: true, type: 'change'};
257 this.application.ninja.colorController.colorModel.applyNoColor();
258 }
259
260
261
262
263
264 } 228 }
265 }, 229 },
266 230
@@ -300,6 +264,8 @@ exports.Content = Montage.create(Component, {
300 264
301 handlePropertyChange: { 265 handlePropertyChange: {
302 value: function(e) { 266 value: function(e) {
267 if(e.wasSetByCode) return;
268
303 var newValue; 269 var newValue;
304 270
305 e.units ? newValue = e.value + e.units : newValue = e.value; 271 e.units ? newValue = e.value + e.units : newValue = e.value;
@@ -317,6 +283,7 @@ exports.Content = Montage.create(Component, {
317 283
318 handlePropertyChanging: { 284 handlePropertyChanging: {
319 value: function(e) { 285 value: function(e) {
286 if(e.wasSetByCode) return;
320 287
321// ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Changing", "pi"); 288// ElementsMediator.setProperty(this.application.ninja.selectedElements, "border-style", [this.customSections[0].content.controls.borderStyle], "Changing", "pi");
322 ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [e.value + "px"], "Changing", "pi"); 289 ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [e.value + "px"], "Changing", "pi");