var timer = null;

$(document).ready(function() {
	
	$(".submenu, #submenu-work, #submenu-about, #submenu-contact").hide();
	
	$("#menu .item, .submenu .item").mouseenter(function() {
		clearTimeout(timer);
		switch(this.id) {
			case "menu-work":
				$("#submenu-work, #submenu-about, #submenu-contact").hide();
				$("#submenu-work").show();
				$("#menu-work img").attr("src", "static/img/menu-work-on.png");
				break;
			case "menu-about":
				$("#submenu-work, #submenu-about, #submenu-contact").hide();
				$("#submenu-about").show();
				$("#menu-about img").attr("src", "static/img/menu-about-on.png");
				break;
			case "menu-contact":
				$("#submenu-work, #submenu-about, #submenu-contact").hide();
				$("#submenu-contact").show();
				$("#menu-contact img").attr("src", "static/img/menu-contact-on.png");
				break;
		}
		$("#header").animate({ height: "118px" }, 250);
		$(".submenu").fadeIn(250);
	});
	
	$("#menu .item, .submenu .item").mouseleave(function() {
		timer = setTimeout("restoreMenu()", 2500);
		$("#menu-work img").attr("src", "static/img/menu-work-off.png");
		$("#menu-about img").attr("src", "static/img/menu-about-off.png");
		$("#menu-contact img").attr("src", "static/img/menu-contact-off.png");
	});

});


function restoreMenu() {
	$("#header").animate({ height: "92px" }, 250);
	$(".submenu").fadeOut(250);
}