From 32c41a56fd870f28be70c9b9cfb4fe6dfbb16654 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Sat, 23 Jun 2012 19:22:53 -0700 Subject: Adding support for gradients on chips Need to handle other color modes, currently only handling HSV and gradients. Working on getting other modes supported. Also, will need clean up color popup manager after completion. --- js/panels/color/colorpopup-manager.js | 34 ++++++++++++++++++++++++++-------- 1 file changed, 26 insertions(+), 8 deletions(-) (limited to 'js/panels/color/colorpopup-manager.js') 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, { }, //////////////////////////////////////////////////////////////////// // + _popupChipBtn: { + value: null + }, + //////////////////////////////////////////////////////////////////// + // _popupGradientChipBase: { value: null }, //////////////////////////////////////////////////////////////////// + // + _popupGradientChipBtn: { + value: null + }, + //////////////////////////////////////////////////////////////////// //Storing color manager _colorManager: { value: null @@ -208,7 +218,7 @@ exports.ColorPopupManager = Montage.create(Component, { value: function (e) { // var ctx, - cvs = this.application.ninja.colorController.colorView.currentChip.getElementsByTagName('canvas')[0], + cvs = this._popupChipBtn.getElementsByTagName('canvas')[0], rgb = this._popupChipBase.colorManager.rgb, hsl = this._popupChipBase.colorManager.hsl, alpha = this._popupChipBase.colorManager.alpha.value; @@ -236,7 +246,7 @@ exports.ColorPopupManager = Montage.create(Component, { ctx.stroke(); } // - 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+')'}); + this._popupChipBtn.color('rgb', {r: rgb.r, g: rgb.g, b: rgb.b, a: alpha, css: 'rgba('+rgb.r+', '+rgb.g+', '+rgb.b+', '+alpha+')'}); } }, //////////////////////////////////////////////////////////////////// @@ -245,7 +255,7 @@ exports.ColorPopupManager = Montage.create(Component, { value: function (e) { // var ctx, - cvs = this.application.ninja.colorController.colorView.currentChip.getElementsByTagName('canvas')[0], + cvs = this._popupGradientChipBtn.getElementsByTagName('canvas')[0], rgb = this._popupGradientChipBase.colorManager.rgb, hsl = this._popupGradientChipBase.colorManager.hsl, alpha = this._popupGradientChipBase.colorManager.alpha.value; @@ -273,7 +283,7 @@ exports.ColorPopupManager = Montage.create(Component, { ctx.stroke(); } // - 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+')'}); + this._popupGradientChipBtn.color('rgb', {r: rgb.r, g: rgb.g, b: rgb.b, a: alpha, css: 'rgba('+rgb.r+', '+rgb.g+', '+rgb.b+', '+alpha+')'}); } }, //////////////////////////////////////////////////////////////////// @@ -294,6 +304,8 @@ exports.ColorPopupManager = Montage.create(Component, { return; } // + this._popupChipBtn = this.application.ninja.colorController.colorView.currentChip; + // this._colorChipPopupDrawing = true; //////////////////////////////////////////////////// //Initializing events @@ -370,6 +382,8 @@ exports.ColorPopupManager = Montage.create(Component, { this.hideGradientChipPopup(); return; } else { + // + this._popupGradientChipBtn = this.application.ninja.colorController.colorView.currentChip; // this._colorGradientPopupDrawing = true; //////////////////////////////////////////////////// @@ -590,16 +604,20 @@ exports.ColorPopupManager = Montage.create(Component, { if (e._event.hsv) { 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}; this.colorChipChange(e); - } else { - //console.log(e._event); + } else if (!this._popupBase || (this._popupBase && !this._popupBase.opened)){ + if (e._event.gradient && !e._event.wasSetByCode) { + // + this._popupChipBtn.color('gradient', e._event.gradient); + } } return; } else if (this._popupGradientChipBase && this._popupGradientChipBase.opened) { if (e._event.hsv) { 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}; this.colorGradientChipChange(e); - } else { - //console.log(e._event); + } else if (!this._popupBase || (this._popupBase && !this._popupBase.opened)){ + // + this._popupChipBtn.color('gradient', e._event.gradient); } return; } -- cgit v1.2.3