1 /** 2 * 3 * Copyright (c) 2008-2010 Ricardo Quesada 4 * Copyright (c) 2011-2012 cocos2d-x.org 5 * Copyright (c) 2013-2014 Chukong Technologies Inc. 6 * 7 * Copyright 2012 Stewart Hamilton-Arrandale. 8 * http://creativewax.co.uk 9 * 10 * Modified by Yannick Loriot. 11 * http://yannickloriot.com 12 * 13 * Permission is hereby granted, free of charge, to any person obtaining a copy 14 * of this software and associated documentation files (the "Software"), to deal 15 * in the Software without restriction, including without limitation the rights 16 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 17 * copies of the Software, and to permit persons to whom the Software is 18 * furnished to do so, subject to the following conditions: 19 * 20 * The above copyright notice and this permission notice shall be included in 21 * all copies or substantial portions of the Software. 22 * 23 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 24 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 25 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 26 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 27 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 28 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 29 * THE SOFTWARE. * 30 * 31 */ 32 33 /** 34 * ControlColourPicker: color picker ui component. 35 * @class 36 * @extends cc.Control 37 * 38 * @property {cc.Sprite} background - <@readonly> The background sprite 39 */ 40 cc.ControlColourPicker = cc.Control.extend(/** @lends cc.ControlColourPicker# */{ 41 _hsv:null, 42 _colourPicker:null, 43 _huePicker:null, 44 45 _background:null, 46 _className:"ControlColourPicker", 47 ctor:function () { 48 cc.Control.prototype.ctor.call(this); 49 this.init(); 50 }, 51 hueSliderValueChanged:function (sender, controlEvent) { 52 this._hsv.h = sender.getHue(); 53 54 // Update the value 55 var rgb = cc.ControlUtils.RGBfromHSV(this._hsv); 56 cc.Control.prototype.setColor.call(this,cc.color(0 | (rgb.r * 255), 0 | (rgb.g * 255), 0 | (rgb.b * 255))); 57 58 // Send CCControl callback 59 this.sendActionsForControlEvents(cc.CONTROL_EVENT_VALUECHANGED); 60 this._updateControlPicker(); 61 }, 62 63 colourSliderValueChanged:function (sender, controlEvent) { 64 this._hsv.s = sender.getSaturation(); 65 this._hsv.v = sender.getBrightness(); 66 67 68 // Update the value 69 var rgb = cc.ControlUtils.RGBfromHSV(this._hsv); 70 cc.Control.prototype.setColor.call(this,cc.color(0 | (rgb.r * 255), 0 | (rgb.g * 255), 0 | (rgb.b * 255))); 71 72 // Send CCControl callback 73 this.sendActionsForControlEvents(cc.CONTROL_EVENT_VALUECHANGED); 74 }, 75 76 setColor:function (color) { 77 cc.Control.prototype.setColor.call(this,color); 78 //this._colorValue = color; 79 var rgba = new cc.RGBA(); 80 rgba.r = color.r / 255.0; 81 rgba.g = color.g / 255.0; 82 rgba.b = color.b / 255.0; 83 rgba.a = 1.0; 84 85 this._hsv = cc.ControlUtils.HSVfromRGB(rgba); 86 this._updateHueAndControlPicker(); 87 }, 88 89 getBackground:function () { 90 return this._background; 91 }, 92 93 init:function () { 94 if (cc.Control.prototype.init.call(this)) { 95 // Cache the sprites 96 cc.spriteFrameCache.addSpriteFrames(res.CCControlColourPickerSpriteSheet_plist); 97 98 // Create the sprite batch node 99 var spriteSheet = new cc.SpriteBatchNode(res.CCControlColourPickerSpriteSheet_png); 100 this.addChild(spriteSheet); 101 102 /*// MIPMAP 103 //TODO WebGL code 104 var params = [gl.LINEAR_MIPMAP_NEAREST, gl.LINEAR, gl.REPEAT, gl.CLAMP_TO_EDGE]; 105 spriteSheet.getTexture().setAliasTexParameters(); 106 spriteSheet.getTexture().setTexParameters(params); 107 spriteSheet.getTexture().generateMipmap();*/ 108 109 // Init default color 110 this._hsv = new cc.HSV(0, 0, 0); 111 112 // Add image 113 this._background = cc.ControlUtils.addSpriteToTargetWithPosAndAnchor("menuColourPanelBackground.png", spriteSheet, cc.p(0,0), cc.p(0.5, 0.5)); 114 115 var backgroundPointZero = cc.pSub(this._background.getPosition(), 116 cc.p(this._background.getContentSize().width / 2, this._background.getContentSize().height / 2)); 117 118 // Setup panels . currently hard-coded... 119 var hueShift = 8; 120 var colourShift = 28; 121 122 this._huePicker = new cc.ControlHuePicker(spriteSheet, cc.p(backgroundPointZero.x + hueShift, backgroundPointZero.y + hueShift)); 123 this._colourPicker = new cc.ControlSaturationBrightnessPicker(spriteSheet, cc.p(backgroundPointZero.x + colourShift, backgroundPointZero.y + colourShift)); 124 125 // Setup events 126 this._huePicker.addTargetWithActionForControlEvents(this, this.hueSliderValueChanged, cc.CONTROL_EVENT_VALUECHANGED); 127 this._colourPicker.addTargetWithActionForControlEvents(this, this.colourSliderValueChanged, cc.CONTROL_EVENT_VALUECHANGED); 128 129 // Set defaults 130 this._updateHueAndControlPicker(); 131 this.addChild(this._huePicker); 132 this.addChild(this._colourPicker); 133 134 // Set content size 135 this.setContentSize(this._background.getContentSize()); 136 return true; 137 } 138 else 139 return false; 140 }, 141 142 _updateControlPicker:function () { 143 this._huePicker.setHue(this._hsv.h); 144 this._colourPicker.updateWithHSV(this._hsv); 145 }, 146 147 _updateHueAndControlPicker:function () { 148 this._huePicker.setHue(this._hsv.h); 149 this._colourPicker.updateWithHSV(this._hsv); 150 this._colourPicker.updateDraggerWithHSV(this._hsv); 151 }, 152 setEnabled:function (enabled) { 153 cc.Control.prototype.setEnabled.call(this, enabled); 154 if (this._huePicker !== null) { 155 this._huePicker.setEnabled(enabled); 156 } 157 if (this._colourPicker) { 158 this._colourPicker.setEnabled(enabled); 159 } 160 }, 161 onTouchBegan:function () { 162 //ignore all touches, handled by children 163 return false; 164 } 165 }); 166 167 var _p = cc.ControlColourPicker.prototype; 168 169 // Extended properties 170 /** @expose */ 171 _p.background; 172 cc.defineGetterSetter(_p, "background", _p.getBackground); 173 174 _p = null; 175 176 /** 177 * @deprecated 178 * @returns {ControlColourPicker} 179 */ 180 cc.ControlColourPicker.create = function () { 181 return new cc.ControlColourPicker(); 182 }; 183 184 // compatible with NPM 185 var res = res || {}; 186 res.CCControlColourPickerSpriteSheet_plist = res.CCControlColourPickerSpriteSheet_plist || "res/extensions/CCControlColourPickerSpriteSheet.plist"; 187 res.CCControlColourPickerSpriteSheet_png = res.CCControlColourPickerSpriteSheet_png || "res/extensions/CCControlColourPickerSpriteSheet.png";