/*
	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;
var rotator_target;
var width;
var height;
var speed;
var isOpera, isIE = false;

if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ //test for MSIE x.x;
	isIE = true;
}

function load_rotator(pics,w,h,s,http_prefix) {
	
	if (http_prefix == undefined) { http_prefix = ""; }
	
	rotator_target = document.getElementById('rotator');	
		
	json_pics = "[";
	
	for(i=0; i<pics.length; i++){
		json_pics += "'" + pics[i] + "',";
		if(i == pics.length-1){
			json_pics = json_pics.substring(0,(json_pics.length-1));
		}	
	}

	json_pics += "]";
	
	var postbody = 'args=' + escape(json_pics);
	
	var options = {
		method:'post',
		postBody: postbody,
		onSuccess: load_rotator_complete
	};
	new Ajax.Request(http_prefix + 'ah_load_rotator.php',options);
}

function load_rotator_complete(t) {
	rotator_target.innerHTML = t.responseText;
	so_init();
}

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

	rotatorDiv = d.getElementById('rotator');
	rotatorImgs = rotatorDiv.getElementsByTagName('img')
		
	var styleRotator = "position: relative;width: " + width + "px;height: " + height + "px;float:left;";
	var styleRotatorImg = "width: " + width + "px;height: " + height + "px;display: none;position: absolute;left:0px;";
		
	//This part of this if works in Firefox currently it is set to false to be disabled as the last else case is being used
	if(!isIE && false){
		css = d.createElement('style');
		css.setAttribute('type','text/css');
		css.innerHTML = "<!-- " +
			"#rotator{position: relative;width: " + width + "px;height: " + height + "px;float:left;} " +
			"#rotator img{width: " + width + "px;height: " + height + "px;display: none;position: absolute;left:0px;} " +
			"-->";
		d.getElementsByTagName('head')[0].appendChild(css);
	} 
	//This case is to handle all IE's (but will not work in firefox currently it is set to false to be disabled as the last else case is being used 
	else if (false){
		rotatorDiv.style.setAttribute('cssText', styleRotator);
		for(i=0; i<rotatorImgs.length; i++){
			rotatorImgs[i].style.setAttribute('cssText', styleRotatorImg);
		}    
	}
	//This case will work in firefox, IEs, and safari.  However, in safari all images show up before first rotation.
	//That will need to be fixed.
	else {
		r = d.getElementById('rotator');
		r.innerHTML = r.innerHTML + "<style type=\"text/css\"><!--" +
			"#rotator{position: relative;width: " + width + "px;height: " + height + "px;float:left;} " +
			"#rotator img{width: " + width + "px;height: " + height + "px;display: none;position: absolute;left:0px;} " +
			"--></style>";
	}   
  
	imgs = d.getElementById('rotator').getElementsByTagName('img');
	for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
	imgs[0].style.display = 'block';
	imgs[0].xOpacity = .99;

	setTimeout(so_xfade,speed);
}

function so_xfade()
{
	cOpacity = imgs[current].xOpacity;
	nIndex = imgs[current+1]?current+1:0;
	nOpacity = imgs[nIndex].xOpacity;

	cOpacity-=.05;
	nOpacity+=.05;

	imgs[nIndex].style.display = 'block';
	imgs[current].xOpacity = cOpacity;
	imgs[nIndex].xOpacity = nOpacity;

	setOpacity(imgs[current]);
	setOpacity(imgs[nIndex]);

	if(cOpacity<=0)
	{
		imgs[current].style.display = 'none';
		current = nIndex;
		setTimeout(so_xfade,speed);
	}
	else
	{
		setTimeout(so_xfade,50);
	}

	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) + ')';
	}
}
