var timerUnhoveredSubmenu = null;

$(document).ready(function(){
	$(".submenu")
		.mouseleave(function(){
			$(this).hide();
			$(".menu-content").stop().fadeTo(300, 1, function(){$(".menu-content").css("filter", "");});
		})
		.mouseenter(function(){ 
			if(timerUnhoveredSubmenu != null) {
				clearTimeout(timerUnhoveredSubmenu);
				timerUnhoveredSubmenu = null;
			}
		})
		.mousemove(function(){ 
			if(timerUnhoveredSubmenu != null) {
				clearTimeout(timerUnhoveredSubmenu);
				timerUnhoveredSubmenu = null;
			}
		});

	$(".menu-item")
		.mousemove(function(){
			showSubmenu($(this));

			var subMenu = $("#sub" + $(this).attr('id'));
				if(subMenu.length == 0)
					$(this).addClass('ui-state-default ui-corner-all');
				else {
					timerFunction = function(){
						$(subMenu).hide();
						$(".menu-content").stop().fadeTo(300, 1, function(){$(".menu-content").css("filter", "");});
					}
					timerUnhoveredSubmenu = setTimeout(timerFunction, 50);
				}
		})
		.mouseleave(function(){
			if(!$(this).hasClass('selected'))
				$(this).removeClass('ui-state-default ui-corner-all');
		});

	$(".submenu .menu-item")
		.mouseenter(function(){
			$(this).stop().animate({paddingLeft:"25px", paddingRight:"25px"}, 300)
		})
		.mouseleave(function(){
			$(this).stop().animate({paddingLeft:"8px", paddingRight:"8px"}, 300);
		});
});

function showSubmenu(menuItem) {
	var subMenu = $("#sub" + $(menuItem).attr('id'));
	if($(subMenu).length == 0)
		return;

	$('.submenu').hide();
	$(".menu-content").stop().fadeTo(300, .4);

	$(subMenu).css({top:$(menuItem).offset().top - 3, left:$(menuItem).offset().left - 13}).stop().show();

	$(subMenu).find(".submenu-header").html((($(menuItem).parent().attr('href') != null) ? "<a href='"+$(menuItem).parent().attr('href')+"'><div style='color:orange;'>" : "") + $(menuItem).text() + (($(menuItem).parent().attr('href') != null) ? "</div></a>" : ""))
		.css({width:$(menuItem).width() + $(menuItem).css('padding-left').split("px")[0]*1 + $(menuItem).css('padding-right').split("px")[0]*1});
}