
var currentOpenMenu;
var currentOpenSubMenu = null;
var menuTimer;
var subMenuTimer;
var currXSpace;
var subMenuOpen = false;
var currentImageOver;
var currentImageOut;
var closeMenuInMillisecs = 200;

var overColor = '#f8d010';
var outColor = '#faf2bb';

function showMenu(menuName,xSpace,imageOut,imageOver){
	clearInterval(menuTimer);
	if(menuName != currentOpenMenu){
		closeMenu(currentOpenMenu);
	}
	if(imageOut){
		currentImageOut = imageOut;
	}
	if(imageOver){
		currentImageOver = imageOver;
	}
	currentOpenMenu = menuName;
	currXSpace = xSpace;
	$("#" + menuName).attr("src",currentImageOver);
	var p = $("#" + menuName).position();
	var navHeight = $("#" + menuName).height();
	
	$("#menu" + menuName).css("left",p.left + xSpace).css("top",p.top + navHeight).css("visibility","visible");
}

function showSubMenu(subMenu){
	subMenuOpen = true;
	clearInterval(subMenuTimer);
	closeSubMenu(currentOpenMenu + subMenu);
	currentOpenSubMenu = subMenu;
	var p = $("#" + currentOpenMenu).position();
	var sp = $("#div" + subMenu).position();
	var navHeight = $("#nav" + currentOpenMenu).height();
	$("#div" + subMenu).css('background-color', overColor);
	//alert(navHeight + sp.top  + $("#navigation").position().top);
	$("#sub" + subMenu).css("top",p.top + sp.top + 33).css("visibility","visible").css("left",p.left + $("#menu" + currentOpenMenu).width() + currXSpace);
}

function startCurrentMenuCloseTimer(){
	if(subMenuOpen == true){
		startCurrentSubMenuCloseTimer();
		subMenuOpen = false;
	}
	menuTimer = setInterval("closeMenu()",closeMenuInMillisecs);
}

function startCurrentSubMenuCloseTimer(){
	subMenuTimer = setInterval("closeSubMenu()", closeMenuInMillisecs);
}

function closeMenu(){
	$("#" + currentOpenMenu).attr("src",currentImageOut);
	$("#menu" + currentOpenMenu).css("visibility","hidden");
	currentImageOver = null;
	currentImageOut = null;
	currentOpenMenu = null;
	clearInterval(menuTimer);
}

function closeSubMenu(){
	$("#sub" + currentOpenSubMenu).css("visibility","hidden");
	$("#div" + currentOpenSubMenu).css('background-color', outColor);
	clearInterval(subMenuTimer);
}

$(function() {
   $('.menuItem').hover( function(){
      $(this).css('background-color', overColor);
   },
   function(){
      $(this).css('background-color', outColor);
   });
});

