Fix #5654 - roojspacker - get it working as a doc tool...
[roojs1] / docs.old / symbols / src / Roo_lib_Color.js.html
diff --git a/docs.old/symbols/src/Roo_lib_Color.js.html b/docs.old/symbols/src/Roo_lib_Color.js.html
new file mode 100644 (file)
index 0000000..da10499
--- /dev/null
@@ -0,0 +1,719 @@
+<html><head><title>../roojs1/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">/*
+
+Colour.js
+
+Functions for colour handling and processing.
+
+http://www.safalra.com/web-design/javascript/colour-handling-and-processing/
+
+The author of this program, Safalra (Stephen Morley), irrevocably releases all
+rights to this program, with the intention of it becoming part of the public
+domain. Because this program is released into the public domain, it comes with
+no warranty either expressed or implied, to the extent permitted by law.
+
+For more free and public domain JavaScript code by the same author, visit:
+http://www.safalra.com/web-design/javascript/
+
+*/
+
+
+/* An abstract Colour implementation. Concrete Colour implementations should use
+ * an instance of this function as their prototype, and implement the getRGB and
+ * getHSL functions. getRGB should return an object representing the RGB
+ * components of this Colour, with the red, green, and blue components in the
+ * range [0,255] and the alpha component in the range [0,100]. getHSL should
+ * return an object representing the HSL components of this Colour, with the hue
+ * component in the range [0,360), the saturation and lightness components in
+ * the range [0,100], and the alpha component in the range [0,1].
+ */
+</span><span class="jsdoc-var">Roo.lib.Colour </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+  </span><span class="jsdoc-comment">/* Returns an object representing the RGBA components of this Colour. The red,
+   * green, and blue components are converted to integers in the range [0,255].
+   * The alpha is a value in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getIntegerRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the RGB components of this colour
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the integer components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </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">),
+      </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">),
+      </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">),
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.a
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns an object representing the RGBA components of this Colour. The red,
+   * green, and blue components are converted to numbers in the range [0,100].
+   * The alpha is a value in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getPercentageRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the RGB components of this colour
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the percentage components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </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,
+      </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,
+      </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,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.a
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns a string representing this Colour as a CSS hexadecimal RGB colour
+   * value - that is, a string of the form #RRGGBB where each of RR, GG, and BB
+   * are two-digit hexadecimal numbers.
+   */
+  </span><span class="jsdoc-var">this.getCSSHexadecimalRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the integer RGB components
+    </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">();
+
+    </span><span class="jsdoc-comment">// determine the hexadecimal equivalents
+    </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);
+    </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);
+    </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);
+
+    </span><span class="jsdoc-comment">// return the CSS RGB colour value
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'#'
+        </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">)
+        + (</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">)
+        + (</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">);
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns a string representing this Colour as a CSS integer RGB colour
+   * value - that is, a string of the form rgb(r,g,b) where each of r, g, and b
+   * are integers in the range [0,255].
+   */
+  </span><span class="jsdoc-var">this.getCSSIntegerRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the integer RGB components
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the CSS RGB colour value
+    </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-comment">/* Returns a string representing this Colour as a CSS integer RGBA colour
+   * value - that is, a string of the form rgba(r,g,b,a) where each of r, g, and
+   * b are integers in the range [0,255] and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getCSSIntegerRGBA </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the integer RGB components
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the CSS integer RGBA colour value
+    </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">;
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns a string representing this Colour as a CSS percentage RGB colour
+   * value - that is, a string of the form rgb(r%,g%,b%) where each of r, g, and
+   * b are in the range [0,100].
+   */
+  </span><span class="jsdoc-var">this.getCSSPercentageRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the percentage RGB components
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the CSS RGB colour value
+    </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-comment">/* Returns a string representing this Colour as a CSS percentage RGBA colour
+   * value - that is, a string of the form rgba(r%,g%,b%,a) where each of r, g,
+   * and b are in the range [0,100] and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getCSSPercentageRGBA </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the percentage RGB components
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the CSS percentage RGBA colour value
+    </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">;
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns a string representing this Colour as a CSS HSL colour value - that
+   * is, a string of the form hsl(h,s%,l%) where h is in the range [0,100] and
+   * s and l are in the range [0,100].
+   */
+  </span><span class="jsdoc-var">this.getCSSHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the HSL components
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the CSS HSL colour value
+    </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-comment">/* Returns a string representing this Colour as a CSS HSLA colour value - that
+   * is, a string of the form hsla(h,s%,l%,a) where h is in the range [0,100],
+   * s and l are in the range [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getCSSHSLA </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the HSL components
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the CSS HSL colour value
+    </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">;
+
+  };
+
+  </span><span class="jsdoc-comment">/* Sets the colour of the specified node to this Colour. This functions sets
+   * the CSS 'color' property for the node. The parameter is:
+   *
+   * node - the node whose colour should be set
+   */
+  </span><span class="jsdoc-var">this.setNodeColour </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">){
+
+    </span><span class="jsdoc-comment">// set the colour of the node
+    </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">();
+
+  };
+
+  </span><span class="jsdoc-comment">/* Sets the background colour of the specified node to this Colour. This
+   * functions sets the CSS 'background-color' property for the node. The
+   * parameter is:
+   *
+   * node - the node whose background colour should be set
+   */
+  </span><span class="jsdoc-var">this.setNodeBackgroundColour </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">){
+
+    </span><span class="jsdoc-comment">// set the background colour of the node
+    </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">();
+
+  };
+  </span><span class="jsdoc-comment">// convert between formats..
+  </span><span class="jsdoc-var">this.toRGB</span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+  {
+    </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">();
+    </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.RGBColour</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">);
+    
+  }
+  </span><span class="jsdoc-var">this.toHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+  {
+     </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">();
+  </span><span class="jsdoc-comment">// return the CSS HSL colour value
+    </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.HSLColour</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">);
+    
+  }
+  
+  </span><span class="jsdoc-var">this.toHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+  {
+    </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">();
+    </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">();
+   </span><span class="jsdoc-comment">// return the CSS HSL colour value
+    </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.HSVColour</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">);
+    
+  }
+  
+  </span><span class="jsdoc-comment">// modify  v = 0 ... 1 (eg. 0.5)
+    </span><span class="jsdoc-var">this.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">)
+    {
+        </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">();
+        </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">();
+        </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.lib.HSVColour</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">);
+        
+    
+    }
+  
+   
+  
+
+}
+
+
+</span><span class="jsdoc-comment">/* Creates a colour specified in the RGB colour space, with an optional alpha
+ * component. The parameters are:
+ *
+ * r - the red component, clipped to the range [0,255]
+ * g - the green component, clipped to the range [0,255]
+ * b - the blue component, clipped to the range [0,255]
+ * a - the alpha component, clipped to the range [0,1] - this parameter is
+ *     optional and defaults to 1
+ */
+</span><span class="jsdoc-var">Roo.lib.RGBColour </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">){
+
+  </span><span class="jsdoc-comment">// store the alpha component after clipping it if necessary
+  </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">)));
+
+  </span><span class="jsdoc-comment">// store the RGB components after clipping them if necessary
+  </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
+      {
+        </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">)),
+        </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">)),
+        </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">))
+      };
+
+  </span><span class="jsdoc-comment">// initialise the HSV and HSL components to null
+  </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">;
+  </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">;
+
+  </span><span class="jsdoc-comment">/* Returns the HSV or HSL hue component of this RGBColour. The hue is in the
+   * range [0,360). The parameters are:
+   *
+   * maximum - the maximum of the RGB component values
+   * range   - the range of the RGB component values
+   */
+  </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">){
+
+    </span><span class="jsdoc-comment">// check whether the range is zero
+    </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">== 0){
+
+      </span><span class="jsdoc-comment">// set the hue to zero (any hue is acceptable as the colour is grey)
+      </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hue </span><span class="jsdoc-syntax">= 0;
+
+    }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+
+      </span><span class="jsdoc-comment">// determine which of the components has the highest value and set the hue
+      </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maximum</span><span class="jsdoc-syntax">){
+
+        </span><span class="jsdoc-comment">// red has the highest value
+        </span><span class="jsdoc-keyword">case </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">:
+          </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;
+          </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;
+          </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+
+        </span><span class="jsdoc-comment">// green has the highest value
+        </span><span class="jsdoc-keyword">case </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">:
+          </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;
+          </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+
+        </span><span class="jsdoc-comment">// blue has the highest value
+        </span><span class="jsdoc-keyword">case </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">:
+          </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;
+          </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+
+      }
+
+    }
+
+    </span><span class="jsdoc-comment">// return the hue
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">hue</span><span class="jsdoc-syntax">;
+
+  }
+
+  </span><span class="jsdoc-comment">/* Calculates and stores the HSV components of this RGBColour so that they can
+   * be returned be the getHSV function.
+   */
+  </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSV</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the maximum and range of the RGB component values
+    </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">);
+    </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">);
+
+    </span><span class="jsdoc-comment">// store the HSV components
+    </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">=
+        {
+          </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">),
+          </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">),
+          </span><span class="jsdoc-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">maximum </span><span class="jsdoc-syntax">/ 2.55
+        };
+
+  }
+
+  </span><span class="jsdoc-comment">/* Calculates and stores the HSL components of this RGBColour so that they can
+   * be returned be the getHSL function.
+   */
+  </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSL</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// get the maximum and range of the RGB component values
+    </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">);
+    </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">);
+
+    </span><span class="jsdoc-comment">// determine the lightness in the range [0,1]
+    </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;
+
+    </span><span class="jsdoc-comment">// store the HSL components
+    </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">=
+        {
+          </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">),
+          </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)),
+          </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: 100 * </span><span class="jsdoc-var">l
+        </span><span class="jsdoc-syntax">};
+
+  }
+
+  </span><span class="jsdoc-comment">/* Returns the RGB and alpha components of this RGBColour as an object with r,
+   * g, b, and a properties. r, g, and b are in the range [0,255] and a is in
+   * the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// return the RGB components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns the HSV and alpha components of this RGBColour as an object with h,
+   * s, v, and a properties. h is in the range [0,360), s and v are in the range
+   * [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// calculate the HSV components if necessary
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the HSV components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
+      </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-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns the HSL and alpha components of this RGBColour as an object with h,
+   * s, l, and a properties. h is in the range [0,360), s and l are in the range
+   * [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// calculate the HSV components if necessary
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the HSL components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+}
+</span><span class="jsdoc-var">Roo.lib.RGBColour.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Colour</span><span class="jsdoc-syntax">();
+
+
+</span><span class="jsdoc-comment">/* Creates a colour specified in the HSV colour space, with an optional alpha
+ * component. The parameters are:
+ *
+ * h - the hue component, wrapped to the range [0,360)
+ * s - the saturation component, clipped to the range [0,100]
+ * v - the value component, clipped to the range [0,100]
+ * a - the alpha component, clipped to the range [0,1] - this parameter is
+ *     optional and defaults to 1
+ */
+</span><span class="jsdoc-var">Roo.lib.HSVColour </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">){
+
+  </span><span class="jsdoc-comment">// store the alpha component after clipping it if necessary
+  </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">)));
+
+  </span><span class="jsdoc-comment">// store the HSV components after clipping or wrapping them if necessary
+  </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">=
+      {
+        </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,
+        </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">)),
+        </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">))
+      };
+
+  </span><span class="jsdoc-comment">// initialise the RGB and HSL components to null
+  </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">;
+  </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">;
+
+  </span><span class="jsdoc-comment">/* Calculates and stores the RGB components of this HSVColour so that they can
+   * be returned be the getRGB function.
+   */
+  </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateRGB</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// check whether the saturation is zero
+    </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsv.s </span><span class="jsdoc-syntax">== 0){
+
+      </span><span class="jsdoc-comment">// set the colour to the appropriate shade of grey
+      </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">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">hsv.v</span><span class="jsdoc-syntax">;
+
+    }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+
+      </span><span class="jsdoc-comment">// set some temporary values
+      </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);
+      </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);
+      </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">);
+      </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">));
+
+      </span><span class="jsdoc-comment">// set the RGB colour components to their temporary values
+      </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)){
+        </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">;
+        </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">;
+        </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">;
+        </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">;
+        </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">;
+        </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">;
+      }
+
+    }
+
+    </span><span class="jsdoc-comment">// store the RGB components
+    </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
+        {
+          </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">* 2.55,
+          </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">* 2.55,
+          </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">* 2.55
+        };
+
+  }
+
+  </span><span class="jsdoc-comment">/* Calculates and stores the HSL components of this HSVColour so that they can
+   * be returned be the getHSL function.
+   */
+  </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSL</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// determine the lightness in the range [0,100]
+    </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;
+
+    </span><span class="jsdoc-comment">// store the HSL components
+    </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">=
+        {
+          </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
+          </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),
+          </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">l
+        </span><span class="jsdoc-syntax">};
+
+    </span><span class="jsdoc-comment">// correct a division-by-zero error
+    </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;
+
+  }
+
+  </span><span class="jsdoc-comment">/* Returns the RGB and alpha components of this HSVColour as an object with r,
+   * g, b, and a properties. r, g, and b are in the range [0,255] and a is in
+   * the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// calculate the RGB components if necessary
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the RGB components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns the HSV and alpha components of this HSVColour as an object with h,
+   * s, v, and a properties. h is in the range [0,360), s and v are in the range
+   * [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// return the HSV components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
+      </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-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns the HSL and alpha components of this HSVColour as an object with h,
+   * s, l, and a properties. h is in the range [0,360), s and l are in the range
+   * [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// calculate the HSL components if necessary
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the HSL components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+}
+</span><span class="jsdoc-var">Roo.lib.HSVColour.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Colour</span><span class="jsdoc-syntax">();
+
+
+</span><span class="jsdoc-comment">/* Creates a colour specified in the HSL colour space, with an optional alpha
+ * component. The parameters are:
+ *
+ * h - the hue component, wrapped to the range [0,360)
+ * s - the saturation component, clipped to the range [0,100]
+ * l - the lightness component, clipped to the range [0,100]
+ * a - the alpha component, clipped to the range [0,1] - this parameter is
+ *     optional and defaults to 1
+ */
+
+</span><span class="jsdoc-var">Roo.lib.HSLColour </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">){
+
+  </span><span class="jsdoc-comment">// store the alpha component after clipping it if necessary
+  </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">)));
+
+  </span><span class="jsdoc-comment">// store the HSL components after clipping or wrapping them if necessary
+  </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hsl </span><span class="jsdoc-syntax">=
+      {
+        </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,
+        </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">)),
+        </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">))
+      };
+
+  </span><span class="jsdoc-comment">// initialise the RGB and HSV components to null
+  </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">;
+  </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">;
+
+  </span><span class="jsdoc-comment">/* Calculates and stores the RGB components of this HSLColour so that they can
+   * be returned be the getRGB function.
+   */
+  </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateRGB</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// check whether the saturation is zero
+    </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hsl.s </span><span class="jsdoc-syntax">== 0){
+
+      </span><span class="jsdoc-comment">// store the RGB components representing the appropriate shade of grey
+      </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
+          {
+            </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,
+            </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,
+            </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
+          };
+
+    }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+
+      </span><span class="jsdoc-comment">// set some temporary values
+      </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
+            ? </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)
+            : </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;
+      </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">;
+
+      </span><span class="jsdoc-comment">// initialise the RGB components
+      </span><span class="jsdoc-var">rgb </span><span class="jsdoc-syntax">=
+          {
+            </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,
+            </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">/ 60,
+            </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
+          };
+
+      </span><span class="jsdoc-comment">// loop over the RGB components
+      </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">){
+
+        </span><span class="jsdoc-comment">// ensure that the property is not inherited from the root object
+        </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">)){
+
+          </span><span class="jsdoc-comment">// set the component to its value in the range [0,100]
+          </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){
+            </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">];
+          }</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){
+            </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">;
+          }</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){
+            </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">]);
+          }</span><span class="jsdoc-keyword">else</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">] = </span><span class="jsdoc-var">q</span><span class="jsdoc-syntax">;
+          }
+
+          </span><span class="jsdoc-comment">// set the component to its value in the range [0,255]
+          </span><span class="jsdoc-var">rgb</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">] *= 2.55;
+
+        }
+
+      }
+
+    }
+
+  }
+
+  </span><span class="jsdoc-comment">/* Calculates and stores the HSV components of this HSLColour so that they can
+   * be returned be the getHSL function.
+   */
+  </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">calculateHSV</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// set a temporary value
+    </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;
+
+    </span><span class="jsdoc-comment">// store the HSV components
+    </span><span class="jsdoc-var">hsv </span><span class="jsdoc-syntax">=
+        {
+          </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
+          </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">),
+          </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
+        </span><span class="jsdoc-syntax">};
+
+    </span><span class="jsdoc-comment">// correct a division-by-zero error
+    </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;
+
+  }
+
+  </span><span class="jsdoc-comment">/* Returns the RGB and alpha components of this HSLColour as an object with r,
+   * g, b, and a properties. r, g, and b are in the range [0,255] and a is in
+   * the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getRGB </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// calculate the RGB components if necessary
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the RGB components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'r' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.r</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'g' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.g</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'b' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rgb.b</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns the HSV and alpha components of this HSLColour as an object with h,
+   * s, v, and a properties. h is in the range [0,360), s and v are in the range
+   * [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getHSV </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// calculate the HSV components if necessary
+    </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">();
+
+    </span><span class="jsdoc-comment">// return the HSV components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.h</span><span class="jsdoc-syntax">,
+      </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-string">'v' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsv.v</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+  </span><span class="jsdoc-comment">/* Returns the HSL and alpha components of this HSLColour as an object with h,
+   * s, l, and a properties. h is in the range [0,360), s and l are in the range
+   * [0,100], and a is in the range [0,1].
+   */
+  </span><span class="jsdoc-var">this.getHSL </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+
+    </span><span class="jsdoc-comment">// return the HSL components
+    </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
+      </span><span class="jsdoc-string">'h' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.h</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'s' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.s</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'l' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">hsl.l</span><span class="jsdoc-syntax">,
+      </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">alpha
+    </span><span class="jsdoc-syntax">};
+
+  };
+
+}
+</span><span class="jsdoc-var">Roo.lib.HSLColour.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Colour</span><span class="jsdoc-syntax">();</span></code></body></html>
\ No newline at end of file