var i = 0; //initialize the counter
var slide; //setup the image array variable
//alert('duntet')
function SlideShow() {
	
	if(document.getElementById('homeSlideShow'))
	{
	//fade out the current slide
	$( slide[i] ).fade({ duration:2 });
	
	//add 1 to i 
	i++;		
	//check if we've reached the end of our slides, if so, rewind i to 0		
	if (i == slide.length) i = 0; 
	
	//fade in the next slide and after it's finished, loop this function
	$( slide[i] ).appear({ duration:1.5, afterFinish: function () { setTimeout('SlideShow();',2000)  } });
	}
} 

//start my functions after the document has loaded


	
document.observe('dom:loaded', function () {
	if(document.getElementById('homeSlideShow'))
	{
	//hide all of the slideshow images	
	$$('#homeSlideShow img').each(function(image){
		$(image).hide();
	});
		
	//dump the images into an array
	slide =  $('homeSlideShow').childElements();

	//fade in the first slide and after it's finished, start the slideshow
	$( slide[0] ).appear({ duration:1.5, afterFinish: function () { SlideShow(); } });
	}
	
});