Skip to content

Instantly share code, notes, and snippets.

@keisans
Created May 6, 2013 17:04
Show Gist options
  • Save keisans/5526435 to your computer and use it in GitHub Desktop.
Save keisans/5526435 to your computer and use it in GitHub Desktop.
Color system draft 1
Color = function(color) {
this.hex = this.parseHex(color);
this.rgb = this.hex2rgb();
this.hsl = this.rgb2hsl();
}
Color.prototype = (function(){
var _public = {};
_public.parseHex = function(hex){
hex = hex.replace('#', '')
if(hex.length !== 6 && hex.length !== 3){throw hex + ' is not a valid hex code'}
if(hex.length === 3){
var colorSplit = hex.split('');
for(var comp in colorSplit){
if (colorSplit.hasOwnProperty(comp)){
colorSplit[comp] = colorSplit[comp] + colorSplit[comp];
}
}
return colorSplit.join('');
} else {
return hex;
}
}
_public.lighten = function(lightness) {
return this.ld(lightness);
};
_public.darken = function(darkness) {
return this.ld(darkness * -1);
};
_public.ld = function(change) {
var amount = Math.floor((change / 100) * 255),
rgb = _.map(this.rgb, function(n) {
var newColor = n + amount;
return _public.toHex.call(this, newColor);
});
return rgb.join('');
};
_public.spin = function(change) {
var hsl = this.hsl.slice(0, this.hsl.length);
hsl[0] += change/360;
hsl[0] = hsl[0] % 1;
var rgb = this.hsl2rgb(hsl[0], hsl[1], hsl[2]);
var newColor = _.map(rgb, function(n) {
return _public.toHex.call(this, n);
});
return newColor.join('');
};
_public.toHex = function(n) {
n = parseInt(n, 10);
if (isNaN(n)) {
return '00';
}
n = Math.max(0, Math.min(n, 255));
return "0123456789ABCDEF".charAt((n - n % 16) / 16) + "0123456789ABCDEF".charAt(n % 16);
};
_public.rgb2hsl = function() {
var r = this.rgb[0],
g = this.rgb[1],
b = this.rgb[2];
r /= 255;
g /= 255;
b /= 255;
var max = Math.max(r, g, b),
min = Math.min(r, g, b);
var h, s, l = (max + min) / 2;
if (max === min) {
h = s = 0; // achromatic
} else {
var d = max - min;
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
}
h /= 6;
}
return [h, s, l];
};
_public.hsl2rgb = function(h, s, l) {
h = typeof h !== 'undefined' ? h : this.hsl[0];
s = typeof s !== 'undefined' ? s : this.hsl[1];
l = typeof l !== 'undefined' ? l : this.hsl[2];
var r, g, b;
if (s === 0) {
r = g = b = l; // achromatic
} else {
var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
var p = 2 * l - q;
r = this.hue2rgb(p, q, h + 1 / 3);
g = this.hue2rgb(p, q, h);
b = this.hue2rgb(p, q, h - 1 / 3);
}
return [r * 255, g * 255, b * 255];
};
_public.hue2rgb = function(p, q, t) {
if (t < 0) {t += 1;}
if (t > 1) {t -= 1;}
if (t < 1 / 6) {return p + (q - p) * 6 * t;}
if (t < 1 / 2) {return q;}
if (t < 2 / 3) {return p + (q - p) * (2 / 3 - t) * 6;}
return p;
};
_public.rgb2hex = function() {
var values = _.map(this.rgb, function(n) {
return _public.toHex.call(this, n);
});
return values.join('');
};
_public.hex2rgb = function() {
var subs = this.hex.match(/.{1,2}/g),
r = parseInt(subs[0], 16),
g = parseInt(subs[1], 16),
b = parseInt(subs[2], 16);
return [r, g, b];
};
return _public;
}())
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment