aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xjs/controllers/elements/body-controller.js5
-rwxr-xr-xjs/panels/color/colorpanelbase.reel/colorpanelbase.js6
-rwxr-xr-xjs/panels/color/colorpopup-manager.js34
3 files changed, 36 insertions, 9 deletions
diff --git a/js/controllers/elements/body-controller.js b/js/controllers/elements/body-controller.js
index 0ca6c417..0b6a5bad 100755
--- a/js/controllers/elements/body-controller.js
+++ b/js/controllers/elements/body-controller.js
@@ -31,6 +31,8 @@ exports.BodyController = Montage.create(ElementController, {
31 value: function(el, p) { 31 value: function(el, p) {
32 switch(p) { 32 switch(p) {
33 case "background" : 33 case "background" :
34 case "background-image":
35 return this.application.ninja.colorController.getColorObjFromCss(this.application.ninja.stylesController.getElementStyle(el, "background-image"));
34 case "background-color": 36 case "background-color":
35 return this.application.ninja.colorController.getColorObjFromCss(this.application.ninja.stylesController.getElementStyle(el, "background-color")); 37 return this.application.ninja.colorController.getColorObjFromCss(this.application.ninja.stylesController.getElementStyle(el, "background-color"));
36 case "border": 38 case "border":
@@ -50,6 +52,9 @@ exports.BodyController = Montage.create(ElementController, {
50 value: function(el, p, value) { 52 value: function(el, p, value) {
51 switch(p) { 53 switch(p) {
52 case "background": 54 case "background":
55 case "background-image":
56 this.application.ninja.stylesController.setElementStyle(el, "background-image", value);
57 break;
53 case "background-color": 58 case "background-color":
54 this.application.ninja.stylesController.setElementStyle(el, "background-color", value); 59 this.application.ninja.stylesController.setElementStyle(el, "background-color", value);
55 break; 60 break;
diff --git a/js/panels/color/colorpanelbase.reel/colorpanelbase.js b/js/panels/color/colorpanelbase.reel/colorpanelbase.js
index 26d4932f..bf2ada96 100755
--- a/js/panels/color/colorpanelbase.reel/colorpanelbase.js
+++ b/js/panels/color/colorpanelbase.reel/colorpanelbase.js
@@ -480,7 +480,11 @@ exports.ColorPanelBase = Montage.create(Component, {
480 } 480 }
481 if (c && c.css) { 481 if (c && c.css) {
482 this.ctx.clearRect(0, 0, this.cvs.width, this.cvs.height); 482 this.ctx.clearRect(0, 0, this.cvs.width, this.cvs.height);
483 this.style.backgroundColor = c.css; 483 if (m === 'gradient') {
484 this.style.backgroundImage = c.css;
485 } else {
486 this.style.backgroundColor = c.css;
487 }
484 } else { 488 } else {
485 this.drawNoColor(this, this.cvs); 489 this.drawNoColor(this, this.cvs);
486 } 490 }
diff --git a/js/panels/color/colorpopup-manager.js b/js/panels/color/colorpopup-manager.js
index 29f9ec94..0ea02192 100755
--- a/js/panels/color/colorpopup-manager.js
+++ b/js/panels/color/colorpopup-manager.js
@@ -106,10 +106,20 @@ exports.ColorPopupManager = Montage.create(Component, {
106 }, 106 },
107 //////////////////////////////////////////////////////////////////// 107 ////////////////////////////////////////////////////////////////////
108 // 108 //
109 _popupChipBtn: {
110 value: null
111 },
112 ////////////////////////////////////////////////////////////////////
113 //
109 _popupGradientChipBase: { 114 _popupGradientChipBase: {
110 value: null 115 value: null
111 }, 116 },
112 //////////////////////////////////////////////////////////////////// 117 ////////////////////////////////////////////////////////////////////
118 //
119 _popupGradientChipBtn: {
120 value: null
121 },
122 ////////////////////////////////////////////////////////////////////
113 //Storing color manager 123 //Storing color manager
114 _colorManager: { 124 _colorManager: {
115 value: null 125 value: null
@@ -208,7 +218,7 @@ exports.ColorPopupManager = Montage.create(Component, {
208 value: function (e) { 218 value: function (e) {
209 // 219 //
210 var ctx, 220 var ctx,
211 cvs = this.application.ninja.colorController.colorView.currentChip.getElementsByTagName('canvas')[0], 221 cvs = this._popupChipBtn.getElementsByTagName('canvas')[0],
212 rgb = this._popupChipBase.colorManager.rgb, 222 rgb = this._popupChipBase.colorManager.rgb,
213 hsl = this._popupChipBase.colorManager.hsl, 223 hsl = this._popupChipBase.colorManager.hsl,
214 alpha = this._popupChipBase.colorManager.alpha.value; 224 alpha = this._popupChipBase.colorManager.alpha.value;
@@ -236,7 +246,7 @@ exports.ColorPopupManager = Montage.create(Component, {
236 ctx.stroke(); 246 ctx.stroke();
237 } 247 }
238 // 248 //
239 this.application.ninja.colorController.colorView.currentChip.color('rgb', {r: rgb.r, g: rgb.g, b: rgb.b, a: alpha, css: 'rgba('+rgb.r+', '+rgb.g+', '+rgb.b+', '+alpha+')'}); 249 this._popupChipBtn.color('rgb', {r: rgb.r, g: rgb.g, b: rgb.b, a: alpha, css: 'rgba('+rgb.r+', '+rgb.g+', '+rgb.b+', '+alpha+')'});
240 } 250 }
241 }, 251 },
242 //////////////////////////////////////////////////////////////////// 252 ////////////////////////////////////////////////////////////////////
@@ -245,7 +255,7 @@ exports.ColorPopupManager = Montage.create(Component, {
245 value: function (e) { 255 value: function (e) {
246 // 256 //
247 var ctx, 257 var ctx,
248 cvs = this.application.ninja.colorController.colorView.currentChip.getElementsByTagName('canvas')[0], 258 cvs = this._popupGradientChipBtn.getElementsByTagName('canvas')[0],
249 rgb = this._popupGradientChipBase.colorManager.rgb, 259 rgb = this._popupGradientChipBase.colorManager.rgb,
250 hsl = this._popupGradientChipBase.colorManager.hsl, 260 hsl = this._popupGradientChipBase.colorManager.hsl,
251 alpha = this._popupGradientChipBase.colorManager.alpha.value; 261 alpha = this._popupGradientChipBase.colorManager.alpha.value;
@@ -273,7 +283,7 @@ exports.ColorPopupManager = Montage.create(Component, {
273 ctx.stroke(); 283 ctx.stroke();
274 } 284 }
275 // 285 //
276 this.application.ninja.colorController.colorView.currentChip.color('rgb', {r: rgb.r, g: rgb.g, b: rgb.b, a: alpha, css: 'rgba('+rgb.r+', '+rgb.g+', '+rgb.b+', '+alpha+')'}); 286 this._popupGradientChipBtn.color('rgb', {r: rgb.r, g: rgb.g, b: rgb.b, a: alpha, css: 'rgba('+rgb.r+', '+rgb.g+', '+rgb.b+', '+alpha+')'});
277 } 287 }
278 }, 288 },
279 //////////////////////////////////////////////////////////////////// 289 ////////////////////////////////////////////////////////////////////
@@ -294,6 +304,8 @@ exports.ColorPopupManager = Montage.create(Component, {
294 return; 304 return;
295 } 305 }
296 // 306 //
307 this._popupChipBtn = this.application.ninja.colorController.colorView.currentChip;
308 //
297 this._colorChipPopupDrawing = true; 309 this._colorChipPopupDrawing = true;
298 //////////////////////////////////////////////////// 310 ////////////////////////////////////////////////////
299 //Initializing events 311 //Initializing events
@@ -370,6 +382,8 @@ exports.ColorPopupManager = Montage.create(Component, {
370 this.hideGradientChipPopup(); 382 this.hideGradientChipPopup();
371 return; 383 return;
372 } else { 384 } else {
385 //
386 this._popupGradientChipBtn = this.application.ninja.colorController.colorView.currentChip;
373 // 387 //
374 this._colorGradientPopupDrawing = true; 388 this._colorGradientPopupDrawing = true;
375 //////////////////////////////////////////////////// 389 ////////////////////////////////////////////////////
@@ -590,16 +604,20 @@ exports.ColorPopupManager = Montage.create(Component, {
590 if (e._event.hsv) { 604 if (e._event.hsv) {
591 this._popupChipBase.colorManager.hsv = {h: e._event.hsv.h, s: e._event.hsv.s, v: e._event.hsv.v, type: e._event.type, wasSetByCode: e._event.wasSetByCode}; 605 this._popupChipBase.colorManager.hsv = {h: e._event.hsv.h, s: e._event.hsv.s, v: e._event.hsv.v, type: e._event.type, wasSetByCode: e._event.wasSetByCode};
592 this.colorChipChange(e); 606 this.colorChipChange(e);
593 } else { 607 } else if (!this._popupBase || (this._popupBase && !this._popupBase.opened)){
594 //console.log(e._event); 608 if (e._event.gradient && !e._event.wasSetByCode) {
609 //
610 this._popupChipBtn.color('gradient', e._event.gradient);
611 }
595 } 612 }
596 return; 613 return;
597 } else if (this._popupGradientChipBase && this._popupGradientChipBase.opened) { 614 } else if (this._popupGradientChipBase && this._popupGradientChipBase.opened) {
598 if (e._event.hsv) { 615 if (e._event.hsv) {
599 this._popupGradientChipBase.colorManager.hsv = {h: e._event.hsv.h, s: e._event.hsv.s, v: e._event.hsv.v, type: e._event.type, wasSetByCode: e._event.wasSetByCode}; 616 this._popupGradientChipBase.colorManager.hsv = {h: e._event.hsv.h, s: e._event.hsv.s, v: e._event.hsv.v, type: e._event.type, wasSetByCode: e._event.wasSetByCode};
600 this.colorGradientChipChange(e); 617 this.colorGradientChipChange(e);
601 } else { 618 } else if (!this._popupBase || (this._popupBase && !this._popupBase.opened)){
602 //console.log(e._event); 619 //
620 this._popupChipBtn.color('gradient', e._event.gradient);
603 } 621 }
604 return; 622 return;
605 } 623 }