/*
This script is used to for rotating images, randomizing the 
first image to appear on the page, and inducing the fade 
transition effects.  The rotation of images is dependent on the
d.getElementById() and d.getElementsByTagName() methods.
*/
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 collectionToArray(nodes){
    try{
        // works in every browser except IE
        var arr = Array.prototype.slice.call(nodes);
        return arr;
    } catch(err){
        // slower, but works in IE
        var arr = [],
            length = nodes.length;
        for(var i=0; i < length; i++){
            arr.push(nodes[i]);
        }
        return arr;
    }
}

function randOrd(){
return (Math.round(Math.random())-0.5); } 

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

	css = d.createElement('link');
	css.setAttribute('href','level-3.css');
	css.setAttribute('rel','stylesheet');
	css.setAttribute('type','text/css');
	d.getElementsByTagName('head')[0].appendChild(css);

	imgs = d.getElementById('rotator').getElementsByTagName('img'); //This is a node list
	
	imgs = collectionToArray(imgs);
	//for(i=1;i<imgs.length;i++) alert(imgs[i]);
	imgs.sort(randOrd); //This function call randomizes the initial images

	for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
	imgs[0].style.display = 'block';
	imgs[0].xOpacity = .99;

	setTimeout(so_xfade,6000); //This number determines at which interval to change images. 
}

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,6000); //This number also determines at what interval to change images.  Should match the integer above.
	}
	else
	{
		setTimeout(so_xfade,75); //This number determines how fast the transition effects happen.
	}

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