aboutsummaryrefslogtreecommitdiff
path: root/js/controllers/color-controller.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/controllers/color-controller.js')
-rw-r--r--js/controllers/color-controller.js97
1 files changed, 13 insertions, 84 deletions
diff --git a/js/controllers/color-controller.js b/js/controllers/color-controller.js
index 87180873..925b525d 100644
--- a/js/controllers/color-controller.js
+++ b/js/controllers/color-controller.js
@@ -175,76 +175,21 @@ exports.ColorController = Montage.create(Component, {
175 }, 175 },
176 //////////////////////////////////////////////////////////////////// 176 ////////////////////////////////////////////////////////////////////
177 // 177 //
178 setBackground: { 178 setColor: {
179 enumerable: true, 179 enumerable: true,
180 value: function (type, background, selection) { 180 value: function (mode, color, isFill, selection) {
181 //TODO: Remove hack 181 var elements;
182 var elements, i, hack = [], hackNone = [];
183 //The selection is optional, if none, it asks for the currently selected elements 182 //The selection is optional, if none, it asks for the currently selected elements
184 if (selection) { 183 if (selection) {
185 elements = selection; 184 elements = selection;
186 } else { 185 } else {
187 elements = this.application.ninja.selectedElements; 186 elements = this.application.ninja.selectedElements;
188 } 187 }
189 // 188 if (elements && elements.length) {
190 for (i=0; elements[i]; i++) { 189 var colorInfo = { mode:mode,
191 hack[i] = background; 190 color:color
192 hackNone[i] = 'none'; 191 };
193 } 192 ElementsMediator.setColor(elements, colorInfo, isFill, "Change", "color-controller");
194 //
195 if (elements && elements.length > 0) {
196 switch (type) {
197 case 'image':
198 ElementsMediator.setProperty(elements, "background-image", hack, {"background-image": background}, "Change", "color-controller");
199 ElementsMediator.setProperty(elements, "background-color", hackNone, {"background-color": 'none'}, "Change", "color-controller");
200 break;
201 case 'color':
202 //TODO: Add logic to handle setting color when image (like gradients) is applied
203 //TODO: Handle applying to multiple items, currently, we need to create a dummy array of the same value
204 ElementsMediator.setProperty(elements, "background-image", hackNone, {"background-image": 'none'}, "Change", "color-controller");
205 ElementsMediator.setProperty(elements, "background-color", hack, {"background-color": background}, "Change", "color-controller");
206 break;
207 case 'background':
208 break;
209 }
210 //
211 //console.log(this.getColorObjFromCss('#333'));
212 }
213 }
214 },
215 ////////////////////////////////////////////////////////////////////
216 //
217 setBorder: {
218 enumerable: true,
219 value: function (type, border, selection) {
220 //
221 var elements, i, hack = [], hackNone = [];
222 //The selection is optional, if none, it asks for the currently selected elements
223 if (selection) {
224 elements = selection;
225 } else {
226 elements = this.application.ninja.selectedElements;
227 }
228 //
229 for (i=0; elements[i]; i++) {
230 hack[i] = border;
231 hackNone[i] = 'none';
232 }
233 //
234 if (elements && elements.length > 0) {
235 switch (type) {
236 case 'image':
237 //TODO: Figure out why color must be removed, might be related to the CSS
238 ElementsMediator.setProperty(elements, "border-color", hackNone, {"border-color": 'none'}, "Change", "color-controller");
239 ElementsMediator.setProperty(elements, "border-image", hack, {"border-image": border}, "Change", "color-controller");
240 break;
241 case 'color':
242 ElementsMediator.setProperty(elements, "border-image", hackNone, {"border-image": 'none'}, "Change", "color-controller");
243 ElementsMediator.setProperty(elements, "border-color", hack, {"border-color": border}, "Change", "color-controller");
244 break;
245 case 'border':
246 break;
247 }
248 } 193 }
249 } 194 }
250 }, 195 },
@@ -264,8 +209,10 @@ exports.ColorController = Montage.create(Component, {
264 color = {value: null, css: 'none'}; 209 color = {value: null, css: 'none'};
265 } else if (panelMode === 'rgb' && e._event.rgba && mode !== 'gradient') { 210 } else if (panelMode === 'rgb' && e._event.rgba && mode !== 'gradient') {
266 color = e._event.rgba; 211 color = e._event.rgba;
212 color.webGlColor = e._event.webGlColor;
267 } else if (panelMode === 'hsl' && e._event.hsla && mode !== 'gradient') { 213 } else if (panelMode === 'hsl' && e._event.hsla && mode !== 'gradient') {
268 color = e._event.hsla; 214 color = e._event.hsla;
215 color.webGlColor = e._event.webGlColor;
269 } else if (mode !== 'gradient'){ 216 } else if (mode !== 'gradient'){
270 color = {value: e._event.hex, css: '#'+e._event.hex}; 217 color = {value: e._event.hex, css: '#'+e._event.hex};
271 } else if (mode === 'gradient'){ 218 } else if (mode === 'gradient'){
@@ -280,32 +227,14 @@ exports.ColorController = Montage.create(Component, {
280 // 227 //
281 if(e._event.wasSetByCode) return; 228 if(e._event.wasSetByCode) return;
282 // 229 //
283 if (mode === 'nocolor') { 230 this.setColor(mode, color, true);
284 //TODO: Add a check instead of setting properties
285 this.setBackground('image', color.css, false);
286 this.setBackground('color', color.css, false);
287 this.setBackground('background', color.css, false);
288 } else if (mode === 'gradient') {
289 this.setBackground('image', color.css, false);
290 } else {
291 this.setBackground('color', color.css, false);
292 }
293 } else if (input === 'stroke') { 231 } else if (input === 'stroke') {
294 // 232 //
295 this.stroke = color; 233 this.stroke = color;
296 // 234 //
297 if(e._event.wasSetByCode) return; 235 if(e._event.wasSetByCode) return;
298 // 236
299 if (mode === 'nocolor') { 237 this.setColor(mode, color, false);
300 //TODO: Add a check instead of setting properties
301 this.setBorder('image', color.css, false);
302 this.setBorder('color', color.css, false);
303 this.setBorder('border', color.css, false);
304 } else if (mode === 'gradient') {
305 this.setBorder('image', color.css, false);
306 } else {
307 this.setBorder('color', color.css, false);
308 }
309 } 238 }
310 //////////////////////////////////////////////////////////// 239 ////////////////////////////////////////////////////////////
311 //////////////////////////////////////////////////////////// 240 ////////////////////////////////////////////////////////////