1 <?xml version=
"1.0" encoding=
"utf-8" ?>
2 <!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4 <html xmlns=
"http://www.w3.org/1999/xhtml" xml:
lang=
"en" lang=
"en">
6 <meta http-equiv=
"Content-Type" content=
"text/html; charset=utf-8" />
7 <meta name=
"generator" content=
"Docutils 0.4: http://docutils.sourceforge.net/" />
8 <title>MochiKit.Color - color abstraction with CSS3 support
</title>
10 <link rel=
"stylesheet" href=
"../../../include/css/documentation.css" type=
"text/css" />
11 <script type=
"text/javascript" src=
"../../../packed/MochiKit/MochiKit.js"></script>
12 <script type=
"text/javascript" src=
"../../js/toc.js"></script>
15 <div class=
"document">
17 <h1><a id=
"name" name=
"name">Name
</a></h1>
18 <p>MochiKit.Color - color abstraction with CSS3 support
</p>
21 <h1><a id=
"synopsis" name=
"synopsis">Synopsis
</a></h1>
22 <pre class=
"literal-block">
23 // RGB color expressions are supported
25 objEqual(Color.whiteColor(), Color.fromString(
"rgb(
255,
100%,
255)
"))
28 // So is instantiating directly from HSL or RGB values.
29 // Note that fromRGB and fromHSL take numbers between
0.0 and
1.0!
30 assert( objEqual(Color.fromRGB(
1.0,
1.0,
1.0), Color.fromHSL(
0.0,
0.0,
1.0) );
32 // Or even SVG color keyword names, as per CSS3!
33 assert( Color.fromString(
"aquamarine
"),
"#
7fffd4
" );
35 // NSColor-like colors built in
36 assert( Color.whiteColor().toHexString() ==
"#ffffff
" );
40 <h1><a id=
"description" name=
"description">Description
</a></h1>
41 <p>MochiKit.Color is an abstraction for handling colors and strings that
45 <h1><a id=
"dependencies" name=
"dependencies">Dependencies
</a></h1>
47 <li><a class=
"mochiref reference" href=
"Base.html">MochiKit.Base
</a></li>
48 <li><a class=
"mochiref reference" href=
"DOM.html">MochiKit.DOM
</a></li>
49 <li><a class=
"mochiref reference" href=
"Style.html">MochiKit.Style
</a></li>
53 <h1><a id=
"overview" name=
"overview">Overview
</a></h1>
54 <p>MochiKit.Color provides an abstraction of RGB, HSL and HSV colors with
55 alpha. It supports parsing and generating of CSS3 colors, and has a
56 full CSS3 (SVG) color table.
</p>
57 <p>All of the functionality in this module is exposed through a Color
58 constructor and its prototype, but a few of its internals are
59 available for direct use at module level.
</p>
62 <h1><a id=
"api-reference" name=
"api-reference">API Reference
</a></h1>
64 <h2><a id=
"constructors" name=
"constructors">Constructors
</a></h2>
66 <a name=
"fn-color"></a>
67 <a class=
"mochidef reference" href=
"#fn-color">Color()
</a>:
</p>
69 <p>Represents a color. Component values should be integers between
70 <tt class=
"docutils literal"><span class=
"pre">0.0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>. You should use one of the
<a class=
"mochiref reference" href=
"#fn-color">Color
</a>
71 factory functions such as
<a class=
"mochiref reference" href=
"#fn-color.fromrgb">Color.fromRGB
</a>,
72 <a class=
"mochiref reference" href=
"#fn-color.fromhsl">Color.fromHSL
</a>, etc. instead of constructing
73 <a class=
"mochiref reference" href=
"#fn-color">Color
</a> objects directly.
</p>
74 <p><a class=
"mochiref reference" href=
"#fn-color">Color
</a> instances can be compared with
75 <a class=
"mochiref reference" href=
"Base.html#fn-compare">MochiKit.Base.compare
</a> (though ordering is on RGB, so
76 is not particularly meaningful except for equality), and the
77 default
<tt class=
"docutils literal"><span class=
"pre">toString
</span></tt> implementation returns
78 <a class=
"mochiref reference" href=
"#fn-color.prototype.tohexstring">Color.prototype.toHexString()
</a>.
</p>
79 <p><a class=
"mochiref reference" href=
"#fn-color">Color
</a> instances are immutable, and much of the
80 architecture is inspired by AppKit's NSColor
<a class=
"footnote-reference" href=
"#id6" id=
"id1" name=
"id1">[
1]
</a></p>
82 <dt><em>Availability
</em>:
</dt>
83 <dd>Available in MochiKit
1.3.1+
</dd>
87 <a name=
"fn-color.frombackground"></a>
88 <a class=
"mochidef reference" href=
"#fn-color.frombackground">Color.fromBackground(elem)
</a>:
</p>
90 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object based on the background of the
91 provided element. Equivalent to:
</p>
92 <pre class=
"literal-block">
93 c = Color.fromComputedStyle(
94 elem,
"backgroundColor
",
"background-color
") || Color.whiteColor();
97 <dt><em>Availability
</em>:
</dt>
98 <dd>Available in MochiKit
1.3.1+
</dd>
102 <a name=
"fn-color.fromcomputedstyle"></a>
103 <a class=
"mochidef reference" href=
"#fn-color.fromcomputedstyle">Color.fromComputedStyle(elem, style)
</a>:
</p>
105 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object based on the result of
106 <a class=
"mochiref reference" href=
"Style.html#fn-getstyle">MochiKit.Style.getStyle(elem, style)
</a> or
<tt class=
"docutils literal"><span class=
"pre">null
</span></tt> if not
108 <dl class=
"docutils">
109 <dt><em>Availability
</em>:
</dt>
110 <dd>Available in MochiKit
1.3.1+
</dd>
114 <a name=
"fn-color.fromhexstring"></a>
115 <a class=
"mochidef reference" href=
"#fn-color.fromhexstring">Color.fromHexString(hexString)
</a>:
</p>
117 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given hexadecimal
118 color string. For example,
<tt class=
"docutils literal"><span class=
"pre">"#FFFFFF
"</span></tt> would return a
119 <a class=
"mochiref reference" href=
"#fn-color">Color
</a> with RGB values
<tt class=
"docutils literal"><span class=
"pre">[
255/
255,
</span> <span class=
"pre">255/
255,
</span> <span class=
"pre">255/
255]
</span></tt>
121 <dl class=
"docutils">
122 <dt><em>Availability
</em>:
</dt>
123 <dd>Available in MochiKit
1.3.1+
</dd>
127 <a name=
"fn-color.fromhsl"></a>
128 <a class=
"mochidef reference" href=
"#fn-color.fromhsl">Color.fromHSL(hue, saturation, lightness, alpha=
1.0)
</a>:
</p>
130 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given
<tt class=
"docutils literal"><span class=
"pre">hue
</span></tt>,
131 <tt class=
"docutils literal"><span class=
"pre">saturation
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">lightness
</span></tt> values. Values should be numbers
132 between
<tt class=
"docutils literal"><span class=
"pre">0.0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>.
</p>
133 <p>If
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> is not given, then
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt> (completely opaque) will
135 <dl class=
"docutils">
136 <dt>Alternate form:
</dt>
137 <dd><a class=
"mochiref reference" href=
"#fn-color.fromhsl">Color.fromHSL({h: hue, s: saturation, l: lightness,
139 <dt><em>Availability
</em>:
</dt>
140 <dd>Available in MochiKit
1.3.1+
</dd>
144 <a name=
"fn-color.fromhslstring"></a>
145 <a class=
"mochidef reference" href=
"#fn-color.fromhslstring">Color.fromHSLString(hslString)
</a>:
</p>
147 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given decimal hsl
148 color string. For example,
<tt class=
"docutils literal"><span class=
"pre">"hsl(
0,
0%,
100%)
"</span></tt> would return a
149 <a class=
"mochiref reference" href=
"#fn-color">Color
</a> with HSL values
<tt class=
"docutils literal"><span class=
"pre">[
0/
360,
</span> <span class=
"pre">0/
360,
</span> <span class=
"pre">360/
360]
</span></tt>
151 <dl class=
"docutils">
152 <dt><em>Availability
</em>:
</dt>
153 <dd>Available in MochiKit
1.3.1+
</dd>
157 <a name=
"fn-color.fromhsv"></a>
158 <a class=
"mochidef reference" href=
"#fn-color.fromhsv">Color.fromHSV(hue, saturation, value, alpha=
1.0)
</a>:
</p>
160 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given
<tt class=
"docutils literal"><span class=
"pre">hue
</span></tt>,
161 <tt class=
"docutils literal"><span class=
"pre">saturation
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">value
</span></tt> values. Values should be numbers between
162 <tt class=
"docutils literal"><span class=
"pre">0.0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>.
</p>
163 <p>If
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> is not given, then
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt> (completely opaque) will
165 <dl class=
"docutils">
166 <dt>Alternate form:
</dt>
167 <dd><a class=
"mochiref reference" href=
"#fn-color.fromhsv">Color.fromHSV({h: hue, s: saturation, v: value, a:
169 <dt><em>Availability
</em>:
</dt>
170 <dd>Available in MochiKit
1.3.1+
</dd>
174 <a name=
"fn-color.fromname"></a>
175 <a class=
"mochidef reference" href=
"#fn-color.fromname">Color.fromName(colorName)
</a>:
</p>
177 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object corresponding to the given SVG
178 1.0 color keyword name
<a class=
"footnote-reference" href=
"#id7" id=
"id2" name=
"id2">[
2]
</a> as per the W3C CSS3 Color Module
179 <a class=
"footnote-reference" href=
"#id8" id=
"id3" name=
"id3">[
3]
</a>.
<tt class=
"docutils literal"><span class=
"pre">"transparent
"</span></tt> is also accepted as a color name, and will
180 return
<a class=
"mochiref reference" href=
"#fn-color.transparentcolor">Color.transparentColor()
</a>.
</p>
181 <dl class=
"docutils">
182 <dt><em>Availability
</em>:
</dt>
183 <dd>Available in MochiKit
1.3.1+
</dd>
187 <a name=
"fn-color.fromrgb"></a>
188 <a class=
"mochidef reference" href=
"#fn-color.fromrgb">Color.fromRGB(red, green, blue, alpha=
1.0)
</a>:
</p>
190 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given
<tt class=
"docutils literal"><span class=
"pre">red
</span></tt>,
191 <tt class=
"docutils literal"><span class=
"pre">green
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">blue
</span></tt>, and
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> values. Values should be
192 numbers between
<tt class=
"docutils literal"><span class=
"pre">0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>.
</p>
193 <p>If
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> is not given, then
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt> (completely opaque) will
195 <dl class=
"docutils">
196 <dt>Alternate form:
</dt>
197 <dd><a class=
"mochiref reference" href=
"#fn-color.fromrgb">Color.fromRGB({r: red, g: green, b: blue, a:
199 <dt><em>Availability
</em>:
</dt>
200 <dd>Available in MochiKit
1.3.1+
</dd>
204 <a name=
"fn-color.fromrgbstring"></a>
205 <a class=
"mochidef reference" href=
"#fn-color.fromrgbstring">Color.fromRGBString(rgbString)
</a>:
</p>
207 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given decimal rgb
208 color string. For example,
<tt class=
"docutils literal"><span class=
"pre">"rgb(
255,
255,
255)
"</span></tt> would return a
209 <a class=
"mochiref reference" href=
"#fn-color">Color
</a> with RGB values
<tt class=
"docutils literal"><span class=
"pre">[
255/
255,
</span> <span class=
"pre">255/
255,
</span> <span class=
"pre">255/
255]
</span></tt>
211 <dl class=
"docutils">
212 <dt><em>Availability
</em>:
</dt>
213 <dd>Available in MochiKit
1.3.1+
</dd>
217 <a name=
"fn-color.fromtext"></a>
218 <a class=
"mochidef reference" href=
"#fn-color.fromtext">Color.fromText(elem)
</a>:
</p>
220 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object based on the text color of the
221 provided element. Equivalent to:
</p>
222 <pre class=
"literal-block">
223 c = Color.fromComputedStyle(elem,
"color
") || Color.whiteColor();
225 <dl class=
"docutils">
226 <dt><em>Availability
</em>:
</dt>
227 <dd>Available in MochiKit
1.3.1+
</dd>
231 <a name=
"fn-color.fromstring"></a>
232 <a class=
"mochidef reference" href=
"#fn-color.fromstring">Color.fromString(rgbOrHexString)
</a>:
</p>
234 <p>Returns a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object from the given RGB, HSL, hex,
235 or name. Will return
<tt class=
"docutils literal"><span class=
"pre">null
</span></tt> if the string can not be parsed by
236 any of these methods.
</p>
237 <p>See
<a class=
"mochiref reference" href=
"#fn-color.fromhexstring">Color.fromHexString
</a>,
238 <a class=
"mochiref reference" href=
"#fn-color.fromrgbstring">Color.fromRGBString
</a>,
<a class=
"mochiref reference" href=
"#fn-color.fromhslstring">Color.fromHSLString
</a>
239 and
<a class=
"mochiref reference" href=
"#fn-color.fromname">Color.fromName
</a> more information.
</p>
240 <dl class=
"docutils">
241 <dt><em>Availability
</em>:
</dt>
242 <dd>Available in MochiKit
1.3.1+
</dd>
246 <a name=
"fn-color.namedcolors"></a>
247 <a class=
"mochidef reference" href=
"#fn-color.namedcolors">Color.namedColors()
</a>:
</p>
249 <p>Returns an object with properties for each SVG
1.0 color keyword
250 name
<a class=
"footnote-reference" href=
"#id7" id=
"id4" name=
"id4">[
2]
</a> supported by CSS3
<a class=
"footnote-reference" href=
"#id8" id=
"id5" name=
"id5">[
3]
</a>. Property names are the color
251 keyword name in lowercase, and the value is a string suitable for
252 <a class=
"mochiref reference" href=
"#fn-color.fromstring">Color.fromString()
</a>.
</p>
253 <dl class=
"docutils">
254 <dt><em>Availability
</em>:
</dt>
255 <dd>Available in MochiKit
1.3.1+
</dd>
259 <a name=
"fn-color.prototype.colorwithalpha"></a>
260 <a class=
"mochidef reference" href=
"#fn-color.prototype.colorwithalpha">Color.prototype.colorWithAlpha(alpha)
</a>:
</p>
262 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> based on this color, but with the
263 provided
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> value.
</p>
264 <dl class=
"docutils">
265 <dt><em>Availability
</em>:
</dt>
266 <dd>Available in MochiKit
1.3.1+
</dd>
270 <a name=
"fn-color.prototype.colorwithhue"></a>
271 <a class=
"mochidef reference" href=
"#fn-color.prototype.colorwithhue">Color.prototype.colorWithHue(hue)
</a>:
</p>
273 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> based on this color, but with the
274 provided
<tt class=
"docutils literal"><span class=
"pre">hue
</span></tt> value.
</p>
275 <dl class=
"docutils">
276 <dt><em>Availability
</em>:
</dt>
277 <dd>Available in MochiKit
1.3.1+
</dd>
281 <a name=
"fn-color.prototype.colorwithsaturation"></a>
282 <a class=
"mochidef reference" href=
"#fn-color.prototype.colorwithsaturation">Color.prototype.colorWithSaturation(saturation)
</a>:
</p>
284 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> based on this color, but with the
285 provided
<tt class=
"docutils literal"><span class=
"pre">saturation
</span></tt> value (using the HSL color model).
</p>
286 <dl class=
"docutils">
287 <dt><em>Availability
</em>:
</dt>
288 <dd>Available in MochiKit
1.3.1+
</dd>
292 <a name=
"fn-color.prototype.colorwithlightness"></a>
293 <a class=
"mochidef reference" href=
"#fn-color.prototype.colorwithlightness">Color.prototype.colorWithLightness(lightness)
</a>:
</p>
295 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> based on this color, but with the
296 provided
<tt class=
"docutils literal"><span class=
"pre">lightness
</span></tt> value.
</p>
297 <dl class=
"docutils">
298 <dt><em>Availability
</em>:
</dt>
299 <dd>Available in MochiKit
1.3.1+
</dd>
303 <a name=
"fn-color.prototype.darkercolorwithlevel"></a>
304 <a class=
"mochidef reference" href=
"#fn-color.prototype.darkercolorwithlevel">Color.prototype.darkerColorWithLevel(level)
</a>:
</p>
306 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> based on this color, but darker by
307 the given
<tt class=
"docutils literal"><span class=
"pre">level
</span></tt> (between
<tt class=
"docutils literal"><span class=
"pre">0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>).
</p>
308 <dl class=
"docutils">
309 <dt><em>Availability
</em>:
</dt>
310 <dd>Available in MochiKit
1.3.1+
</dd>
314 <a name=
"fn-color.prototype.lightercolorwithlevel"></a>
315 <a class=
"mochidef reference" href=
"#fn-color.prototype.lightercolorwithlevel">Color.prototype.lighterColorWithLevel(level)
</a>:
</p>
317 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> based on this color, but lighter by
318 the given
<tt class=
"docutils literal"><span class=
"pre">level
</span></tt> (between
<tt class=
"docutils literal"><span class=
"pre">0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>).
</p>
319 <dl class=
"docutils">
320 <dt><em>Availability
</em>:
</dt>
321 <dd>Available in MochiKit
1.3.1+
</dd>
325 <a name=
"fn-color.prototype.blendedcolor"></a>
326 <a class=
"mochidef reference" href=
"#fn-color.prototype.blendedcolor">Color.prototype.blendedColor(other, fraction=
0.5)
</a>:
</p>
328 <p>Return a new
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> whose RGBA component values are a
329 weighted sum of this color and
<tt class=
"docutils literal"><span class=
"pre">other
</span></tt>. Each component of the
330 returned color is the
<tt class=
"docutils literal"><span class=
"pre">fraction
</span></tt> of other's value plus
<tt class=
"docutils literal"><span class=
"pre">1</span> <span class=
"pre">-
</span>
331 <span class=
"pre">fraction
</span></tt> of this color's.
</p>
332 <dl class=
"docutils">
333 <dt><em>Availability
</em>:
</dt>
334 <dd>Available in MochiKit
1.3.1+
</dd>
338 <a name=
"fn-color.prototype.islight"></a>
339 <a class=
"mochidef reference" href=
"#fn-color.prototype.islight">Color.prototype.isLight()
</a>:
</p>
341 <p>Return
<tt class=
"docutils literal"><span class=
"pre">true
</span></tt> if the lightness value of this color is greater
342 than
<tt class=
"docutils literal"><span class=
"pre">0.5</span></tt>.
</p>
343 <p>Note that
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> is ignored for this calculation (color
344 components are not premultiplied).
</p>
345 <dl class=
"docutils">
346 <dt><em>Availability
</em>:
</dt>
347 <dd>Available in MochiKit
1.3.1+
</dd>
351 <a name=
"fn-color.prototype.isdark"></a>
352 <a class=
"mochidef reference" href=
"#fn-color.prototype.isdark">Color.prototype.isDark()
</a>:
</p>
354 <p>Return
<tt class=
"docutils literal"><span class=
"pre">true
</span></tt> if the lightness value of this color is less than
355 or equal to
<tt class=
"docutils literal"><span class=
"pre">0.5</span></tt>.
</p>
356 <p>Note that
<tt class=
"docutils literal"><span class=
"pre">alpha
</span></tt> is ignored for this calculation (color
357 components are not premultiplied).
</p>
358 <dl class=
"docutils">
359 <dt><em>Availability
</em>:
</dt>
360 <dd>Available in MochiKit
1.3.1+
</dd>
364 <a name=
"fn-color.prototype.torgbstring"></a>
365 <a class=
"mochidef reference" href=
"#fn-color.prototype.torgbstring">Color.prototype.toRGBString()
</a>:
</p>
367 <p>Return the decimal
<tt class=
"docutils literal"><span class=
"pre">"rgb(red,
</span> <span class=
"pre">green,
</span> <span class=
"pre">blue)
"</span></tt> string
368 representation of this color.
</p>
369 <p>If the alpha component is not
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt> (fully opaque), the
370 <tt class=
"docutils literal"><span class=
"pre">"rgba(red,
</span> <span class=
"pre">green,
</span> <span class=
"pre">blue,
</span> <span class=
"pre">alpha)
"</span></tt> string representation will be
373 <pre class=
"literal-block">
374 assert( Color.whiteColor().toRGBString() ==
"rgb(
255,
255,
255)
" );
376 <dl class=
"docutils">
377 <dt><em>Availability
</em>:
</dt>
378 <dd>Available in MochiKit
1.3.1+
</dd>
382 <a name=
"fn-color.prototype.tohslstring"></a>
383 <a class=
"mochidef reference" href=
"#fn-color.prototype.tohslstring">Color.prototype.toHSLString()
</a>:
</p>
385 <p>Return the decimal
<tt class=
"docutils literal"><span class=
"pre">"hsl(hue,
</span> <span class=
"pre">saturation,
</span> <span class=
"pre">lightness)
"</span></tt> string
386 representation of this color.
</p>
387 <p>If the alpha component is not
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt> (fully opaque), the
388 <tt class=
"docutils literal"><span class=
"pre">"hsla(hue,
</span> <span class=
"pre">saturation,
</span> <span class=
"pre">lightness,
</span> <span class=
"pre">alpha)
"</span></tt> string
389 representation will be used.
</p>
391 <pre class=
"literal-block">
392 assert( Color.whiteColor().toHSLString() ==
"hsl(
0,
0,
360)
" );
394 <dl class=
"docutils">
395 <dt><em>Availability
</em>:
</dt>
396 <dd>Available in MochiKit
1.3.1+
</dd>
400 <a name=
"fn-color.prototype.tohexstring"></a>
401 <a class=
"mochidef reference" href=
"#fn-color.prototype.tohexstring">Color.prototype.toHexString()
</a>:
</p>
403 <p>Return the hexadecimal
<tt class=
"docutils literal"><span class=
"pre">"#RRGGBB
"</span></tt> string representation of this
405 <p>Note that the alpha component is completely ignored for
406 hexadecimal string representations!
</p>
408 <pre class=
"literal-block">
409 assert( Color.whiteColor().toHexString() ==
"#FFFFFF
" );
411 <dl class=
"docutils">
412 <dt><em>Availability
</em>:
</dt>
413 <dd>Available in MochiKit
1.3.1+
</dd>
417 <a name=
"fn-color.prototype.asrgb"></a>
418 <a class=
"mochidef reference" href=
"#fn-color.prototype.asrgb">Color.prototype.asRGB()
</a>:
</p>
420 <p>Return the RGB (red, green, blue, alpha) components of this color
421 as an object with
<tt class=
"docutils literal"><span class=
"pre">r
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">g
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">b
</span></tt>, and
<tt class=
"docutils literal"><span class=
"pre">a
</span></tt> properties that
422 have values between
<tt class=
"docutils literal"><span class=
"pre">0.0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>.
</p>
423 <dl class=
"docutils">
424 <dt><em>Availability
</em>:
</dt>
425 <dd>Available in MochiKit
1.3.1+
</dd>
429 <a name=
"fn-color.prototype.ashsl"></a>
430 <a class=
"mochidef reference" href=
"#fn-color.prototype.ashsl">Color.prototype.asHSL()
</a>:
</p>
432 <p>Return the HSL (hue, saturation, lightness, alpha) components of
433 this color as an object with
<tt class=
"docutils literal"><span class=
"pre">h
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">s
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">l
</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">a
</span></tt>
434 properties that have values between
<tt class=
"docutils literal"><span class=
"pre">0.0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>.
</p>
435 <dl class=
"docutils">
436 <dt><em>Availability
</em>:
</dt>
437 <dd>Available in MochiKit
1.3.1+
</dd>
441 <a name=
"fn-color.prototype.ashsv"></a>
442 <a class=
"mochidef reference" href=
"#fn-color.prototype.ashsv">Color.prototype.asHSV()
</a>:
</p>
444 <p>Return the HSV (hue, saturation, value, alpha) components of this
445 color as an object with
<tt class=
"docutils literal"><span class=
"pre">h
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">s
</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">v
</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">a
</span></tt> properties
446 that have values between
<tt class=
"docutils literal"><span class=
"pre">0.0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">1.0</span></tt>.
</p>
447 <dl class=
"docutils">
448 <dt><em>Availability
</em>:
</dt>
449 <dd>Available in MochiKit
1.3.1+
</dd>
453 <a name=
"fn-color.blackcolor"></a>
454 <a class=
"mochidef reference" href=
"#fn-color.blackcolor">Color.blackColor()
</a>:
</p>
456 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0,
0,
0
458 <dl class=
"docutils">
459 <dt><em>Availability
</em>:
</dt>
460 <dd>Available in MochiKit
1.3.1+
</dd>
464 <a name=
"fn-color.bluecolor"></a>
465 <a class=
"mochidef reference" href=
"#fn-color.bluecolor">Color.blueColor()
</a>:
</p>
467 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0,
0,
1
469 <dl class=
"docutils">
470 <dt><em>Availability
</em>:
</dt>
471 <dd>Available in MochiKit
1.3.1+
</dd>
475 <a name=
"fn-color.browncolor"></a>
476 <a class=
"mochidef reference" href=
"#fn-color.browncolor">Color.brownColor()
</a>:
</p>
478 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0.6,
0.4,
480 <dl class=
"docutils">
481 <dt><em>Availability
</em>:
</dt>
482 <dd>Available in MochiKit
1.3.1+
</dd>
486 <a name=
"fn-color.cyancolor"></a>
487 <a class=
"mochidef reference" href=
"#fn-color.cyancolor">Color.cyanColor()
</a>:
</p>
489 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0,
1,
1
491 <dl class=
"docutils">
492 <dt><em>Availability
</em>:
</dt>
493 <dd>Available in MochiKit
1.3.1+
</dd>
497 <a name=
"fn-color.darkgraycolor"></a>
498 <a class=
"mochidef reference" href=
"#fn-color.darkgraycolor">Color.darkGrayColor()
</a>:
</p>
500 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
1/
3,
1/
3,
502 <dl class=
"docutils">
503 <dt><em>Availability
</em>:
</dt>
504 <dd>Available in MochiKit
1.3.1+
</dd>
508 <a name=
"fn-color.graycolor"></a>
509 <a class=
"mochidef reference" href=
"#fn-color.graycolor">Color.grayColor()
</a>:
</p>
511 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0.5,
0.5,
513 <dl class=
"docutils">
514 <dt><em>Availability
</em>:
</dt>
515 <dd>Available in MochiKit
1.3.1+
</dd>
519 <a name=
"fn-color.greencolor"></a>
520 <a class=
"mochidef reference" href=
"#fn-color.greencolor">Color.greenColor()
</a>:
</p>
522 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0,
1,
0.
524 <dl class=
"docutils">
525 <dt><em>Availability
</em>:
</dt>
526 <dd>Available in MochiKit
1.3.1+
</dd>
530 <a name=
"fn-color.lightgraycolor"></a>
531 <a class=
"mochidef reference" href=
"#fn-color.lightgraycolor">Color.lightGrayColor()
</a>:
</p>
533 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
2/
3,
2/
3,
535 <dl class=
"docutils">
536 <dt><em>Availability
</em>:
</dt>
537 <dd>Available in MochiKit
1.3.1+
</dd>
541 <a name=
"fn-color.magentacolor"></a>
542 <a class=
"mochidef reference" href=
"#fn-color.magentacolor">Color.magentaColor()
</a>:
</p>
544 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
1,
0,
1
546 <dl class=
"docutils">
547 <dt><em>Availability
</em>:
</dt>
548 <dd>Available in MochiKit
1.3.1+
</dd>
552 <a name=
"fn-color.orangecolor"></a>
553 <a class=
"mochidef reference" href=
"#fn-color.orangecolor">Color.orangeColor()
</a>:
</p>
555 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
1,
0.5,
0
557 <dl class=
"docutils">
558 <dt><em>Availability
</em>:
</dt>
559 <dd>Available in MochiKit
1.3.1+
</dd>
563 <a name=
"fn-color.purplecolor"></a>
564 <a class=
"mochidef reference" href=
"#fn-color.purplecolor">Color.purpleColor()
</a>:
</p>
566 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
0.5,
0,
0.5
568 <dl class=
"docutils">
569 <dt><em>Availability
</em>:
</dt>
570 <dd>Available in MochiKit
1.3.1+
</dd>
574 <a name=
"fn-color.redcolor"></a>
575 <a class=
"mochidef reference" href=
"#fn-color.redcolor">Color.redColor()
</a>:
</p>
577 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
1,
0,
0
579 <dl class=
"docutils">
580 <dt><em>Availability
</em>:
</dt>
581 <dd>Available in MochiKit
1.3.1+
</dd>
585 <a name=
"fn-color.whitecolor"></a>
586 <a class=
"mochidef reference" href=
"#fn-color.whitecolor">Color.whiteColor()
</a>:
</p>
588 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
1,
1,
1
590 <dl class=
"docutils">
591 <dt><em>Availability
</em>:
</dt>
592 <dd>Available in MochiKit
1.3.1+
</dd>
596 <a name=
"fn-color.yellowcolor"></a>
597 <a class=
"mochidef reference" href=
"#fn-color.yellowcolor">Color.yellowColor()
</a>:
</p>
599 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object whose RGB values are
1,
1,
0
601 <dl class=
"docutils">
602 <dt><em>Availability
</em>:
</dt>
603 <dd>Available in MochiKit
1.3.1+
</dd>
607 <a name=
"fn-color.transparentcolor"></a>
608 <a class=
"mochidef reference" href=
"#fn-color.transparentcolor">Color.transparentColor()
</a>:
</p>
610 <p>Return a
<a class=
"mochiref reference" href=
"#fn-color">Color
</a> object that is completely transparent
611 (has alpha component of
0).
</p>
612 <dl class=
"docutils">
613 <dt><em>Availability
</em>:
</dt>
614 <dd>Available in MochiKit
1.3.1+
</dd>
618 <div class=
"section">
619 <h2><a id=
"functions" name=
"functions">Functions
</a></h2>
621 <a name=
"fn-clampcolorcomponent"></a>
622 <a class=
"mochidef reference" href=
"#fn-clampcolorcomponent">clampColorComponent(num, scale)
</a>:
</p>
624 <p>Returns
<tt class=
"docutils literal"><span class=
"pre">num
</span> <span class=
"pre">*
</span> <span class=
"pre">scale
</span></tt> clamped between
<tt class=
"docutils literal"><span class=
"pre">0</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">scale
</span></tt>.
</p>
625 <p><a class=
"mochiref reference" href=
"#fn-clampcolorcomponent">clampColorComponent
</a> is not exported by default when
627 <dl class=
"docutils">
628 <dt><em>Availability
</em>:
</dt>
629 <dd>Available in MochiKit
1.3.1+
</dd>
633 <a name=
"fn-hsltorgb"></a>
634 <a class=
"mochidef reference" href=
"#fn-hsltorgb">hslToRGB(hue, saturation, lightness, alpha)
</a>:
</p>
636 <p>Computes RGB values from the provided HSL values. The return value
637 is a mapping with
<tt class=
"docutils literal"><span class=
"pre">"r
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"g
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"b
"</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">"a
"</span></tt> keys.
</p>
638 <dl class=
"docutils">
639 <dt>Alternate form:
</dt>
640 <dd><a class=
"mochiref reference" href=
"#fn-hsltorgb">hslToRGB({h: hue, s: saturation, l: lightness, a:
643 <p><a class=
"mochiref reference" href=
"#fn-hsltorgb">hslToRGB
</a> is not exported by default when using JSAN.
</p>
644 <dl class=
"docutils">
645 <dt><em>Availability
</em>:
</dt>
646 <dd>Available in MochiKit
1.3.1+
</dd>
650 <a name=
"fn-hsvtorgb"></a>
651 <a class=
"mochidef reference" href=
"#fn-hsvtorgb">hsvToRGB(hue, saturation, value, alpha)
</a>:
</p>
653 <p>Computes RGB values from the provided HSV values. The return value
654 is a mapping with
<tt class=
"docutils literal"><span class=
"pre">"r
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"g
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"b
"</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">"a
"</span></tt> keys.
</p>
655 <dl class=
"docutils">
656 <dt>Alternate form:
</dt>
657 <dd><a class=
"mochiref reference" href=
"#fn-hsvtorgb">hsvToRGB({h: hue, s: saturation, v: value, a:
660 <p><a class=
"mochiref reference" href=
"#fn-hsvtorgb">hsvToRGB
</a> is not exported by default when using JSAN.
</p>
661 <dl class=
"docutils">
662 <dt><em>Availability
</em>:
</dt>
663 <dd>Available in MochiKit
1.3.1+
</dd>
667 <a name=
"fn-tocolorpart"></a>
668 <a class=
"mochidef reference" href=
"#fn-tocolorpart">toColorPart(num)
</a>:
</p>
670 <p>Convert num to a zero padded hexadecimal digit for use in a
671 hexadecimal color string. Num should be an integer between
<tt class=
"docutils literal"><span class=
"pre">0</span></tt>
672 and
<tt class=
"docutils literal"><span class=
"pre">255</span></tt>.
</p>
673 <p><a class=
"mochiref reference" href=
"#fn-tocolorpart">toColorPart
</a> is not exported by default when using
675 <dl class=
"docutils">
676 <dt><em>Availability
</em>:
</dt>
677 <dd>Available in MochiKit
1.3.1+
</dd>
681 <a name=
"fn-rgbtohsl"></a>
682 <a class=
"mochidef reference" href=
"#fn-rgbtohsl">rgbToHSL(red, green, blue, alpha)
</a>:
</p>
684 <p>Computes HSL values based on the provided RGB values. The return
685 value is a mapping with
<tt class=
"docutils literal"><span class=
"pre">"h
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"s
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"l
"</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">"a
"</span></tt>
687 <dl class=
"docutils">
688 <dt>Alternate form:
</dt>
689 <dd><a class=
"mochiref reference" href=
"#fn-rgbtohsl">rgbToHSL({r: red, g: green, b: blue, a: alpha})
</a>.
</dd>
691 <p><a class=
"mochiref reference" href=
"#fn-rgbtohsl">rgbToHSL
</a> is not exported by default when using JSAN.
</p>
692 <dl class=
"docutils">
693 <dt><em>Availability
</em>:
</dt>
694 <dd>Available in MochiKit
1.3.1+
</dd>
698 <a name=
"fn-rgbtohsv"></a>
699 <a class=
"mochidef reference" href=
"#fn-rgbtohsv">rgbToHSV(red, green, blue, alpha)
</a>:
</p>
701 <p>Computes HSV values based on the provided RGB values. The return
702 value is a mapping with
<tt class=
"docutils literal"><span class=
"pre">"h
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"s
"</span></tt>,
<tt class=
"docutils literal"><span class=
"pre">"v
"</span></tt> and
<tt class=
"docutils literal"><span class=
"pre">"a
"</span></tt>
704 <dl class=
"docutils">
705 <dt>Alternate form:
</dt>
706 <dd><a class=
"mochiref reference" href=
"#fn-rgbtohsv">rgbToHSV({r: red, g: green, b: blue, a: alpha})
</a>.
</dd>
708 <p><a class=
"mochiref reference" href=
"#fn-rgbtohsv">rgbToHSV
</a> is not exported by default when using JSAN.
</p>
709 <dl class=
"docutils">
710 <dt><em>Availability
</em>:
</dt>
711 <dd>Available in MochiKit
1.3.1+
</dd>
716 <div class=
"section">
717 <h1><a id=
"see-also" name=
"see-also">See Also
</a></h1>
718 <table class=
"docutils footnote" frame=
"void" id=
"id6" rules=
"none">
719 <colgroup><col class=
"label" /><col /></colgroup>
721 <tr><td class=
"label"><a class=
"fn-backref" href=
"#id1" name=
"id6">[
1]
</a></td><td>Application Kit Reference - NSColor:
<a class=
"reference" href=
"http://developer.apple.com/documentation/Cocoa/Reference/ApplicationKit/ObjC_classic/Classes/NSColor.html">http://developer.apple.com/documentation/Cocoa/Reference/ApplicationKit/ObjC_classic/Classes/NSColor.html
</a></td></tr>
724 <table class=
"docutils footnote" frame=
"void" id=
"id7" rules=
"none">
725 <colgroup><col class=
"label" /><col /></colgroup>
727 <tr><td class=
"label"><a name=
"id7">[
2]
</a></td><td><em>(
<a class=
"fn-backref" href=
"#id2">1</a>,
<a class=
"fn-backref" href=
"#id4">2</a>)
</em> SVG
1.0 color keywords:
<a class=
"reference" href=
"http://www.w3.org/TR/SVG/types.html#ColorKeywords">http://www.w3.org/TR/SVG/types.html#ColorKeywords
</a></td></tr>
730 <table class=
"docutils footnote" frame=
"void" id=
"id8" rules=
"none">
731 <colgroup><col class=
"label" /><col /></colgroup>
733 <tr><td class=
"label"><a name=
"id8">[
3]
</a></td><td><em>(
<a class=
"fn-backref" href=
"#id3">1</a>,
<a class=
"fn-backref" href=
"#id5">2</a>)
</em> W3C CSS3 Color Module:
<a class=
"reference" href=
"http://www.w3.org/TR/css3-color/#svg-color">http://www.w3.org/TR/css3-color/#svg-color
</a></td></tr>
737 <div class=
"section">
738 <h1><a id=
"authors" name=
"authors">Authors
</a></h1>
740 <li>Bob Ippolito
<<a class=
"reference" href=
"mailto:bob@redivi.com">bob
@redivi.com
</a>></li>
743 <div class=
"section">
744 <h1><a id=
"copyright" name=
"copyright">Copyright
</a></h1>
745 <p>Copyright
2005 Bob Ippolito
<<a class=
"reference" href=
"mailto:bob@redivi.com">bob
@redivi.com
</a>>. This program is
746 dual-licensed free software; you can redistribute it and/or modify it
747 under the terms of the
<a class=
"reference" href=
"http://www.opensource.org/licenses/mit-license.php">MIT License
</a> or the
<a class=
"reference" href=
"http://www.opensource.org/licenses/afl-2.1.php">Academic Free License