1 /**
  2  *
  3  * Copyright (c) 2010-2012 cocos2d-x.org
  4  *
  5  * Copyright 2012 Stewart Hamilton-Arrandale.
  6  * http://creativewax.co.uk
  7  *
  8  * Modified by Yannick Loriot.
  9  * http://yannickloriot.com
 10  *
 11  * Permission is hereby granted, free of charge, to any person obtaining a copy
 12  * of this software and associated documentation files (the "Software"), to deal
 13  * in the Software without restriction, including without limitation the rights
 14  * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 15  * copies of the Software, and to permit persons to whom the Software is
 16  * furnished to do so, subject to the following conditions:
 17  *
 18  * The above copyright notice and this permission notice shall be included in
 19  * all copies or substantial portions of the Software.
 20  *
 21  * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 22  * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 23  * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 24  * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 25  * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 26  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 27  * THE SOFTWARE.
 28  *
 29  *
 30  * converted to Javascript / cocos2d-x by Angus C
 31  */
 32 
 33 cc.ControlHuePicker = cc.Control.extend({
 34     _hue:0,
 35     _huePercentage:0,
 36     _background:null,
 37     _slider:null,
 38     _startPos:null,
 39 
 40     //maunally put in the setters
 41     getHue:function () {
 42         return this._hue;
 43     },
 44     setHue:function (hueValue) {
 45         this._hue = hueValue;
 46         this.setHuePercentage(this._hue / 360.0);
 47     },
 48 
 49     getHuePercentage:function () {
 50         return this._huePercentage;
 51     },
 52     setHuePercentage:function (hueValueInPercent) {
 53         this._huePercentage = hueValueInPercent;
 54         this._hue = this._huePercentage * 360.0;
 55 
 56         // Clamp the position of the icon within the circle
 57         var backgroundBox = this._background.getBoundingBox();
 58 
 59         // Get the center point of the background image
 60         var centerX = this._startPos.x + backgroundBox.width * 0.5;
 61         var centerY = this._startPos.y + backgroundBox.height * 0.5;
 62 
 63         // Work out the limit to the distance of the picker when moving around the hue bar
 64         var limit = backgroundBox.width * 0.5 - 15.0;
 65 
 66         // Update angle
 67         var angleDeg = this._huePercentage * 360.0 - 180.0;
 68         var angle = cc.DEGREES_TO_RADIANS(angleDeg);
 69 
 70         // Set new position of the slider
 71         var x = centerX + limit * Math.cos(angle);
 72         var y = centerY + limit * Math.sin(angle);
 73         this._slider.setPosition(x, y);
 74     },
 75 
 76     setEnabled:function (enabled) {
 77         cc.Control.prototype.setEnabled.call(this, enabled);
 78         if (this._slider) {
 79             this._slider.setOpacity(enabled ? 255 : 128);
 80         }
 81     },
 82 
 83     getBackground:function () {
 84         return this._background;
 85     },
 86     getSlider:function () {
 87         return this._slider;
 88     },
 89     getStartPos:function () {
 90         return this._startPos;
 91     },
 92 
 93     initWithTargetAndPos:function (target, pos) {
 94         if (cc.Control.prototype.init.call(this)) {
 95             this.setTouchEnabled(true);
 96             // Add background and slider sprites
 97             this._background = cc.ControlUtils.addSpriteToTargetWithPosAndAnchor("huePickerBackground.png", target, pos, cc.p(0.0, 0.0));
 98             this._slider = cc.ControlUtils.addSpriteToTargetWithPosAndAnchor("colourPicker.png", target, pos, cc.p(0.5, 0.5));
 99 
100             this._slider.setPosition(pos.x, pos.y + this._background.getBoundingBox().height * 0.5);
101             this._startPos = pos;
102 
103             // Sets the default value
104             this._hue = 0.0;
105             this._huePercentage = 0.0;
106             return true;
107         } else
108             return false;
109     },
110 
111     _updateSliderPosition:function (location) {
112         // Clamp the position of the icon within the circle
113         var backgroundBox = this._background.getBoundingBox();
114 
115         // Get the center point of the background image
116         var centerX = this._startPos.x + backgroundBox.width * 0.5;
117         var centerY = this._startPos.y + backgroundBox.height * 0.5;
118 
119         // Work out the distance difference between the location and center
120         var dx = location.x - centerX;
121         var dy = location.y - centerY;
122 
123         // Update angle by using the direction of the location
124         var angle = Math.atan2(dy, dx);
125         var angleDeg = cc.RADIANS_TO_DEGREES(angle) + 180.0;
126 
127         // use the position / slider width to determin the percentage the dragger is at
128         this.setHue(angleDeg);
129 
130         // send CCControl callback
131         this.sendActionsForControlEvents(cc.CONTROL_EVENT_VALUECHANGED);
132     },
133     _checkSliderPosition:function (location) {
134         // compute the distance between the current location and the center
135         var distance = Math.sqrt(Math.pow(location.x + 10, 2) + Math.pow(location.y, 2));
136 
137         // check that the touch location is within the circle
138         if (80 > distance && distance > 59)        {
139             this._updateSliderPosition(location);
140             return true;
141         }
142         return false;
143     },
144 
145     onTouchBegan:function (touch, event) {
146         if (!this.isEnabled() || !this.isVisible())        {
147             return false;
148         }
149         var touchLocation = this.getTouchLocation(touch);
150 
151         // Check the touch position on the slider
152         return this._checkSliderPosition(touchLocation);
153     },
154     onTouchMoved:function (touch, event) {
155         // Get the touch location
156         var touchLocation = this.getTouchLocation(touch);
157 
158         //small modification: this allows changing of the colour, even if the touch leaves the bounding area
159         //this._updateSliderPosition(touchLocation);
160         //this.sendActionsForControlEvents(cc.CONTROL_EVENT_VALUECHANGED);
161         // Check the touch position on the slider
162         this._checkSliderPosition(touchLocation);
163     }
164 });
165 
166 cc.ControlHuePicker.create = function (target, pos) {
167     var pRet = new cc.ControlHuePicker();
168     pRet.initWithTargetAndPos(target, pos);
169     return pRet;
170 };