var ishovered = false;

//$(".stl_main").children().hover(function(){ishovered = true}, function(){ishovered = false});

function theRotator() {
	//Set the opacity of all images to 0
	$('div.stl_backimage ul li').css({opacity: 0.0});
	$('div.stl_backimage ul li').removeClass('show');
	//Get the first image and display it (gets set to full opacity)
	//$('div.stl_backimage ul li:first').css({opacity: 1.0});
	//$('.stl_mainovertext strong').html($('div.stl_backimage ul li:first').find('img').attr("alt")); //Get Alt Tag of Image
	//$('.stl_mainovertext p').html($('div.stl_backimage ul li:first').find('img').attr("title")); //Get Title Tag of Image
	rotate();
   
	//Call the rotator function to run the slideshow, 6000 = change to next image after 6 seconds
	
}

function rotate() {	
	//Get the first image
	if(!ishovered)
	{
	    var current = ($('div.stl_backimageul li.show')?  $('div.stl_backimage ul li.show') : $('div.stl_backimage ul li:first'));

	    //Get next image, when it reaches the end, rotate it back to the first image
	    var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div.stl_backimage ul li:first') :current.next()) : $('div.stl_backimage ul li:first'));	
    	//scape the last one
    	if(next.attr('id')=='liLast')
    	    next= $('div.stl_backimage ul li:first');
	    //Set the fade in effect for the next image, the show class has higher z-index
	    next.css({opacity: 0.0}).addClass('show').animate({opacity: 1.0}, 1000);

	    //Hide the current image
	    current.animate({opacity: 0.0}, 1000).removeClass('show');
    	
	    //Get the new content
    	
	    $('.stl_mainover').animate({marginLeft: '-280px', opacity: 0.0}, 1000);
	    $('.stl_mainovertext').animate({marginLeft: '-280px', opacity: 0.0}, 1000, function(){
	        $('.stl_mainovertext strong').animate({opacity: 1.0}, 1000).html(next.find('img').attr("alt")); //Get Alt Tag of Image
	        $('.stl_mainovertext p').animate({opacity: 1.0}, 1000).html(next.find('img').attr("title")); //Get Title Tag of Image
	    });
	    $('.stl_mainovertext').animate({marginLeft: '-0px', opacity: 1.0}, 1000);
	    $('.stl_mainover').animate({marginLeft: '-0px', opacity: 0.6}, 1000);
	  
	}
	 setTimeout ( "rotate()", 6000 );

	 
};

$(document).ready(function() {		
	//Load the slideshow
	theRotator();
});