/*JQuery Custom Accordian
*/

var buttonDivID = "#buttonWrapper";
var imageDivID ="#imageContainer";
var firstButtonID ="#button0";
var currentButtonID;
var currentButtonIndex;
var lastButtonID ="#button5";
var selectedButtonStyle = "background:transparent url('/_layouts/images/Antares Images/lightArrowAnt.png')"; 
var interval;

$(window).load(function() {
	$
	
	//Select the first button and Image
	$(firstButtonID).children('a').attr('style', selectedButtonStyle);
	currentButtonID=firstButtonID;
	currentButtonIndex=$(currentButtonID).index();
	$('#slideShowImageWrapper' + currentButtonIndex).siblings().hide();
	interval = setInterval("slideShow()", 5000);
	
	//Higlight only the selected button and image on click.
	$(buttonDivID + ' li').click(function(){
	clearInterval(interval);
	$(this).siblings().children('a').removeAttr('style');
	$('#slideShowImageWrapper' + currentButtonIndex).fadeOut('slow');
	$(this).children('a').attr('style', selectedButtonStyle);
	currentButtonID='#' + $(this).attr('id');
	currentButtonIndex=$(currentButtonID).index();
	$('#slideShowImageWrapper' + currentButtonIndex).fadeIn('slow');
	}); 


	  
 			
});
//rotating images
function slideShow() 
{
	$('#slideShowImageWrapper' + currentButtonIndex).fadeOut('slow');
  	if(currentButtonID == lastButtonID) //If current button is the lastbutton restart rotation
  		currentButtonID = firstButtonID;
  	else
  		currentButtonID = '#' + $(currentButtonID).next().attr('id');
  	
  	 $(currentButtonID).children('a').attr('style', selectedButtonStyle);
  	 $(currentButtonID).siblings().children('a').removeAttr('style');
  	 currentButtonIndex=$(currentButtonID).index();
	$('#slideShowImageWrapper' + currentButtonIndex).fadeIn('slow');

 }