//browser check
var DHTML = (document.getElementById || document.all || document.layers);
if(!DHTML) alert('Your browser is not capable of displaying DHTML');

//create the object array
var slides = new Array('slide0', 'slide1', 'slide2');

//set the speed in ms by which objects change 
var speed = 6000;

//set the speed in ms of fade in/out frame rate
var fSpeed = 2000;

//set the pause speed in ms of objects at next/previous buttons
var pSpeed = 10000;

//holds the current object index
var current = 0;

//holds the timeout between slide changes
var timeout = 0;

//function to start the slideshow
function slideShow()
{
	//display first object
	display(slides[current]);
		
	//get current object id
	x = slides[current];

	//point to next object
	current = (current+1) % slides.length;

	//display next object
	display(slides[current]);	

	//get next object id
	y = slides[current];

	//apply opacity change between current and next object
	opacity(x, y, fSpeed);
	
	setTimeout('hide(x)', fSpeed);
	
	//load images at specified speed
	timeout = setTimeout('slideShow()', speed);
}

//function to display an object
function display(id)
{
	//get current object and display it
	object = getObject(id);
	object.style.display = 'block';
}

//function to hide an object
function hide(id)
{
	//get current object and hide it
	object = getObject(id);
	object.style.display = 'none';
}

//function to get an object given the object id
function getObject(id)
{
	if (document.getElementById) 
	{      
		return document.getElementById(id);
	}    				
	else if (document.all) 				
	{      
		return document.all[id];
	}
	else if (document.layers)
	{      
		return document.layers[id];								
	}
	else 
	{      
		return undefined;    
	}  
}  

//function to control frame rate of opacity
//and calculate new opacity values
//@param  id1 is the id of first object
// 	    id2 is the id of the second object
//	    millisec is the frame rate 
function opacity(id1, id2, millisec)
{ 
	//speed for each frame 
	var speed = Math.round(millisec / 100); 
	var timer = 0;
	//variable used for countdown
	var n = 100; 
	
	//from 0 to 100% opacity level
	for(i = 0; i <= 100; i++) 
	{
		//first object's opacity level decreases
		setTimeout("changeOpac(" + n + ",'" + id1 + "')",(timer * speed));
		//second object's opacity level increases
		setTimeout("changeOpac(" + i + ",'" + id2 + "')",(timer * speed));
		
		n--; 
		timer++; 
	}
} 

//function to set the opacity value of an object 
//for different browsers
function changeOpac(opacity, id) 
{ 
	var object = getObject(id).style;
	//works with Firefox. Must be 101 to avoid flickering!
	object.opacity = (opacity / 101);
	//works with Firefox too
	//object.MozOpacity = (opacity / 101); 
	//object.KhtmlOpacity = (opacity / 100);
	//works with MSIE
	object.filter = "alpha(opacity=" + opacity + ")"; 
}

//function to pause at the next slide until timeout
function nextSlide()
{
	//clear previous timeout and set new
	clearTimeout(timeout);
	
	//get current object id
	x = slides[current];

	//point to next object
	current = (current+1) % slides.length;

	//get next object id
	y = slides[current];

	display(y);

	//apply opacity change between current and next object
	opacity(x, y, fSpeed);

	setTimeout('hide(x)', fSpeed);
	
	//slideshow resumes after newSpeed times out
	timeout = setTimeout('slideShow()', pSpeed);
}

//function to pause at the previous slide until timeout
function prevSlide()
{
	//clear previous timeout and set new
	clearTimeout(timeout);
	
	//get current object id
	x = slides[current];

	//point to previous object
	if(current == 0)
	{
		current = slides.length - 1;
	}
	else
	{
		current = current - 1;
	}		

	//get previous object id
	y = slides[current];

	display(y);

	//apply opacity change between current and previous object
	opacity(x, y, fSpeed);

	setTimeout('hide(x)', fSpeed);
	
	//slideshow resumes after newSpeed times out
	timeout = setTimeout('slideShow()', pSpeed);
}