/*
	Image Cross Fade Redux
	Version 1.0
	Last revision: 02.15.2006
	steve@slayeroffice.com

	Rewrite of old code found here: http://slayeroffice.com/code/imageCrossFade/index.html
*/

window.addEventListener?window.addEventListener('load',so_init,false):window.attachEvent('onload',so_init);

var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;

function so_init()
{
	if(!d.getElementById || !d.createElement)return;

	css = d.createElement('link');
	css.setAttribute('href','css/slideshow2.css'); //this part adds in a new stylesheet that sets the images in rotator to be invisible and top left
	css.setAttribute('rel','stylesheet');
	css.setAttribute('type','text/css');
	d.getElementsByTagName('head')[0].appendChild(css);

	imgs = d.getElementById('homeHeadImgMain').getElementsByTagName('img'); //read thru homeHeadImgMain and get the names of all the images in it
	for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0; //set all of them to opacity zero (and stylesheet sets them to display:none)
	imgs[0].style.display = 'block'; //set the first one in the array to be block and full opacity (nearly full, anyway, for IE's sake)
	imgs[0].xOpacity = .99;

	setTimeout(so_xfade,7000); //after three seconds, get the ball rolling
	//seems like here is the place-- don't run so_xfade until the next image is loaded, perhaps?  no, wait, do it inside of so_xfade
	//manually add images to array for best results, probably.  Or at least, best without having to change the code that much
}

function so_xfade()
{
	cOpacity = imgs[current].xOpacity; //opacity of current image
	nIndex = imgs[current+1]?current+1:0; //if there is a next image in the array, set the nIndex to be the number of that next image, otherwise set it to zero (first position in that array)
	nOpacity = imgs[nIndex].xOpacity; //opacity of the next item in the array

	cOpacity-=.05; //decrease current item
	nOpacity+=.05; //increase next item

	imgs[nIndex].style.display = 'block'; //set next one to block instead of display:none
	imgs[current].xOpacity = cOpacity; //see 4 lines up (decreasing opacity)
	imgs[nIndex].xOpacity = nOpacity; //see 4 lines up (increasing opacity)

	setOpacity(imgs[current]); //these two lines actually make the opacity shift happen, using the function below
	setOpacity(imgs[nIndex]);

	if(cOpacity<=0)//if opacity value for current image is less than zero
	{
		imgs[current].style.display = 'none'; //set it to display:none to make it really gone
		current = nIndex; //set value of current to be the next image in line
		setTimeout(so_xfade,7000);
	}
	else
	{
		setTimeout(so_xfade,50); //if we're not done fading the current one out, keep stepping it down every 50 milliseconds
	}

	function setOpacity(obj)
	{
		if(obj.xOpacity>.99)
		{
			obj.xOpacity = .99;
			return;
		}

		obj.style.opacity = obj.xOpacity;
		obj.style.MozOpacity = obj.xOpacity;
		obj.style.filter = 'alpha(opacity=' + (obj.xOpacity*100) + ')';
	}
}