var ChangeColorDo = new Array();
var curcolor = new Array();

function d2h(d) {return d.toString(16).toUpperCase(); }
function h2d(h) {return parseInt(h,16); }

// ChangeColor(id, 'FF00AA', '20')
// ID is het id waarbij de kleur moet veranderen
// ColorTo is de kleur waar het uiteindelijk heengaat
// Time is de tijd
// NOTE: time is een moet een getal tussen de 1 en de 256 zijn. daarboven en daaronder heeft het geen zin.
// als block_ = 1 dan ga naar oranje anders naar normaal

// Voorbeelden:
// <input type="submit" style="background:#FFFFFF" id="1" value="Niet klikken !" onmouseover='ChangeColorDo[this.id] = 1; ChangeColor(this.id, "FFFFFF", "", "FFCC66", 40);' onmouseout='ChangeColorDo[this.id] = 0;' />
// <input type="submit" style="background:#FFFFFF" id="2" value="Niet klikken !" onmouseover='ChangeColorDo[this.id] = 1; ChangeColor(this.id, "FFFFFF", "", "FFCC66", 40);' onmouseout='ChangeColorDo[this.id] = 0;' />

function ChangeColor(id, colorFrom_, colorCur_, colorTo_, time)
{
  if(ChangeColorDo[ id ] == 0)
  {
    colorFrom = colorCur_;
    colorTo = colorFrom_;
    time = 20;
  }else{
    if(colorCur_ == "")
    {
      colorFrom = colorFrom_;
      colorTo = colorTo_;
    }else{
      colorFrom = colorCur_;
      colorTo = colorTo_;
  } }

  from = new Array();
  from[1] = h2d( colorFrom.substr(0,2) );
  from[2] = h2d( colorFrom.substr(2,2) );
  from[3] = h2d( colorFrom.substr(4,2) );

  to = new Array();
  to[1] = h2d( colorTo.substr(0,2) );
  to[2] = h2d( colorTo.substr(2,2) );
  to[3] = h2d( colorTo.substr(4,2) );

  different = new Array();
  different[1] = to[1] - from[1];
  different[2] = to[2] - from[2];
  different[3] = to[3] - from[3];

  new_ = new Array();
  if(different[1] > 0) { new_[1] = from[1] + Math.ceil( (different[1] / time) ); }else{ new_[1] = from[1] + Math.floor( (different[1] / time) ); }
  if(different[2] > 0) { new_[2] = from[2] + Math.ceil( (different[2] / time) ); }else{ new_[2] = from[2] + Math.floor( (different[2] / time) ); }
  if(different[3] > 0) { new_[3] = from[3] + Math.ceil( (different[3] / time) ); }else{ new_[3] = from[3] + Math.floor( (different[3] / time) ); }

  if(new_[1] < 16) { new_[1] = '0'+d2h(new_[1]); }else{ new_[1] = d2h(new_[1]); }
  if(new_[2] < 16) { new_[2] = '0'+d2h(new_[2]); }else{ new_[2] = d2h(new_[2]); }
  if(new_[3] < 16) { new_[3] = '0'+d2h(new_[3]); }else{ new_[3] = d2h(new_[3]); }

  $('#'+id).css('backgroundColor', '#' + new_[1] + new_[2] + new_[3]);

  if(different[1] !== 0 || different[2] !== 0 || different[3] !== 0)
  {
    setTimeout('ChangeColor("'+id+'", "'+colorFrom_+'", "'+new_[1] + new_[2] + new_[3]+'", "'+colorTo_+'", '+time+')', 10);  
  }else{
    if(ChangeColorDo[id] == 1)
    {
      setTimeout('ChangeColor("'+id+'", "'+colorFrom_+'", "'+new_[1] + new_[2] + new_[3]+'", "'+colorTo_+'", '+time+')', 100);
} } }

function rgb2hex( rgb )
{
	rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
	function hex(x)
	{
		return ("0" + parseInt(x).toString(16)).slice(-2);
	}
	return hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}