gistfile1.js

/**
 * RGBA => HSVA & HSVA => RGBA Converter
 * USAGE:
 *   var canvas = document.getElementById('canvas');
 *   var ctx = canvas.getContext('2d');
 *   ctx.fillStyle = (new HSVA(250, 0.5, 1.0, 1.0)).toRGBA().toString();
 *   ctx.fillRect(0, 0, canvas.width, canvas.height);
 * Author: VoQn
 * Last Update: 2010/05/05
 */

/**
 * Utilities
 */

function format(fmt){
    var result = fmt;
    for(i = 1; i < arguments.length; i++){
	var reg = new RegExp("%"+i+"\\$s","g");
	result = result.replace(reg, arguments[i]);
    }
    return result;
}

function inRange(min, value, max){
    return Math.max(min, Math.min(value, max));
}

/**
 * Color Space Objects
 */

function HSVA(_hue, _sat, _val, _alpha){
    
    this.hue   = _hue > 360 ? _hue % 360.0 : _hue;
    this.sat   = inRange(0.0, _sat,   1.0);
    this.val   = inRange(0.0, _val,   1.0);
    this.alpha = inRange(0.0, _alpha, 1.0);

    this.setHue = function(hue){
	this.hue = hue > 360 ?  hue % 360.0 : hue;
    };
    
    this.toRGBA = function(){
	var h = this.hue, s = this.sat, a = this.alpha;
	var hi = Math.floor(h / 60.0) % 6;
	var f  = (h / 60.0) - hi;

	var roundIn = function(value){
	    return  Math.floor(inRange(0.0, value, 1.0) * 255);
	};

	var 
	p = roundIn(this.val * (1 - s)),
	q = roundIn(this.val * (1 - f * s)),
	t = roundIn(this.val * (1 - (1 - f) * s)),
	v = roundIn(this.val);

	if(s == 0){
	    return new RGBA(v, v, v, a);
	}
	switch(hi){
	case 0:
	    return new RGBA(v, t, p, a);
	case 1:
	    return new RGBA(q, v, p, a);
	case 2:
	    return new RGBA(p, v, t, a);
	case 3:
	    return new RGBA(p, q, v, a);
	case 4:
	    return new RGBA(t, p, v, a);
	case 5:
	    return new RGBA(v, p, q, a);
	default:
	    return false;
	}
    };
}

function RGBA(_red, _green, _blue, _alpha){
    this.red   = inRange(0, _red,   255);
    this.green = inRange(0, _green, 255);
    this.blue  = inRange(0, _blue,  255);
    this.alpha = inRange(0, _alpha, 1.0);
    
    this.toString = function(){
	return format('rgba(%1$s, %2$s, %3$s, %4$s)',
		      this.red,
		      this.green,
		      this.blue,
		      this.alpha);
    };
    
    this.toHSVA = function(){
	const
	r = this.red,
	g = this.green,
	b = this.blue,
	a = this.alpha;
	const MAX = Math.max(r, g, b), MIN = Math.min(r, g, b);
	const val = MAX;
	
	if(val == 0){
	    return new HSV(0, 0, val, a);
	}else{
	    var calc = function(value){
		return (MAX - value) / (MAX - MIN);
	    };
	    const sat = (MAX - MIN) / MAX, Cr = calc(r), Cg = calc(g), Cb = calc(b);
	    
	    var hue = r == MAX ? Cb - Cg : g == MAX ? 2 + Cr - Cb : 4 + Cg - Cr;
	    hue *= 60;
	    hue += hue < 0 ? 360 : 0;
	    return new HSVA(hue, sat, val, this.alpha);
	}
    };
}