// JSON Object literal represents nav tree
var navItems={"shop_nav":[["New Products", "index.php"],
                          ["Specials", "specials.php"],
                          ["Discontinued", "discontinued-products-c-66.html"]]};

var menuDiv;
var timeoutId;

// Create the dropdown menus
function initMenus()
{
   // Setup the menu container
   menuDiv=new Element("div");
   menuDiv.style.border="1px solid #fffbe5";
   menuDiv.style.borderTop="none";
   menuDiv.style.position="absolute";
   menuDiv.style.display="none";
   
   menuDiv.addListener("mouseover", cancelExpire);
   menuDiv.addListener("mouseout", expire);
   
   $tagName("body")[0].appendChild(menuDiv);
   
   $("shop_nav").addListener("mouseover", function(){ expandMenu("shop_nav"); });
   $("shop_nav").addListener("mouseout", expire);
}

function rollOver(el)
{
   el.style.backgroundColor="#1468BB";
}

function rollOut(el)
{
   el.style.backgroundColor="#053F78";
}

function expandMenu(id)
{
   if(navItems[id].length>0)
   {
      var el=$(id);
      
      menuDiv.style.top=el.getTop()+(Browser.isSafari ? 35 : 32);
      
      menuDiv.style.left=el.getLeft()-21;
      menuDiv.style.width="114px";
      
      menuDiv.innerHTML="";
      
      for(var i=0; i<navItems[id].length; i++)
      {
         menuDiv.innerHTML+="<div style=' cursor:pointer; height:20px; color:#FFFFFF; padding-left:10px; padding-right:10px; border-top:1px solid #fffbe5; background-color:#053F78; text-align:center; line-height:20px; ' onmouseover='rollOver(this)'; onmouseout='rollOut(this);' onclick='window.location.href=\"" + navItems[id][i][1] + "\";'><a href='" + navItems[id][i][1] + "' class='reverse' style=' text-decoration:none; font-size:9pt; '>" + navItems[id][i][0] + "</a></div>";
      }
      
      menuDiv.style.display="block";
      
      cancelExpire();
   }
}

function collapseMenu()
{
   menuDiv.style.display="none";
   menuDiv.style.top=-1000;
   menuDiv.style.left=-1000;
}

function expire()
{
   timeoutId=setTimeout(function(){ collapseMenu(); }, 500);
}

function cancelExpire()
{
   clearTimeout(timeoutId);
}

window.addListener("load", initMenus);