﻿
var selectedMenu = null;
  
function InitializeNavigationMenus(menuCount, exclusionMenu){
    
    for(var i = 1; i < menuCount + 1; i++){
        if(i == exclusionMenu) continue;
        
        var menuId = 'NavigationMenu' + i;
        var element = document.getElementById(menuId);
        var subMenu = document.getElementById('NavigationSubMenu' + i);
        var menu = new NavigationMenu(element, subMenu);
        
        menu.turnOff(); //default to off
    }
}

function NavigationMenu(element, subMenu){    
    this.element = element;
    this.subMenu = subMenu;
    this.timerId = null;
    
    var innerMenu = this;
    
    this.element.onmouseout = closeWithDelay;       
    this.subMenu.onmouseout = closeWithDelay;
    
    this.element.onmouseover = function(){          
        if(selectedMenu && selectedMenu.element.id != this.id) selectedMenu.turnOff();
        
        innerMenu.turnOn();
    }
    
    this.subMenu.onmouseover = function(){      
        innerMenu.turnOn();
    }
        
    function closeWithDelay(){
        innerMenu.timerId = window.setTimeout(close, 100); //adjust the time here
    }
    
    function close(){
        innerMenu.turnOff();
        selectedMenu = null;
    }
}

NavigationMenu.prototype.turnOn = function(){
    window.clearTimeout(this.timerId);
    this.subMenu.className = 'NavigationSubMenu NavigationSubMenuOn';
    selectedMenu = this;
}

NavigationMenu.prototype.turnOff = function(){
    window.clearTimeout(this.timerId);  
    this.subMenu.className = 'NavigationSubMenu NavigationSubMenuOff';
}


