projects / roojs1 / blob
? search:


8b940928ce0e593bece6ed9b1258f223770dc69c
[roojs1] / docs / src / Roo_lib_Color.js.html
1 <html><head><title>Roo/lib/Color.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
2
3 Color.js
4
5 Functions for Color handling and processing.
6
7 http://www.safalra.com/web-design/javascript/Color-handling-and-processing/
8
9 The author of this program, Safalra (Stephen Morley), irrevocably releases all
10 rights to this program, with the intention of it becoming part of the public
11 domain. Because this program is released into the public domain, it comes with
12 no warranty either expressed or implied, to the extent permitted by law.
13
14 For more free and public domain JavaScript code by the same author, visit:
15 http://www.safalra.com/web-design/javascript/
16
17 */
18
19
20 /*
21  * @class Roo.lib.Color
22  * @constructor
23  * An abstract Color implementation. Concrete Color implementations should use
24  * an instance of this function as their prototype, and implement the getRGB and
25  * getHSL functions. getRGB should return an object representing the RGB
26  * components of this Color, with the red, green, and blue components in the
27  * range [0,255] and the alpha component in the range [0,100]. getHSL should
28  * return an object representing the HSL components of this Color, with the hue
29  * component in the range [0,360), the saturation and lightness components in
30  * the range [0,100], and the alpha component in the range [0,1].
31  */
32 </span><span class="jsdoc-var">Roo.lib.Color </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() { }
33
34
35 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.lib.Color.prototype</span><span class="jsdoc-syntax">, {
36   </span><span class="jsdoc-comment">/**
37    * @returns an object representing the RGBA components of this Color. The red,
38    * green, and blue components are converted to integers in the range [0,255].
39    * The alpha is a value in the range [0,1].
40    */
41   </span><span class="jsdoc-var">getIntegerRGB </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
42
43     </span><span class="jsdoc-comment">// get the RGB components of this Color
44     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getRGB</span><span class="jsdoc-syntax">();
45
46     </span><span class="jsdoc-comment">// return the integer components
47     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
48       </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">),
49       </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">),
50       </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">),
51       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.a
52     </span><span class="jsdoc-syntax">};
53
54   },
55
56   </span><span class="jsdoc-comment">/**
57    * @returns an object representing the RGBA components of this Color. The red,
58    * green, and blue components are converted to numbers in the range [0,100].
59    * The alpha is a value in the range [0,1].
60    */
61   </span><span class="jsdoc-var">getPercentageRGB </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
62
63     </span><span class="jsdoc-comment">// get the RGB components of this Color
64     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getRGB</span><span class="jsdoc-syntax">();
65
66     </span><span class="jsdoc-comment">// return the percentage components
67     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
68       </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: 100 * </span><span class="jsdoc-var">rgb.r </span><span class="jsdoc-syntax">/ 255,
69       </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: 100 * </span><span class="jsdoc-var">rgb.g </span><span class="jsdoc-syntax">/ 255,
70       </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: 100 * </span><span class="jsdoc-var">rgb.b </span><span class="jsdoc-syntax">/ 255,
71       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.a
72     </span><span class="jsdoc-syntax">};
73
74   },
75
76   </span><span class="jsdoc-comment">/**
77    * @returns a string representing this Color as a CSS hexadecimal RGB Color
78    * value - that is, a string of the form #RRGGBB where each of RR, GG, and BB
79    * are two-digit hexadecimal numbers.
80    */
81   </span><span class="jsdoc-var">getCSSHexadecimalRGB </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
82   {
83
84     </span><span class="jsdoc-comment">// get the integer RGB components
85     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getIntegerRGB</span><span class="jsdoc-syntax">();
86
87     </span><span class="jsdoc-comment">// determine the hexadecimal equivalents
88     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r16 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">rgb.r.toString</span><span class="jsdoc-syntax">(16);
89     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g16 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">rgb.g.toString</span><span class="jsdoc-syntax">(16);
90     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b16 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">rgb.b.toString</span><span class="jsdoc-syntax">(16);
91
92     </span><span class="jsdoc-comment">// return the CSS RGB Color value
93     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'#'
94         </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">r16.length </span><span class="jsdoc-syntax">== 2 ? </span><span class="jsdoc-var">r16 </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'0' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">r16</span><span class="jsdoc-syntax">)
95         + (</span><span class="jsdoc-var">g16.length </span><span class="jsdoc-syntax">== 2 ? </span><span class="jsdoc-var">g16 </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'0' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">g16</span><span class="jsdoc-syntax">)
96         + (</span><span class="jsdoc-var">b16.length </span><span class="jsdoc-syntax">== 2 ? </span><span class="jsdoc-var">b16 </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'0' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">b16</span><span class="jsdoc-syntax">);
97
98   },
99
100   </span><span class="jsdoc-comment">/**
101    * @returns a string representing this Color as a CSS integer RGB Color
102    * value - that is, a string of the form rgb(r,g,b) where each of r, g, and b
103    * are integers in the range [0,255].
104    */
105   </span><span class="jsdoc-var">getCSSIntegerRGB </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
106
107     </span><span class="jsdoc-comment">// get the integer RGB components
108     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getIntegerRGB</span><span class="jsdoc-syntax">();
109
110     </span><span class="jsdoc-comment">// return the CSS RGB Color value
111     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'rgb(' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.r </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.g </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.b </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">')'</span><span class="jsdoc-syntax">;
112
113   },
114
115   </span><span class="jsdoc-comment">/**
116    * @returns Returns a string representing this Color as a CSS integer RGBA Color
117    * value - that is, a string of the form rgba(r,g,b,a) where each of r, g, and
118    * b are integers in the range [0,255] and a is in the range [0,1].
119    */
120   </span><span class="jsdoc-var">getCSSIntegerRGBA </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
121
122     </span><span class="jsdoc-comment">// get the integer RGB components
123     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getIntegerRGB</span><span class="jsdoc-syntax">();
124
125     </span><span class="jsdoc-comment">// return the CSS integer RGBA Color value
126     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'rgb(' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.r </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.g </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.b </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.a </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">')'</span><span class="jsdoc-syntax">;
127
128   },
129
130   </span><span class="jsdoc-comment">/**
131    * @returns a string representing this Color as a CSS percentage RGB Color
132    * value - that is, a string of the form rgb(r%,g%,b%) where each of r, g, and
133    * b are in the range [0,100].
134    */
135   </span><span class="jsdoc-var">getCSSPercentageRGB </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
136
137     </span><span class="jsdoc-comment">// get the percentage RGB components
138     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPercentageRGB</span><span class="jsdoc-syntax">();
139
140     </span><span class="jsdoc-comment">// return the CSS RGB Color value
141     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'rgb(' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.r </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.g </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.b </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%)'</span><span class="jsdoc-syntax">;
142
143   },
144
145   </span><span class="jsdoc-comment">/**
146    * @returns a string representing this Color as a CSS percentage RGBA Color
147    * value - that is, a string of the form rgba(r%,g%,b%,a) where each of r, g,
148    * and b are in the range [0,100] and a is in the range [0,1].
149    */
150   </span><span class="jsdoc-var">getCSSPercentageRGBA </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
151
152     </span><span class="jsdoc-comment">// get the percentage RGB components
153     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPercentageRGB</span><span class="jsdoc-syntax">();
154
155     </span><span class="jsdoc-comment">// return the CSS percentage RGBA Color value
156     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'rgb(' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.r </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.g </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.b </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">rgb.a </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">')'</span><span class="jsdoc-syntax">;
157
158   },
159
160   </span><span class="jsdoc-comment">/**
161    * @returns a string representing this Color as a CSS HSL Color value - that
162    * is, a string of the form hsl(h,s%,l%) where h is in the range [0,100] and
163    * s and l are in the range [0,100].
164    */
165   </span><span class="jsdoc-var">getCSSHSL </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
166
167     </span><span class="jsdoc-comment">// get the HSL components
168     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHSL</span><span class="jsdoc-syntax">();
169
170     </span><span class="jsdoc-comment">// return the CSS HSL Color value
171     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'hsl(' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.h </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%)'</span><span class="jsdoc-syntax">;
172
173   },
174
175   </span><span class="jsdoc-comment">/**
176    * @returns a string representing this Color as a CSS HSLA Color value - that
177    * is, a string of the form hsla(h,s%,l%,a) where h is in the range [0,100],
178    * s and l are in the range [0,100], and a is in the range [0,1].
179    */
180   </span><span class="jsdoc-var">getCSSHSLA </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
181
182     </span><span class="jsdoc-comment">// get the HSL components
183     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHSL</span><span class="jsdoc-syntax">();
184
185     </span><span class="jsdoc-comment">// return the CSS HSL Color value
186     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'hsl(' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.h </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">',' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%,' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.a </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">')'</span><span class="jsdoc-syntax">;
187
188   },
189
190   </span><span class="jsdoc-comment">/**
191    * Sets the Color of the specified node to this Color. This functions sets
192    * the CSS 'color' property for the node. The parameter is:
193    * 
194    * @param {DomElement} node - the node whose Color should be set
195    */
196   </span><span class="jsdoc-var">setNodeColor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">){
197
198     </span><span class="jsdoc-comment">// set the Color of the node
199     </span><span class="jsdoc-var">node.style.color </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getCSSHexadecimalRGB</span><span class="jsdoc-syntax">();
200
201   },
202
203   </span><span class="jsdoc-comment">/**
204    * Sets the background Color of the specified node to this Color. This
205    * functions sets the CSS 'background-color' property for the node. The
206    * parameter is:
207    *
208    * @param {DomElement} node - the node whose background Color should be set
209    */
210   </span><span class="jsdoc-var">setNodeBackgroundColor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">){
211
212     </span><span class="jsdoc-comment">// set the background Color of the node
213     </span><span class="jsdoc-var">node.style.backgroundColor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getCSSHexadecimalRGB</span><span class="jsdoc-syntax">();
214
215   },
216   </span><span class="jsdoc-comment">// convert between formats..
217   </span><span class="jsdoc-var">toRGB</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
218   {
219     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getIntegerRGB</span><span class="jsdoc-syntax">();
220     </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.RGBColor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r.r</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">r.g</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">r.b</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">r.a</span><span class="jsdoc-syntax">);
221
222   },
223   </span><span class="jsdoc-var">toHSL </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
224   {
225      </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHSL</span><span class="jsdoc-syntax">();
226   </span><span class="jsdoc-comment">// return the CSS HSL Color value
227     </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.HSLColor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">hsl.a </span><span class="jsdoc-syntax">);
228
229   },
230
231   </span><span class="jsdoc-var">toHSV </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
232   {
233     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.toRGB</span><span class="jsdoc-syntax">();
234     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">rgb.getHSV</span><span class="jsdoc-syntax">();
235    </span><span class="jsdoc-comment">// return the CSS HSL Color value
236     </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.HSVColor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">hsv.s</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">hsv.a </span><span class="jsdoc-syntax">);
237
238   },
239
240   </span><span class="jsdoc-comment">// modify  v = 0 ... 1 (eg. 0.5)
241   </span><span class="jsdoc-var">saturate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">)
242   {
243       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.toRGB</span><span class="jsdoc-syntax">();
244       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">rgb.getHSV</span><span class="jsdoc-syntax">();
245       </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.HSVColor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">hsv.a </span><span class="jsdoc-syntax">);
246
247
248   }
249
250
251
252
253 });
254
255
256 </span><span class="jsdoc-comment">/*
257  * @class Roo.lib.RGBColor
258  * @extends Roo.lib.Color
259  * Creates a Color specified in the RGB Color space, with an optional alpha
260  * component. The parameters are:
261  *
262  * r - the red component, clipped to the range [0,255]
263  * g - the green component, clipped to the range [0,255]
264  * b - the blue component, clipped to the range [0,255]
265  * a - the alpha component, clipped to the range [0,1] - this parameter is
266  *     optional and defaults to 1
267  */
268 </span><span class="jsdoc-var">Roo.lib.RGBColor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">g</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">){
269
270   </span><span class="jsdoc-comment">// store the alpha component after clipping it if necessary
271   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">alpha </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? 1 : </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(1, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">)));
272
273   </span><span class="jsdoc-comment">// store the RGB components after clipping them if necessary
274   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
275       {
276         </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(255, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">)),
277         </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(255, </span><span class="jsdoc-var">g</span><span class="jsdoc-syntax">)),
278         </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(255, </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">))
279       };
280
281   </span><span class="jsdoc-comment">// initialise the HSV and HSL components to null
282   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
283   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
284
285   </span><span class="jsdoc-comment">/* 
286    * //private returns the HSV or HSL hue component of this RGBColor. The hue is in the
287    * range [0,360). The parameters are:
288    *
289    * maximum - the maximum of the RGB component values
290    * range   - the range of the RGB component values
291    */
292   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">getHue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maximum</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">){
293
294     </span><span class="jsdoc-comment">// check whether the range is zero
295     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">== 0){
296
297       </span><span class="jsdoc-comment">// set the hue to zero (any hue is acceptable as the Color is grey)
298       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">= 0;
299
300     }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
301
302       </span><span class="jsdoc-comment">// determine which of the components has the highest value and set the hue
303       </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maximum</span><span class="jsdoc-syntax">){
304
305         </span><span class="jsdoc-comment">// red has the highest value
306         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">:
307           </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">rgb.g </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">* 60;
308           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">&lt; 0) </span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">+= 360;
309           </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
310
311         </span><span class="jsdoc-comment">// green has the highest value
312         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">:
313           </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">rgb.b </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">* 60 + 120;
314           </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
315
316         </span><span class="jsdoc-comment">// blue has the highest value
317         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">:
318           </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">rgb.r </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">* 60 + 240;
319           </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
320
321       }
322
323     }
324
325     </span><span class="jsdoc-comment">// return the hue
326     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">hue</span><span class="jsdoc-syntax">;
327
328   }
329
330   </span><span class="jsdoc-comment">/* //private Calculates and stores the HSV components of this RGBColor so that they can
331    * be returned be the getHSV function.
332    */
333   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSV</span><span class="jsdoc-syntax">(){
334
335     </span><span class="jsdoc-comment">// get the maximum and range of the RGB component values
336     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">);
337     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range   </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">);
338
339     </span><span class="jsdoc-comment">// store the HSV components
340     </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">=
341         {
342           </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">getHue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maximum</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">),
343           </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">== 0 ? 0 : 100 * </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">maximum</span><span class="jsdoc-syntax">),
344           </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">/ 2.55
345         };
346
347   }
348
349   </span><span class="jsdoc-comment">/* //private Calculates and stores the HSL components of this RGBColor so that they can
350    * be returned be the getHSL function.
351    */
352   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSL</span><span class="jsdoc-syntax">(){
353
354     </span><span class="jsdoc-comment">// get the maximum and range of the RGB component values
355     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">);
356     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range   </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">);
357
358     </span><span class="jsdoc-comment">// determine the lightness in the range [0,1]
359     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">/ 255 - </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">/ 510;
360
361     </span><span class="jsdoc-comment">// store the HSL components
362     </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">=
363         {
364           </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">getHue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maximum</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">),
365           </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">== 0 ? 0 : </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">/ 2.55 / (</span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">&lt; 0.5 ? </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">* 2 : 2 - </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">* 2)),
366           </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: 100 * </span><span class="jsdoc-var">l
367         </span><span class="jsdoc-syntax">};
368
369   }
370
371   </span><span class="jsdoc-comment">/**
372    * @returns the RGB and alpha components of this RGBColor as an object with r,
373    * g, b, and a properties. r, g, and b are in the range [0,255] and a is in
374    * the range [0,1].
375    */
376   </span><span class="jsdoc-var">this.getRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
377
378     </span><span class="jsdoc-comment">// return the RGB components
379     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
380       </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">,
381       </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">,
382       </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">,
383       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
384     </span><span class="jsdoc-syntax">};
385
386   };
387
388   </span><span class="jsdoc-comment">/**
389    * @returns the HSV and alpha components of this RGBColor as an object with h,
390    * s, v, and a properties. h is in the range [0,360), s and v are in the range
391    * [0,100], and a is in the range [0,1].
392    */
393   </span><span class="jsdoc-var">this.getHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
394
395     </span><span class="jsdoc-comment">// calculate the HSV components if necessary
396     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) </span><span class="jsdoc-var">calculateHSV</span><span class="jsdoc-syntax">();
397
398     </span><span class="jsdoc-comment">// return the HSV components
399     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
400       </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
401       </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.s</span><span class="jsdoc-syntax">,
402       </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">,
403       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
404     </span><span class="jsdoc-syntax">};
405
406   };
407
408   </span><span class="jsdoc-comment">/**
409    * @returns the HSL and alpha components of this RGBColor as an object with h,
410    * s, l, and a properties. h is in the range [0,360), s and l are in the range
411    * [0,100], and a is in the range [0,1].
412    */
413   </span><span class="jsdoc-var">this.getHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
414
415     </span><span class="jsdoc-comment">// calculate the HSV components if necessary
416     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) </span><span class="jsdoc-var">calculateHSL</span><span class="jsdoc-syntax">();
417
418     </span><span class="jsdoc-comment">// return the HSL components
419     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
420       </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
421       </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">,
422       </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">,
423       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
424     </span><span class="jsdoc-syntax">};
425
426   };
427
428 }
429 </span><span class="jsdoc-comment">// this does an 'exteds'
430 </span><span class="jsdoc-var">Roo.lib.RGBColor.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Color</span><span class="jsdoc-syntax">();
431
432
433 </span><span class="jsdoc-comment">/*
434  * @class Roo.lib.HSVColor
435  * @extends Roo.lib.Color
436  * Creates a Color specified in the HSV Color space, with an optional alpha
437  * component. The parameters are:
438  *
439  * h - the hue component, wrapped to the range [0,360)
440  * s - the saturation component, clipped to the range [0,100]
441  * v - the value component, clipped to the range [0,100]
442  * a - the alpha component, clipped to the range [0,1] - this parameter is
443  *     optional and defaults to 1
444  */
445 </span><span class="jsdoc-var">Roo.lib.HSVColor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">){
446
447   </span><span class="jsdoc-comment">// store the alpha component after clipping it if necessary
448   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">alpha </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? 1 : </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(1, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">)));
449
450   </span><span class="jsdoc-comment">// store the HSV components after clipping or wrapping them if necessary
451   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">=
452       {
453         </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">% 360 + 360) % 360,
454         </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(100, </span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">)),
455         </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(100, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">))
456       };
457
458   </span><span class="jsdoc-comment">// initialise the RGB and HSL components to null
459   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
460   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
461
462   </span><span class="jsdoc-comment">/* Calculates and stores the RGB components of this HSVColor so that they can
463    * be returned be the getRGB function.
464    */
465   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateRGB</span><span class="jsdoc-syntax">(){
466
467     </span><span class="jsdoc-comment">// check whether the saturation is zero
468     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">== 0){
469
470       </span><span class="jsdoc-comment">// set the Color to the appropriate shade of grey
471       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">;
472       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">;
473       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">;
474
475     }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
476
477       </span><span class="jsdoc-comment">// set some temporary values
478       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.h </span><span class="jsdoc-syntax">/ 60 - </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.h </span><span class="jsdoc-syntax">/ 60);
479       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">* (1 - </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">/ 100);
480       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">q  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">* (1 - </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">/ 100 * </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">);
481       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">* (1 - </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">/ 100 * (1 - </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">));
482
483       </span><span class="jsdoc-comment">// set the RGB Color components to their temporary values
484       </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.h </span><span class="jsdoc-syntax">/ 60)){
485         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">0: </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
486         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">1: </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
487         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">2: </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
488         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">3: </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
489         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">4: </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
490         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">5: </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">; </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
491       }
492
493     }
494
495     </span><span class="jsdoc-comment">// store the RGB components
496     </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
497         {
498           </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">* 2.55,
499           </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">* 2.55,
500           </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">* 2.55
501         };
502
503   }
504
505   </span><span class="jsdoc-comment">/* Calculates and stores the HSL components of this HSVColor so that they can
506    * be returned be the getHSL function.
507    */
508   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSL</span><span class="jsdoc-syntax">(){
509
510     </span><span class="jsdoc-comment">// determine the lightness in the range [0,100]
511     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= (2 - </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">/ 100) * </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">/ 2;
512
513     </span><span class="jsdoc-comment">// store the HSL components
514     </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">=
515         {
516           </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
517           </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">hsv.v </span><span class="jsdoc-syntax">/ (</span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">&lt; 50 ? </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">* 2 : 200 - </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">* 2),
518           </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">l
519         </span><span class="jsdoc-syntax">};
520
521     </span><span class="jsdoc-comment">// correct a division-by-zero error
522     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isNaN</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">)) </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">= 0;
523
524   }
525
526   </span><span class="jsdoc-comment">/**
527    * @returns the RGB and alpha components of this HSVColor as an object with r,
528    * g, b, and a properties. r, g, and b are in the range [0,255] and a is in
529    * the range [0,1].
530    */
531   </span><span class="jsdoc-var">this.getRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
532
533     </span><span class="jsdoc-comment">// calculate the RGB components if necessary
534     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) </span><span class="jsdoc-var">calculateRGB</span><span class="jsdoc-syntax">();
535
536     </span><span class="jsdoc-comment">// return the RGB components
537     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
538       </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">,
539       </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">,
540       </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">,
541       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
542     </span><span class="jsdoc-syntax">};
543
544   };
545
546   </span><span class="jsdoc-comment">/**
547    * @returns the HSV and alpha components of this HSVColor as an object with h,
548    * s, v, and a properties. h is in the range [0,360), s and v are in the range
549    * [0,100], and a is in the range [0,1].
550    */
551   </span><span class="jsdoc-var">this.getHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
552
553     </span><span class="jsdoc-comment">// return the HSV components
554     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
555       </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
556       </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.s</span><span class="jsdoc-syntax">,
557       </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">,
558       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
559     </span><span class="jsdoc-syntax">};
560
561   };
562
563   </span><span class="jsdoc-comment">/**
564    * @returns the HSL and alpha components of this HSVColor as an object with h,
565    * s, l, and a properties. h is in the range [0,360), s and l are in the range
566    * [0,100], and a is in the range [0,1].
567    */
568   </span><span class="jsdoc-var">this.getHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
569
570     </span><span class="jsdoc-comment">// calculate the HSL components if necessary
571     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) </span><span class="jsdoc-var">calculateHSL</span><span class="jsdoc-syntax">();
572
573     </span><span class="jsdoc-comment">// return the HSL components
574     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
575       </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
576       </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">,
577       </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">,
578       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
579     </span><span class="jsdoc-syntax">};
580
581   };
582
583 }
584 </span><span class="jsdoc-var">Roo.lib.HSVColor.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Color</span><span class="jsdoc-syntax">();
585
586
587 </span><span class="jsdoc-comment">/**
588  * @class Roo.lib.HSLColor
589  * @extends Roo.lib.Color
590  * 
591  * Creates a Color specified in the HSL Color space, with an optional alpha
592  * component. The parameters are:
593  *
594  * h - the hue component, wrapped to the range [0,360)
595  * s - the saturation component, clipped to the range [0,100]
596  * l - the lightness component, clipped to the range [0,100]
597  * a - the alpha component, clipped to the range [0,1] - this parameter is
598  *     optional and defaults to 1
599  */
600
601 </span><span class="jsdoc-var">Roo.lib.HSLColor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">){
602
603   </span><span class="jsdoc-comment">// store the alpha component after clipping it if necessary
604   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">alpha </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? 1 : </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(1, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">)));
605
606   </span><span class="jsdoc-comment">// store the HSL components after clipping or wrapping them if necessary
607   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">=
608       {
609         </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">% 360 + 360) % 360,
610         </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(100, </span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">)),
611         </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(100, </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">))
612       };
613
614   </span><span class="jsdoc-comment">// initialise the RGB and HSV components to null
615   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
616   </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
617
618   </span><span class="jsdoc-comment">/* Calculates and stores the RGB components of this HSLColor so that they can
619    * be returned be the getRGB function.
620    */
621   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateRGB</span><span class="jsdoc-syntax">(){
622
623     </span><span class="jsdoc-comment">// check whether the saturation is zero
624     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">== 0){
625
626       </span><span class="jsdoc-comment">// store the RGB components representing the appropriate shade of grey
627       </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
628           {
629             </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">* 2.55,
630             </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">* 2.55,
631             </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">* 2.55
632           };
633
634     }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
635
636       </span><span class="jsdoc-comment">// set some temporary values
637       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">&lt; 50
638             ? </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">* (1 + </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">/ 100)
639             : </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">/ 100;
640       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">q </span><span class="jsdoc-syntax">= 2 * </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">;
641
642       </span><span class="jsdoc-comment">// initialise the RGB components
643       </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
644           {
645             </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">+ 120) / 60 % 6,
646             </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">/ 60,
647             </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">+ 240) / 60 % 6
648           };
649
650       </span><span class="jsdoc-comment">// loop over the RGB components
651       </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">key </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">){
652
653         </span><span class="jsdoc-comment">// ensure that the property is not inherited from the root object
654         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb.hasOwnProperty</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">)){
655
656           </span><span class="jsdoc-comment">// set the component to its value in the range [0,100]
657           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] &lt; 1){
658             </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">q </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">];
659           }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] &lt; 3){
660             </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">;
661           }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] &lt; 4){
662             </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">q </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">) * (4 - </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">]);
663           }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
664             </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">;
665           }
666
667           </span><span class="jsdoc-comment">// set the component to its value in the range [0,255]
668           </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] *= 2.55;
669
670         }
671
672       }
673
674     }
675
676   }
677
678   </span><span class="jsdoc-comment">/* Calculates and stores the HSV components of this HSLColor so that they can
679    * be returned be the getHSL function.
680    */
681   </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSV</span><span class="jsdoc-syntax">(){
682
683     </span><span class="jsdoc-comment">// set a temporary value
684     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">* (</span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">&lt; 50 ? </span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">: 100 - </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">) / 100;
685
686     </span><span class="jsdoc-comment">// store the HSV components
687     </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">=
688         {
689           </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
690           </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: 200 * </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">/ (</span><span class="jsdoc-var">hsl.l </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">),
691           </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hsl.l
692         </span><span class="jsdoc-syntax">};
693
694     </span><span class="jsdoc-comment">// correct a division-by-zero error
695     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isNaN</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.s</span><span class="jsdoc-syntax">)) </span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">= 0;
696
697   }
698
699   </span><span class="jsdoc-comment">/**
700    * @returns the RGB and alpha components of this HSLColor as an object with r,
701    * g, b, and a properties. r, g, and b are in the range [0,255] and a is in
702    * the range [0,1].
703    */
704   </span><span class="jsdoc-var">this.getRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
705
706     </span><span class="jsdoc-comment">// calculate the RGB components if necessary
707     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) </span><span class="jsdoc-var">calculateRGB</span><span class="jsdoc-syntax">();
708
709     </span><span class="jsdoc-comment">// return the RGB components
710     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
711       </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">,
712       </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">,
713       </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">,
714       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
715     </span><span class="jsdoc-syntax">};
716
717   };
718
719   </span><span class="jsdoc-comment">/**
720    * @returns the HSV and alpha components of this HSLColor as an object with h,
721    * s, v, and a properties. h is in the range [0,360), s and v are in the range
722    * [0,100], and a is in the range [0,1].
723    */
724   </span><span class="jsdoc-var">this.getHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
725
726     </span><span class="jsdoc-comment">// calculate the HSV components if necessary
727     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) </span><span class="jsdoc-var">calculateHSV</span><span class="jsdoc-syntax">();
728
729     </span><span class="jsdoc-comment">// return the HSV components
730     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
731       </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
732       </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.s</span><span class="jsdoc-syntax">,
733       </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">,
734       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
735     </span><span class="jsdoc-syntax">};
736
737   };
738
739   </span><span class="jsdoc-comment">/**
740    * @returns the HSL and alpha components of this HSLColor as an object with h,
741    * s, l, and a properties. h is in the range [0,360), s and l are in the range
742    * [0,100], and a is in the range [0,1].
743    */
744   </span><span class="jsdoc-var">this.getHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
745
746     </span><span class="jsdoc-comment">// return the HSL components
747     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
748       </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
749       </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">,
750       </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">,
751       </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
752     </span><span class="jsdoc-syntax">};
753
754   };
755
756 }
757 </span><span class="jsdoc-var">Roo.lib.HSLColor.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Color</span><span class="jsdoc-syntax">();</span></code></body></html>
RooJS - Version 1