var noInteraction = true;

function demoMode() {
	if(noInteraction == true){setPanel(1);demoMode2();}
}

function demoMode2() {
	if(noInteraction == true){setTimeout("setPanel(2);demoMode3();", 5800);}
	$('#image-link').attr('href', imageLinks[1]);
}

function demoMode3() {
	if(noInteraction == true){setTimeout("setPanel(3);demoMode4();", 5800);}
	$('#image-link').attr('href', imageLinks[2]);
}

function demoMode4() {
	if(noInteraction == true){setTimeout("setPanel(4);demoMode5();", 5800);}
	$('#image-link').attr('href', imageLinks[3]);
}

function demoMode5() {
	if(noInteraction == true){setTimeout("demoMode();", 5800);}
	$('#image-link').attr('href', imageLinks[4]);
}

function setPanel(panelNum) {
	if(noInteraction == true){$('ul#productNav li a').removeClass('current');$('li#link-'+panelNum+' a').addClass('current');$('#mask').scrollTo('#panel-'+panelNum, 800);}
}


$(document).ready(function() {	

//Get the height of the first item
$('#mask').css({'height':$('#panel-1').height()});	

//Calculate the total width - sum of all sub-panels width
//Width is generated according to the width of #mask * total of sub-panels
$('#panel').width(parseInt($('#mask').width() * $('#panel div').length));

//Set the sub-panel width according to the #mask width (width of #mask and sub-panel must be same)
//	$('#panel div').width($('#mask').width());

demoMode();

//Get all the links with rel as panel
$('a[rel=panel]').hoverIntent(function () {
								  
	// chop out the url
	var target = $(this).attr('href');
	target = target.split("/");
	target = target[(target.length - 1)];

	//Get the height of the sub-panel
	var panelheight = $(target).height();
	
	//Set class for the selected item
	$('a[rel=panel]').removeClass('current');
	$(this).addClass('current');
	
	//Resize the height
	$('#mask').animate({'height':panelheight},{queue:false, duration:500});			
	
	//Scroll to the correct panel, the panel id is grabbed from the href attribute of the anchor
	$('#mask').scrollTo(target, 800);
	$('#image-link').attr('href', $(this).children('span').text());
	
	noInteraction = false;
	
	//Discard the link default behavior
	return false;
}, function() {});






});