// JavaScript Document
// (c)2009 Chuck Liddell

 // -- Set these variables to control the pulsing behavior for the button animation --
 var beginColor = "#000000";
 var midColor = "#666666"; // this is used if you don't want the pulse to go all the way back to the original color, but rather change between mid and end
 var useMidColor = false; // flag for using the midColor or not
 var endColor = "#574337";
 var pulseDuration = 2000;
 var fadeDuration = 500;
 var holdDuration = 500; // how long the pulse color is left at full strength before changing back
 // ---------------------------------------------------------------------------------- 
 var currentColor = new Object; // used to track the current color of an element
 var isPulsing = new Object; // used to track whether a specific element is pulsing
 var isFading = new Object; // used to track whether a specific element is fading back to normal (after a mouseout event)
 var pulseIndex = 0; // used to track cycles of pulses so that we don't double-pulse when the mouse moves over and out of the element quickly
 var fadeIndex = 0; // used to track cycles of fades so that we don't double-fade when the mouse moves over and out of the element quickly
 
 function pulse(element) {
   if(element && element.id){
    isPulsing[element.id] = true;
	isFading[element.id] = false;
	pulseIndex++;
	pulseWax( element, pulseIndex );
   }
 }
 
 function pulseWax( element, index ){
   if( isPulsing[element.id] )
   {
     var startColor = beginColor;
	 if( currentColor[element.id] )
	  startColor = currentColor[element.id];
	 animateColor( element, startColor, endColor, pulseDuration / 2, 20, "PULSE_WAX", index);
   }
 }
 
 function pulseWane( element, index ){
   if( isPulsing[element.id] )
   {
     var waneColor = beginColor;
	 if( useMidColor )
	  waneColor = midColor;
     animateColor( element, endColor, waneColor, pulseDuration / 2, 20, "PULSE_WANE", index);
   }
 }
 
 function fade(element) {
   if( element && element.id )
   {
	 isPulsing[element.id] = false; //this will stop any currently running pulse animations
	 isFading[element.id] = true;
	 fadeIndex++;
	 animateColor( element, currentColor[element.id], beginColor, fadeDuration, 20, "FADE", fadeIndex );
   }
 } 
 
 function animateColor(elm, begin, end, duration, fps, mode, index) {
 
  if(!duration) duration = 1000;
  if(!fps) fps = 20;
  duration=parseFloat(duration);
  fps=parseFloat(fps);
  var interval    = Math.ceil(1000/fps);
  var totalframes = Math.ceil(duration/interval);

  var b = cssColor2rgb(begin);
  b[0] = +b[0];
  b[1] = +b[1]; // forces type conversion to number
  b[2] = +b[2];
  var e = cssColor2rgb(end);
  e[0] = +e[0];
  e[1] = +e[1]; // forces type conversion to number
  e[2] = +e[2];
  var change0=e[0]-b[0];
  var change1=e[1]-b[1];
  var change2=e[2]-b[2];

  for(var i=1;i <= totalframes;i++) {
                 (function() {
                   var frame=i;                   
				   
                  function color() {
				  
				  if( mode.match("^PULSE") && isPulsing[elm.id] && index == pulseIndex || mode == "FADE" && isFading[elm.id] && index == fadeIndex )
					  {
					  var increase0=ease(frame, b[0], change0, totalframes);
					  var increase1=ease(frame, b[1], change1, totalframes);
					  var increase2=ease(frame, b[2], change2, totalframes);
					  var tempColor = 'rgb('+parseInt(increase0)+','+parseInt(increase1)+','+parseInt(increase2)+')';
					  elm.style['backgroundColor']  = tempColor;
					  currentColor[elm.id] = tempColor;
					  }
				  if( mode.match("^PULSE") && isPulsing[elm.id] && index == pulseIndex && frame == totalframes ) // last frame during a pulse (either end of wax or end of wane)
				    if( mode == "PULSE_WAX" )
					  setTimeout( function(){pulseWane(elm, index);}, holdDuration ); // start the pulse waning
					else
					  pulseWax( elm, index ); // start the pulse waxing
                  }
				  
				  timer = setTimeout(color,interval*frame);				  
                 })(); 
   if( !( mode.match("^PULSE") && isPulsing[elm.id] && index == pulseIndex || mode == "FADE" && isFading[elm.id] && index == fadeIndex ) )
     break;
  }
 }

// -- Utility Functions --
function ease(frame,begin,change,totalframes) {
   return begin + change * (frame / totalframes);
}
function d2h(dec) { 
       return dec.toString(16);
}
function h2d(hex) { 
       return parseInt(hex,16);
}
function rgb2h(r,g,b) { 
         return [d2h(r),d2h(g),d2h(b)];
}
function h2rgb(h,e,x) {
        return [h2d(h),h2d(e),h2d(x)];
}
function cssColor2rgb(color) {
     if(color.indexOf('rgb')<=-1) {
     return h2rgb(color.substring(1,3),color.substring(3,5),color.substring(5,7));
     }
     return color.substring(4,color.length-1).split(',');
}