dojo.addOnLoad(init);
dojo.addOnLoad(setIsProductsPageActive);

var productsNav;
var serveNav;
var productsNavLink;
var serveNavLink;
var productsPopup;
var servePopup;
var isProductsPopupShowing = false;
var isServePopupShowing = false;
var isProductsPageActive = false;
var isServePageActive = false;

function init()
{	
	
	productsNav = dojo.query(".products", "main_nav")[0];
	serveNav = dojo.query(".serve", "main_nav")[0];
	productsNavLink = dojo.query(".products a", "main_nav")[0];
	serveNavLink = dojo.query(".serve a", "main_nav")[0];
	productsPopup = dojo.byId("products_popup");
	servePopup = dojo.byId("serve_popup");
	
	dojo.query("a", "main_nav").forEach(function(item){
		dojo.connect(item, "onclick", null, hidePopups);
	});
	
	dojo.query("a", "products_popup").forEach(function(item){
		dojo.connect(item, "onclick", null, hidePopups);
	});
	
	dojo.query("a", "serve_popup").forEach(function(item){
		dojo.connect(item, "onclick", null, hidePopups);
	});
	
	//dojo.connect(document.body, "onclick", null, hidePopups);
	dojo.connect(window, "onresize", null, window_resize);
	
	if (productsNav)
	{
		dojo.connect(productsNav, "onclick", null, productsNav_onClick);
	}
	
	if (serveNav)
	{
		dojo.connect(serveNav, "onclick", null, serveNav_onClick);
	}
		
	if (productsNavLink)
	{
		productsNavLink.href = "javascript:void(0)";
	}
	
	if (serveNavLink)
	{
		serveNavLink.href = "javascript:void(0)";
	}
}

function hidePopups()
{
	hideProductsPopup();
	hideServePopup();
}

function nothing()
{
	return true;
}

function setIsProductsPageActive()
{
	isProductsPageActive = (productsNav.className == "products active");
}

function setIsServePageActive()
{
	isServePageActive = (serveNav.className == "serve active");
}

function productsNav_onClick(event)
{
	showProductsPopup();
}

function serveNav_onClick(event)
{
	showServePopup();
}

function window_resize(event)
{
	alignProductsPopup();
	alignServePopup();
}

function showProductsPopup()
{
	hideServePopup();
	if (!isProductsPopupShowing)
	{
		alignProductsPopup()
		dojo.fadeOut(
		{
			node: productsPopup,
			duration: 1,
			onEnd:function()
			{	
				productsPopup.style.zIndex = 2;
				productsPopup.style.visibility = "visible";
				productsNav.className = "products active";
				dojo.fadeIn(
					{
						node: productsPopup,
						duration: 500,
						onEnd: function() {isProductsPopupShowing = true}
					}
				).play();
			}
		}).play();
	}
}

function showServePopup()
{
	hideProductsPopup();
	if (!isServePopupShowing)
	{
		alignServePopup()
		dojo.fadeOut(
		{
			node: servePopup,
			duration: 1,
			onEnd:function()
			{	
				servePopup.style.zIndex = 2;
				servePopup.style.visibility = "visible";
				serveNav.className = "serve active";
				dojo.fadeIn(
					{
						node: servePopup,
						duration: 500,
						onEnd: function() {isServePopupShowing = true; }
					}
				).play();
			}
		}).play();
	}
}

function hideProductsPopup()
{
	if (!isProductsPageActive)
	{
		productsNav.className = "products notactive";	
	}
	
	if (isProductsPopupShowing)
	{
		dojo.fadeOut(
		{
			node: productsPopup,
			duration: 1,
			onEnd:function()
			{
				productsPopup.style.zIndex = -1;
				productsPopup.style.visibility = "hidden";
				
				
				isProductsPopupShowing = false;
			}
		}).play();
	}
}

function hideServePopup()
{
	if (!isServePageActive)
	{
		serveNav.className = "serve notactive";
	}
	
	if (isServePopupShowing)
	{
		dojo.fadeOut(
		{
			node: servePopup,
			duration: 1,
			onEnd:function()
			{
				servePopup.style.zIndex = -1;
				servePopup.style.visibility = "hidden";
				
				
				
				isServePopupShowing = false;
			}
		}).play();
	}
}

function alignProductsPopup()
{
	var products = dojo.coords(dojo.query(".products a", "main_nav")[0]);
	var left = products.x + (products.w/2) - (dojo.coords(productsPopup).w/2);
	productsPopup.style.left = left + "px";
}

function alignServePopup()
{
	var serve = dojo.coords(dojo.query(".serve a", "main_nav")[0]);
	var left = serve.x + (serve.w/2) - (dojo.coords(servePopup).w/2);
	servePopup.style.left = left + "px";
}

