/*
AUTHOR		: Johan Prawiro (johan.prawiro@rakis-lab.net)
DESCRIPTION	: Links will fade on "onmouseover"-event from one color into another (and back), also option to let link-colors "pulse"
VERSION		: 1.3
LAST UPDATE	: 2004-02-17
NEEDS FILES	: none

--- !Important! -------------------------

	- the function "initFade();" has to be in the onload-attribute of the body-tag! (otherwise it might cause runtime-errors)

--- Details -----------------------------

	- works in IE 5+, NN6+, Mozilla 1+, Opera 7+ (at least... works most likely in older versions, too)
	- won't execute and cause errors in NN4.x
	- set initial vars (marked below) to customize behaviour and color
	- different modes:
		- fade all links in document
		- fade links in document with a certain class-name
		- fade links continueously (pulsing effect)

--- Callable functions with arguments ---

	- initFade(); <- Initialise color-array and link-objects (according to values of control-vars)
	- createObj(name, start-color, end-color, number-of-steps); <- shouldn't be called from "outside", called by function "initFade()"
	- getColArray(startColor, endColor, numOfSteps); <- shouldn't be called from "outside", called by function "createObj"
	- addClass(class-name, do-pulse, start-color, end-color, background); <- adds fade-items with custom colors and pulse-switch (all links with specified class-name will fade with these colors, if "do-pulse" is true -> links will fade continueously within the defined steps)

-----------------------------------------	

--- Additional Comments ---
	I modified this version to fade the background-color of the links

-----------------------------------------	

please e-mail author for comments and suggestions

-----------------------------------------	
*/

// START INITIAL VARS

var steps				= 15;						// Number of colors (including initial and final color)
var delay				= 30;						// Time in ms between fading-steps
var allLinks			= true;						// Fade all links on page?

var pulseStep			= 5;						// links "pulse" between this and the end color-state
var pulseDelay			= 100;						// Time in ms between pulsing-steps
var pulsePeakTime		= 250;						// Time in ms pule remains in highest fade-state

var fadeTable			= new Array();
var fadeStartCol		= new Array();
var fadeEndCol			= new Array();
var fadePulse			= new Array();
var fadeBackground		= new Array();

addClass("",1,"#B00000","#0099FF",0);						// this entity has to be defined wether "allLinks" is "true" or "false"
addClass("navItemLinkSelected",1,"#B00000","#FFFFFF",0);	// fade colors for links with class matching first parameter
addClass("navItemLink",1,"#FFFFFF","#B00000",0);		// fade colors for links with class matching first parameter

// END INITIAL VARS

//	var colors				= new Array(steps);			// Array containing all colors as strings
var anchorClassName		= new String();

function initFade() {								// Initialise object-creation, color-array and set handlers for links
	var whichFadeCol = 0;
	if(document.getElementById) {					// <- execute script only for newer browsers supporting DOM
		for(var i = 0; i < document.getElementsByTagName("a").length; i++) {
			if(document.getElementsByTagName("a")[i].href) {
				anchorClassName = document.getElementsByTagName("a")[i].className;
				whichFadeCol = 0;
				for(var j = 0; j < fadeTable.length; j++) if(anchorClassName == fadeTable[j]) whichFadeCol = j;
				if(allLinks || whichFadeCol != 0) {
					document.getElementsByTagName("a")[i].id				= 'Anker_' + i;
					eval('Anker_' + i + '_obj								= new createObj(\'Anker_' + i + '\',\'' + fadeStartCol[whichFadeCol] + '\',\'' + fadeEndCol[whichFadeCol] + '\',\'' + steps + '\','+ fadePulse[whichFadeCol] +','+ fadeBackground[whichFadeCol] +');');
					eval('document.getElementsByTagName("a")[i].onmouseover	= Anker_' + i + '_obj.fadeIn;');
					eval('document.getElementsByTagName("a")[i].onmouseout	= Anker_' + i + '_obj.fadeOut;');
				}	// end-if
			}	// end-if
		}	// end-for
	}	// end-if
}

function createObj(name, startCol, endCol, stepping, pulse, fadeBack) {	// enhance object properties
	this.css		= document.getElementById(name).style;
	this.ref		= name + "_obj";
	this.backFade	= fadeBack;
	if(fadeBack) {
		this.css.backgroundColor = startCol;
	} else {
		this.css.color = startCol;
	}
	this.colorTable	= getColArray(startCol, endCol, stepping);
	this.pulseline	= pulse;
	this.fadeState	= 0;
	this.timer		= -1;
}

createObj.prototype.fadeIt = function(direction) {	// enhance object method
	this.fadeState			+= direction;
	if((this.fadeState <= steps) && (this.fadeState >= 0)) {
		if(this.backFade) {
			this.css.backgroundColor = this.colorTable[this.fadeState];
		} else {
			this.css.color = this.colorTable[this.fadeState];
		}
		eval('this.timer	= setTimeout("' + this.ref + '.fadeIt(' + direction + ');",' + delay + ');');
	} else {
		this.fadeState		-= direction;
		if(direction && this.pulseline) {
			eval('this.timer	= setTimeout("' + this.ref + '.cycleFade(-1);",' + pulsePeakTime + ');');
		}
	}
}

createObj.prototype.cycleFade = function(direction) {	// enhance object method
	this.fadeState			+= direction;
	if((this.fadeState < steps) && (this.fadeState > pulseStep)) {
		if(this.backFade) {
			this.css.backgroundColor = this.colorTable[this.fadeState];
		} else {
			this.css.color = this.colorTable[this.fadeState];
		}
		eval('this.timer	= setTimeout("' + this.ref + '.cycleFade(' + direction + ');",' + pulseDelay + ');');
	} else {
		this.fadeState		-= direction;
		cycleDelay = pulseDelay;
		if(direction > 0) {
			cycleDelay 		= pulsePeakTime;
		}
		direction			= (-1) * direction;
		eval('this.timer	= setTimeout("' + this.ref + '.cycleFade(' + direction + ');",' + cycleDelay + ');');
	}
}

createObj.prototype.fadeIn = function () {			// Mouseover-handler
	eval('clearTimeout(' + this.id + '_obj.timer);');
	eval(this.id + '_obj.fadeIt(1);');
}

createObj.prototype.fadeOut = function () {			// Mouseout-handler
	eval('clearTimeout(' + this.id + '_obj.timer);');
	eval(this.id + '_obj.fadeIt(-1);');
}

function addClass(fadeClassName,doPulse,fadeStartColor,fadeEndColor,fadeBack) {
	var tmpLength			= fadeTable.length;
	fadeTable.length++;
	fadeStartCol.length++;
	fadeEndCol.length++;
	fadePulse.length++;
	fadeBackground.length++;
	fadeTable[tmpLength]		= fadeClassName;
	fadeStartCol[tmpLength]		= fadeStartColor;
	fadeEndCol[tmpLength]		= fadeEndColor;
	fadePulse[tmpLength]		= doPulse;
	fadeBackground[tmpLength]	= fadeBack;
}

function getColArray(startCol, endCol, numSteps) {	// Calculate all colors and save them in array "colors"
	var colors			= new Array(numSteps);
	colors[0]			= startCol;
	colors[numSteps-1]	= endCol;
	var start_r			= parseInt(startCol.substring(1,3),16);
	var start_g			= parseInt(startCol.substring(3,5),16);
	var start_b			= parseInt(startCol.substring(5,7),16);
	var step_r			= (start_r - parseInt(endCol.substring(1,3),16))/(numSteps - 1);
	var step_g			= (start_g - parseInt(endCol.substring(3,5),16))/(numSteps - 1);
	var step_b			= (start_b - parseInt(endCol.substring(5,7),16))/(numSteps - 1);

	for(var i = 1; i < numSteps - 1; i++) {
		temp_r			= Math.round(start_r - (i*step_r));
		temp_g			= Math.round(start_g - (i*step_g));
		temp_b			= Math.round(start_b - (i*step_b));
		
		temp_r_str		= (temp_r < 16) ? ("0" + temp_r.toString(16)) : temp_r.toString(16);
		temp_g_str		= (temp_g < 16) ? ("0" + temp_g.toString(16)) : temp_g.toString(16);
		temp_b_str		= (temp_b < 16) ? ("0" + temp_b.toString(16)) : temp_b.toString(16);
		colors[i]		= "#" + temp_r_str +  temp_g_str + temp_b_str;
	}
	return colors;
}