// page initialization
$(document).ready(function(){ 
	// initialize the menus
	$("a.nav").each(function(){
		// find a menu for this one
		var jNav = $(this);
		// get the id and extract the name
		var sNavId = jNav.attr("id").split("-")[1];
		if(sNavId) {
			var jMenu = $("#menu-"+sNavId);
			if(jMenu.length > 0 && jMenu.eq(0).find("a.menu").length > 0) {
				jMenu = jMenu.eq(0);
				// attach the functions
				jNav.bind("mouseover", function(e){
					// get the position of the parent and position the box
					var oPos = jNav.position();
					jMenu.css("left", (oPos.left - 7) + "px");
					jMenu.css("top", (oPos.top + parseInt(jNav.height())) + "px");
					menuIn(jMenu);
				}).bind("mouseout", function(e){
					menuOut(e, jNav, jMenu);
				});
				jMenu.bind("mouseout", function(e){
					menuOut(e, jNav, jMenu);
				});
			}
		}
	});
}); 

function menuIn(jMenu) {
	jMenu.css("display", "block");
}

function menuOut(e, jNav, jMenu) {
	// test the mouse. if still over, don't hide
	var oNavPos = jNav.position();
	var oMenuPos = jMenu.position();
	
	var oNavDim = {width: parseInt(jNav.width()), height: parseInt(jNav.height())};
	var oMenuDim = {width: parseInt(jMenu.width()), height: parseInt(jMenu.height())};
	
	var mouseX = e.pageX;
	var mouseY = e.pageY;

	// correction of mouse position
	mouseX -= parseInt($("#main").get(0).offsetLeft) + 5; // container has 5px additional offset from main
	mouseY -= 34;

	if((mouseY < oNavPos.top) ||
	   (mouseY >= (oMenuPos.top + oMenuDim.height)) ||
	   (mouseY < oMenuPos.top && (mouseX < oNavPos.left || mouseX >= oNavPos.left + oNavDim.width)) ||
	   (mouseY >= oMenuPos.top && (mouseX < oMenuPos.left || mouseX >= oMenuPos.left + oMenuDim.width))) {
		jMenu.css("display", "none");
	}
}