/*
-Colour.js
+Color.js
-Functions for colour handling and processing.
+Functions for Color handling and processing.
-http://www.safalra.com/web-design/javascript/colour-handling-and-processing/
+http://www.safalra.com/web-design/javascript/Color-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
/*
* @class Roo.lib.Color
- * An abstract Colour implementation. Concrete Colour implementations should use
+ * An abstract Color implementation. Concrete Color 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
+ * components of this Color, 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
+ * return an object representing the HSL components of this Color, 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].
*/
Roo.lib.Color = function(){
- /* Returns an object representing the RGBA components of this Colour. The red,
+ /**
+ * @returns an object representing the RGBA components of this Color. 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].
*/
this.getIntegerRGB = function(){
- // get the RGB components of this colour
+ // get the RGB components of this Color
var rgb = this.getRGB();
// return the integer components
};
- /* Returns an object representing the RGBA components of this Colour. The red,
+ /**
+ * @returns an object representing the RGBA components of this Color. 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].
*/
this.getPercentageRGB = function(){
- // get the RGB components of this colour
+ // get the RGB components of this Color
var rgb = this.getRGB();
// return the percentage components
};
- /* Returns a string representing this Colour as a CSS hexadecimal RGB colour
+ /**
+ * @returns a string representing this Color as a CSS hexadecimal RGB Color
* value - that is, a string of the form #RRGGBB where each of RR, GG, and BB
* are two-digit hexadecimal numbers.
*/
var g16 = rgb.g.toString(16);
var b16 = rgb.b.toString(16);
- // return the CSS RGB colour value
+ // return the CSS RGB Color value
return '#'
+ (r16.length == 2 ? r16 : '0' + r16)
+ (g16.length == 2 ? g16 : '0' + g16)
};
- /* Returns a string representing this Colour as a CSS integer RGB colour
+ /**
+ * @returns a string representing this Color as a CSS integer RGB Color
* 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].
*/
// get the integer RGB components
var rgb = this.getIntegerRGB();
- // return the CSS RGB colour value
+ // return the CSS RGB Color value
return 'rgb(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ')';
};
- /* Returns a string representing this Colour as a CSS integer RGBA colour
+ /**
+ * @returns Returns a string representing this Color as a CSS integer RGBA Color
* 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].
*/
// get the integer RGB components
var rgb = this.getIntegerRGB();
- // return the CSS integer RGBA colour value
+ // return the CSS integer RGBA Color value
return 'rgb(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + rgb.a + ')';
};
- /* Returns a string representing this Colour as a CSS percentage RGB colour
+ /**
+ * @returns a string representing this Color as a CSS percentage RGB Color
* 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].
*/
// get the percentage RGB components
var rgb = this.getPercentageRGB();
- // return the CSS RGB colour value
+ // return the CSS RGB Color value
return 'rgb(' + rgb.r + '%,' + rgb.g + '%,' + rgb.b + '%)';
};
- /* Returns a string representing this Colour as a CSS percentage RGBA colour
+ /**
+ * @returns a string representing this Color as a CSS percentage RGBA Color
* 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].
*/
// get the percentage RGB components
var rgb = this.getPercentageRGB();
- // return the CSS percentage RGBA colour value
+ // return the CSS percentage RGBA Color value
return 'rgb(' + rgb.r + '%,' + rgb.g + '%,' + rgb.b + '%,' + rgb.a + ')';
};
- /* Returns a string representing this Colour as a CSS HSL colour value - that
+ /**
+ * @returns a string representing this Color as a CSS HSL Color 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].
*/
// get the HSL components
var hsl = this.getHSL();
- // return the CSS HSL colour value
+ // return the CSS HSL Color value
return 'hsl(' + hsl.h + ',' + hsl.s + '%,' + hsl.l + '%)';
};
- /* Returns a string representing this Colour as a CSS HSLA colour value - that
+ /**
+ * @returns a string representing this Color as a CSS HSLA Color 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].
*/
// get the HSL components
var hsl = this.getHSL();
- // return the CSS HSL colour value
+ // return the CSS HSL Color value
return 'hsl(' + hsl.h + ',' + hsl.s + '%,' + hsl.l + '%,' + hsl.a + ')';
};
- /* Sets the colour of the specified node to this Colour. This functions sets
+ /**
+ * Sets the Color of the specified node to this Color. This functions sets
* the CSS 'color' property for the node. The parameter is:
- *
- * node - the node whose colour should be set
+ *
+ * @param {DomElement} node - the node whose Color should be set
*/
- this.setNodeColour = function(node){
+ this.setNodeColor = function(node){
- // set the colour of the node
+ // set the Color of the node
node.style.color = this.getCSSHexadecimalRGB();
};
- /* Sets the background colour of the specified node to this Colour. This
+ /**
+ * Sets the background Color of the specified node to this Color. This
* functions sets the CSS 'background-color' property for the node. The
* parameter is:
*
- * node - the node whose background colour should be set
+ * @param {DomElement} node - the node whose background Color should be set
*/
- this.setNodeBackgroundColour = function(node){
+ this.setNodeBackgroundColor = function(node){
- // set the background colour of the node
+ // set the background Color of the node
node.style.backgroundColor = this.getCSSHexadecimalRGB();
};
this.toRGB= function()
{
var r = this.getIntegerRGB();
- return new Roo.lib.RGBColour(r.r,r.g,r.b,r.a);
+ return new Roo.lib.RGBColor(r.r,r.g,r.b,r.a);
}
this.toHSL = function()
{
var hsl = this.getHSL();
- // return the CSS HSL colour value
- return new Roo.lib.HSLColour(hsl.h, hsl.s, hsl.l , hsl.a );
+ // return the CSS HSL Color value
+ return new Roo.lib.HSLColor(hsl.h, hsl.s, hsl.l , hsl.a );
}
{
var rgb = this.toRGB();
var hsv = rgb.getHSV();
- // return the CSS HSL colour value
- return new Roo.lib.HSVColour(hsv.h, hsv.s, hsv.v , hsv.a );
+ // return the CSS HSL Color value
+ return new Roo.lib.HSVColor(hsv.h, hsv.s, hsv.v , hsv.a );
}
{
var rgb = this.toRGB();
var hsv = rgb.getHSV();
- return new Roo.lib.HSVColour(hsv.h, hsv.s * v, hsv.v , hsv.a );
+ return new Roo.lib.HSVColor(hsv.h, hsv.s * v, hsv.v , hsv.a );
}
}
-/* Creates a colour specified in the RGB colour space, with an optional alpha
+/*
+ * @class Roo.lib.RGBColor
+ * @extends Roo.lib.Color
+ * Creates a Color specified in the RGB Color space, with an optional alpha
* component. The parameters are:
*
* r - the red 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
*/
-Roo.lib.RGBColour = function (r, g, b, a){
+Roo.lib.RGBColor = function (r, g, b, a){
// store the alpha component after clipping it if necessary
var alpha = (a === undefined ? 1 : Math.max(0, Math.min(1, a)));
var hsv = null;
var hsl = null;
- /* Returns the HSV or HSL hue component of this RGBColour. The hue is in the
+ /**
+ * @returns the HSV or HSL hue component of this RGBColor. The hue is in the
* range [0,360). The parameters are:
*
* maximum - the maximum of the RGB component values
// check whether the range is zero
if (range == 0){
- // set the hue to zero (any hue is acceptable as the colour is grey)
+ // set the hue to zero (any hue is acceptable as the Color is grey)
var hue = 0;
}else{
}
- /* Calculates and stores the HSV components of this RGBColour so that they can
+ /* Calculates and stores the HSV components of this RGBColor so that they can
* be returned be the getHSV function.
*/
function calculateHSV(){
}
- /* Calculates and stores the HSL components of this RGBColour so that they can
+ /* Calculates and stores the HSL components of this RGBColor so that they can
* be returned be the getHSL function.
*/
function calculateHSL(){
}
- /* Returns the RGB and alpha components of this RGBColour as an object with r,
+ /**
+ * @returns the RGB and alpha components of this RGBColor 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].
*/
};
- /* Returns the HSV and alpha components of this RGBColour as an object with h,
+ /**
+ * @returns the HSV and alpha components of this RGBColor 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].
*/
};
- /* Returns the HSL and alpha components of this RGBColour as an object with h,
+ /**
+ * @returns the HSL and alpha components of this RGBColor 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].
*/
};
}
-Roo.lib.RGBColour.prototype = new Roo.lib.Colour();
+// this does an 'exteds'
+Roo.lib.RGBColor.prototype = new Roo.lib.Color();
-/* Creates a colour specified in the HSV colour space, with an optional alpha
+/* Creates a Color specified in the HSV Color space, with an optional alpha
* component. The parameters are:
*
* h - the hue component, wrapped to the range [0,360)
* a - the alpha component, clipped to the range [0,1] - this parameter is
* optional and defaults to 1
*/
-Roo.lib.HSVColour = function (h, s, v, a){
+Roo.lib.HSVColor = function (h, s, v, a){
// store the alpha component after clipping it if necessary
var alpha = (a === undefined ? 1 : Math.max(0, Math.min(1, a)));
var rgb = null;
var hsl = null;
- /* Calculates and stores the RGB components of this HSVColour so that they can
+ /* Calculates and stores the RGB components of this HSVColor so that they can
* be returned be the getRGB function.
*/
function calculateRGB(){
// check whether the saturation is zero
if (hsv.s == 0){
- // set the colour to the appropriate shade of grey
+ // set the Color to the appropriate shade of grey
var r = hsv.v;
var g = hsv.v;
var b = hsv.v;
var q = hsv.v * (1 - hsv.s / 100 * f);
var t = hsv.v * (1 - hsv.s / 100 * (1 - f));
- // set the RGB colour components to their temporary values
+ // set the RGB Color components to their temporary values
switch (Math.floor(hsv.h / 60)){
case 0: var r = hsv.v; var g = t; var b = p; break;
case 1: var r = q; var g = hsv.v; var b = p; break;
}
- /* Calculates and stores the HSL components of this HSVColour so that they can
+ /* Calculates and stores the HSL components of this HSVColor so that they can
* be returned be the getHSL function.
*/
function calculateHSL(){
}
- /* Returns the RGB and alpha components of this HSVColour as an object with r,
+ /**
+ * @returns the RGB and alpha components of this HSVColor 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].
*/
};
- /* Returns the HSV and alpha components of this HSVColour as an object with h,
+ /**
+ * @returns the HSV and alpha components of this HSVColor 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].
*/
};
- /* Returns the HSL and alpha components of this HSVColour as an object with h,
+ /**
+ * @returns the HSL and alpha components of this HSVColor 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].
*/
};
}
-Roo.lib.HSVColour.prototype = new Roo.lib.Colour();
+Roo.lib.HSVColor.prototype = new Roo.lib.Color();
-/* Creates a colour specified in the HSL colour space, with an optional alpha
+/* Creates a Color specified in the HSL Color space, with an optional alpha
* component. The parameters are:
*
* h - the hue component, wrapped to the range [0,360)
* optional and defaults to 1
*/
-Roo.lib.HSLColour = function(h, s, l, a){
+Roo.lib.HSLColor = function(h, s, l, a){
// store the alpha component after clipping it if necessary
var alpha = (a === undefined ? 1 : Math.max(0, Math.min(1, a)));
var rgb = null;
var hsv = null;
- /* Calculates and stores the RGB components of this HSLColour so that they can
+ /* Calculates and stores the RGB components of this HSLColor so that they can
* be returned be the getRGB function.
*/
function calculateRGB(){
}
- /* Calculates and stores the HSV components of this HSLColour so that they can
+ /* Calculates and stores the HSV components of this HSLColor so that they can
* be returned be the getHSL function.
*/
function calculateHSV(){
}
- /* Returns the RGB and alpha components of this HSLColour as an object with r,
+ /**
+ * @returns the RGB and alpha components of this HSLColor 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].
*/
};
- /* Returns the HSV and alpha components of this HSLColour as an object with h,
+ /**
+ * @returns the HSV and alpha components of this HSLColor 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].
*/
};
- /* Returns the HSL and alpha components of this HSLColour as an object with h,
+ /**
+ * @returns the HSL and alpha components of this HSLColor 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].
*/
};
}
-Roo.lib.HSLColour.prototype = new Roo.lib.Colour();
\ No newline at end of file
+Roo.lib.HSLColor.prototype = new Roo.lib.Color();
\ No newline at end of file