var timer = null;	
function showSubNav(i, state) {
	switch(state)
	{
		case "show":
			// show the subnav ul element
			$('sub-' +i.id).className='sub-show';
			// show the subnav ro for the activating element
			i.className = 'activate-ro';
			// fade in the subnav division
			$('subnav').tween('opacity',1); 
			// hide the old one, so we dont have two at the same time
			// do this when its a different element to curnav and when the curnav != blank
			if (curnav != i.id && curnav != 'blank')
			{
			  $('sub-' + curnav).className = 'sub-hide';
			  $(curnav).className = 'activate';
			}
			// remember the current one for next time.
			curnav = i.id;
			break;
		case "hide":
			$('sub-blank').className = 'sub-show'; 
			
			if (curnav != 'blank')
			{
			  $('sub-' +curnav).className = 'sub-hide';
			  $(curnav).className = 'activate';
			  $('subnav').tween('opacity',0);
			}
			curnav = 'blank';
			break;
	}
	
	
}
function startResetTimer() {
	if (timer)
		clearTimeout(timer);
	timer = setTimeout(resetNav,10000);
}
 
 function resetNav () {
	 switch (curnav)
	 {
	 	case "":
		case "blank":
			if (selected != "blank")
			{
				$('subnav').tween('opacity',1);
				$('sub-'+selected).className	= 'sub-show';
				$('subnav').className 			= 'subnav-show';
				$('sub-blank').className		= 'sub-hide';
				$(selected).className			= 'activate-ro';
				curnav = $(selected).id;
			} else {
				// selected is blank	
				$('subnav').tween('opacity',0);
				curnav = 'blank';
			}
			break;
		case selected:
			break;
		default:
			// curnav is something - needs to be reset
			$('sub-' +curnav).className = 'sub-hide';
			$(curnav).className = 'activate';
			if (selected == "blank")
			{
				$('subnav').tween('opacity',0);
				curnav = 'blank';
			} else {
				$('subnav').tween('opacity',1);
				$('sub-'+selected).className	= 'sub-show';
				$('subnav').className 			= 'subnav-show';
				$('sub-blank').className		= 'sub-hide';
				$(selected).className			= 'activate-ro';
				curnav = $(selected).id;
			}
 	}
 }