scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-03 19:45:44 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Implement Color#saturation / Color#hue / Color#brightness and allow chaining of color channel setters.

Browse source
This commit is contained in:
Jonathan Puckey 2011-03-07 15:59:35 +01:00
parent 513bd1da67
commit d713102734
3 changed files with 60 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
src/color/Color.js
View file

@ -37,7 +37,7 @@ var Color = this.Color = Base.extend({
/**
* Checks if the color has an alpha value.
*
*
* @return {@true if the color has an alpha value}
*/
hasAlpha: function() {
@ -47,4 +47,56 @@ var Color = this.Color = Base.extend({
getCanvasStyle: function() {
return this.toCssString();
}
});
}, new function() {
function colorToHsb(color) {
var r = color.getRed(), g = color.getGreen(), b = color.getBlue(),
max = Math.max(r, g, b), min = Math.min(r, g, b),
delta = max - min, hue, saturation = (max != 0) ? delta / max : 0,
brightness = max;
if (saturation == 0) {
hue = 0;
} else {
var rr = (max - r) / delta,
gr = (max - g) / delta,
br = (max - b) / delta;
if (r == max) hue = br - gr;
else if (g == max) hue = 2 + rr - br;
else hue = 4 + gr - rr;
hue /= 6;
if (hue < 0) hue++;
}
return [hue * 360, saturation, brightness ];
}
function hsbToRgb(hue, saturation, brightness) {
if(hue < 0) hue += 360;
hue = hue % 360;
var f = hue % 60, p = (brightness * (1 - saturation)) / 1,
q = (brightness * (60 - saturation * f)) / 60,
t = (brightness * (60 - saturation * (60 - f))) / 60;
switch (Math.floor(hue / 60)) {
case 0: return [brightness, t, p];
case 1: return [q, brightness, p];
case 2: return [p, brightness, t];
case 3: return [p, q, brightness];
case 4: return [t, p, brightness];
case 5: return [brightness, p, q];
}
}
return Base.each(
['hue', 'saturation', 'brightness'],
function(key, index) {
this['get' + Base.capitalize(key)] = function() {
return colorToHsb(this)[index];
};
this['set' + Base.capitalize(key)] = function(value) {
var hsb = colorToHsb(this);
hsb[index] = value;
var rgb = hsbToRgb.apply(this, hsb);
this.setRed(rgb[0]).setGreen(rgb[1]).setBlue(rgb[2]);
};
},
{ beans: true }
);
});

2
src/color/GrayColor.js
View file

@ -45,6 +45,7 @@ var GrayColor = this.GrayColor = Color.extend({
setGray: function(gray) {
this._cssString = null;
this._gray = gray;
return this;
},
/**
@ -90,6 +91,7 @@ var GrayColor = this.GrayColor = Color.extend({
this['set' + Base.capitalize(key)] = function(value) {
this._cssString = null;
this._gray = this._gray * (1 - weight) + weight * (1 - value);
return this;
};
}, { beans: true });
});

4
src/color/RGBColor.js
View file

@ -142,6 +142,7 @@ var RGBColor = this.RGBColor = Color.extend(new function() {
setRed: function(red) {
this._cssString = null;
this._red = red;
return this;
},
/**
@ -155,6 +156,7 @@ var RGBColor = this.RGBColor = Color.extend(new function() {
setGreen: function(green) {
this._cssString = null;
this._green = green;
return this;
},
/**
@ -168,6 +170,7 @@ var RGBColor = this.RGBColor = Color.extend(new function() {
setBlue: function(blue) {
this._cssString = null;
this._blue = blue;
return this;
},
getGray: function() {
@ -182,6 +185,7 @@ var RGBColor = this.RGBColor = Color.extend(new function() {
setGray: function(gray) {
this._cssString = null;
this._red = this._green = this._blue = 1 - gray;
return this;
},
/**