var myBlankImage = '/images/spot/blank.gif';

var myObj = new Array();



myObj[0] = { 'image' : '/images/spot/spot_issues.jpg',  'link' : '/issues/'};
myObj[1] = { 'image' : '/images/spot/spot_connect.jpg',    'link' : '/connect/'};
myObj[2] = { 'image' : '/images/spot/spot_involved.jpg',   'link' : '/volunteer/'};
myObj[3] = { 'image' : '/images/spot/spot_economy.jpg',    'link' : '/issues/'};
myObj[4] = { 'image' : '/images/spot/spot_healthcare.jpg', 'link' : '/issues/'};
myObj[5] = { 'image' : '/images/spot/spot_jobs.jpg',       'link' : '/issues/'};


var myISF = new Array();
myISF[0] = { 'clock' : null, 'fade' : true, 'count' : 1 , 'n' : 1 };
myISF[1] = { 'clock' : null, 'fade' : true, 'count' : 1 , 'n' : 1 };
myISF[2] = { 'clock' : null, 'fade' : true, 'count' : 1 , 'n' : 1 };


var myLevels  = Math.ceil( ( myObj.length > 0 ? myObj.length / 3 : 0 ) );
var myCurrent = -1;

preloadImages();

function preloadImages()
{

	var tmpCache  = [];

	for(var i=0; i<myObj.length; i++)
	{
		tmpCache[i] = new Image;
		tmpCache[i].src = myObj[i].image;
	}

	tmpCache[myObj.length] = new Image;
	tmpCache[myObj.length].src = myBlankImage;

}



function swapfade()
{

	isf = myISF[arguments[4]];

	if(isf.clock == null)
	{
		isf.id = arguments[4];

		//copy the image object 
		isf.obj = arguments[0];
		
		//copy the image src argument 
		isf.src = arguments[1];
		
		//store the supported form of opacity
		if(typeof isf.obj.style.opacity != 'undefined')
		{
			isf.type = 'w3c';
		}
		else if(typeof isf.obj.style.MozOpacity != 'undefined')
		{
			isf.type = 'moz';
		}
		else if(typeof isf.obj.style.KhtmlOpacity != 'undefined')
		{
			isf.type = 'khtml';
		}
		else if(typeof isf.obj.filters == 'object')
		{
			//weed out win/ie5.0 by testing the length of the filters collection (where filters is an object with no data)
			//then weed out mac/ie5 by testing first the existence of the alpha object (to prevent errors in win/ie5.0)
			//then the returned value type, which should be a number, but in mac/ie5 is an empty string
			isf.type = (isf.obj.filters.length > 0 && typeof isf.obj.filters.alpha == 'object' && typeof isf.obj.filters.alpha.opacity == 'number') ? 'ie' : 'none';
		}
		else
		{
			isf.type = 'none';
		}
		
		//change the image alt text if defined
		if(typeof arguments[3] != 'undefined' && arguments[3] != '')
		{
			isf.obj.alt = arguments[3];
		}


		//if any kind of opacity is supported
		if(isf.type != 'none')
		{
			//copy and convert fade duration argument 
			//the duration specifies the whole transition
			//but the swapfade is two distinct transitions
			isf.length = parseInt(arguments[2], 10) * 100;
			
			//create fade resolution argument as 20 steps per transition
			//again, split for the two distrinct transitions
			isf.resolution = parseInt(arguments[2], 10) * 10;

			if(arguments[5]){
				if(isf.id == (myISF.length-1))
					syncIt();
			}
			else{
				//start the timer
				isf.clock = setInterval('fadeOut('+isf.id+')', isf.length/isf.resolution);
			}
		}
		
		//otherwise if opacity is not supported
		else
		{
			//just do the image swap
			isf.obj.src = isf.src;
		}
		
	}
}

function syncIt(){

	bool = 0;

	for(var i=0; i<myISF.length; i++)
	{

		isf = myISF[i];
		isf.n = 1;
		isf.count = 0.1;

		isf.clock = setInterval('fadeIn('+isf.id+')', isf.length/isf.resolution);

	}

	return ( bool == myISF.length ? 1 : 0);
}


function fadeOut(id)
{

	isf = myISF[id];

	isf.n++;

	if(isf.n > 10+(id*25))
	{

		isf.count = isf.count * 0.9;

		if(isf.count < (1 / isf.resolution))
		{
			clearInterval(isf.clock);
			isf.clock   = null;
			isf.obj.src = myBlankImage;

			if(isf.id == (myISF.length-1)){
				syncIt();
			}

		}


		switch(isf.type)
		{
			case 'ie' :
				isf.obj.filters.alpha.opacity = isf.count * 100;
				break;

			case 'khtml' :
				isf.obj.style.KhtmlOpacity = isf.count;
				break;

			case 'moz' : 
				//restrict max opacity to prevent a visual popping effect in firefox
				isf.obj.style.MozOpacity = (isf.count == 1 ? 0.9999999 : isf.count);
				break;

			default : 
				//restrict max opacity to prevent a visual popping effect in firefox
				isf.obj.style.opacity = (isf.count == 1 ? 0.9999999 : isf.count);
		}

	}

}


function fadeIn(id){

	isf = myISF[id];

	isf.n++;

	if(isf.n > 10+(id*25))
	{

		isf.obj.src = isf.src;

		isf.count = (isf.count * (1/0.9));
	
		if(isf.count > (1 - (1 / isf.resolution)))
		{

				clearInterval(isf.clock);
				isf.clock = null;

				isf.count  = 1;
				isf.n      = 1;
		}

		switch(isf.type)
		{
			case 'ie' :
				isf.obj.filters.alpha.opacity = isf.count * 100;
				break;

			case 'khtml' :
				isf.obj.style.KhtmlOpacity = isf.count;
				break;

			case 'moz' : 
				//restrict max opacity to prevent a visual popping effect in firefox
				isf.obj.style.MozOpacity = (isf.count == 1 ? 0.9999999 : isf.count);
				break;

			default : 
				//restrict max opacity to prevent a visual popping effect in firefox
				isf.obj.style.opacity = (isf.count == 1 ? 0.9999999 : isf.count);
		}

	}

}


function spot_change(init){

	if(init && myObj.length > 3)
	document.getElementById("spot4").style.display = 'block';

	if(myLevels > 0){

		myCurrent++;

		if(myCurrent >= myLevels)
			myCurrent = 0;

		for(i=0;i<3;i++){

			c = i+(myCurrent*3);

			imgElm  = document.getElementById('spotImg'+i+'');
			linkElm = document.getElementById('spotURL'+i+'');

			if(c < myObj.length){
				swapfade(imgElm, myObj[c].image, '1', '[Spotlight '+i+']',i, init);
				linkElm.href = myObj[c].link;

			}
			else{
				swapfade(imgElm, myBlankImage, '1', '[Spotlight '+i+']',i, init);
				linkElm.href = '#';
			}
		}

	}

}

document.onload = spot_change(1);
