var activeMenu;

document.observe('dom:loaded', function()
{
    //Watch the onClick for each mainNav_root anchor
    $$('a.mainNav_root').each(function(item)
    {
        //Make the current menu the active one
        if(item.hasClassName('port_current'))
        {
            item.currentState = 'active';
            activeMenu = item;
            new Effect.Appear(item.next(), {duration: 1.0, delay: 1.0});
        }
        
        Event.observe(item, 'click', toggleMenus.bindAsEventListener(this, item))
    });
    Event.observe('header', 'mouseover', showmenu);
    Event.observe('main', 'mouseover', hidemenu);
    //Event.observe($('mainNav_root'), 'mouseout', hidemenu.bindAsEventListener(this, item));
});

toggleMenus = function()
{
    //Check if there is a UL adjacent to the clicked anchor
    element = arguments[1];
    if(!element.next('ul'))
    {
        return;
    }
    
    //If there is, toggle the visible state of that menu item
    
    //See if there is already a menu open
    if(empty(activeMenu))
    {
        activeMenu = element;
    }
    
    if(empty(element.currentState) || element.currentState == 'inactive')
    {
        //Close any already-opened menu
        if(!empty(activeMenu) && activeMenu.currentState == 'active')
        {
            activeMenu.currentState = 'inactive';
            new Effect.Fade(activeMenu.next(), {duration: 0.5, queue: {position: 'end', scope: 'menus'}});
            activeMenu.removeClassName('active');
        }
        
        //Open the current menu
        new Effect.Appear(element.next(), {duration: 1.0, queue: {position: 'end', scope: 'menus'}});
        activeMenu = element; //Keep track of this for the next time
        activeMenu.currentState = 'active';
        element.addClassName('active');
    }
    else
    {
        //Close the already opened menu, regardless of what menu that is
        new Effect.Fade(activeMenu.next(), {duration: 0.5, queue: {position: 'end', scope: 'menus'}});
        activeMenu.currentState = 'inactive';
    }
};

showmenu = function()
{
    var i = 0;
    $$('#mainNav_root:not(.nocollapse) li:not(.current)').each(function(item)
    {
        if(item.status == undefined || item.status == 'closed')
        {
	        new Effect.BlindDown(
	            item,
	            {
	                duration: 0.3,
                    queue:
                    {
                        position: 'end',
                        scope: 'menuFold' + i
                    }
	            }
	        );
	        item.status = 'open';
	        i++;
        }
    });
};

hidemenu = function()
{
    var i = 0;
    $$('#mainNav_root:not(.nocollapse) li:not(.current)').each(function(item)
    {
        if(item.status == 'open')
        {
	        new Effect.BlindUp(
	            item,
	            {
	                duration: 0.3,
                    queue:
                    {
                        position: 'end',
                        scope: 'menuFold' + i
                    }
	            }
	        );
            item.status = 'closed';
            i++;
        }
    });
};

showElement = function(id)
{
    if(typeof id != 'undefined')
    {
        new Effect.Appear(
	        id,
	        {
	            duration: 0.0,
	            afterFinish: resetScrollbar
	        }
        );
    }
};

hideElement = function(id)
{
    if(typeof id != 'undefined')
    {
        $(id).hide();
    }
};

resetScrollbar = function()
{
    if(scrollbar)
    {
        //scrollbar.enable();
        scrollbar.recalculateLayout();
    }
};