var numberHPCContainers=0;
$(document).ready(function() {
	
	numberHPCContainers=$('div[id^="hpcContainer"]').length;
	//populate the first one
	$("#mainHPC").html($("#hpcContainer-1").html());
	setInterval(moveNextHPC, 8000);
	
});


var visibleHPC=1;
var userHasClicked=0;
function highlightLegend(idToHighlight)
{
	var counter=1;
	$("#hpcLegend").children("a").each(function() {
		
		if (idToHighlight == counter)
		{
			//highlight

			$(this).attr("class","nav-rotate-on");
			
		}
		else
		{
			//unhighlight

			$(this).attr("class","nav-rotate-off");
			
		}
		counter++;
	
	}
);
}
function findDisplayedHPC()
{
	//loop through the hpc containers and see which one is currently being displayed
	//not using this anymore as the async nature was causing problems
	$('div[id^="hpcContainer"]').each(function() {
			if ($(this).is(':visible'))
			{
				visibleHPC=parseInt($(this).attr("id").replace("hpcContainer-",""));
				
			}
		
		}
	);
	
}
function moveNextHPC()
{
	//this function call only comes from the setInterval function call
	if (userHasClicked)
		return;

	var next=visibleHPC+1;
	if (next > numberHPCContainers)
	{
		next=1;
	}
	showHPC(next);
	
}
function clickHPC(idToFadeIn)
{
	userHasClicked=1;
	showHPC(idToFadeIn);
}
function showHPC(idToFadeIn)
{
	

//	$("#hpcContainer-"+visibleHPC).fadeOut('slow',function(){
//		
//		$("#hpcContainer-"+idToFadeIn).fadeIn('slow');
//		highlightLegend(idToFadeIn);
//		visibleHPC=idToFadeIn;
//	});
	
	$("#mainHPC").fadeTo('slow',0,function(){
		var newContent=$("#hpcContainer-"+idToFadeIn).html();
		$("#mainHPC").html(newContent);
		$("#mainHPC").fadeTo('slow',1);
		highlightLegend(idToFadeIn);
		visibleHPC=idToFadeIn;
	});
//	$("#hpcContainer-"+visibleHPC).fadeTo('slow',0.1,function(){
//		$("#hpcContainer-"+visibleHPC).hide();
//		$("#hpcContainer-"+idToFadeIn).fadeTo('slow',1);
//		highlightLegend(idToFadeIn);
//		visibleHPC=idToFadeIn;
//	});
	
}