var timer_menu   = 1250;
var submenu_arr = new Array();

function getMouseCoords(e){
    if(!e) e = event;
    
    if (e.pageX || e.pageY)
    {
        cordX = e.pageX;
        cordY = e.pageY;
    }
    else if (e.clientX || e.clientY)
    {
        cordX = e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
        cordY = e.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
    }
}

function initSubmenu(elementId){
    var submenu = document.getElementById(elementId);
    var elements = submenu.getElementsByTagName("ul");
    
    var coord   = getPosition(elementId);
    submenu.left = coord['left'];
    submenu.top  = coord['top'];
    submenu.width = $("#"+elementId).width();
    submenu.height = $("#"+elementId).height();
    
    for(i=0; i < elements.length; i++){
        var elem = elements[i];
        if (elem.className.indexOf("active") == -1){
            elem.style.display = 'none';
        }
        submenu_arr.push(elem.id);
    }
}

function showMenu(id){
    document.onmousemove = getMouseCoords;
    
    var menu    = document.getElementById("menu_"+id);
    var submenu = document.getElementById("submenu_"+id);
    
    for (i=0; i < submenu_arr.length; i++){
        var elem = document.getElementById(submenu_arr[i]);
        elem.style.display = 'none';
        clearInterval(elem.timer);
    }
    
    submenu.style.display = '';
    menu.onmouseout = function(){initHide(id);}
}

function initHide(id){
//    console.log('initHide --  ' + id);
    var submenu = document.getElementById("submenu_"+id);
    if (submenu.className.indexOf("active") == -1){
        submenu.timer = setInterval("hideMenu('" + id + "')", timer_menu);
    }
    else submenu.style.display = '';
}                        
 

function hideMenu(id){ 
    var submenu_wrap = document.getElementById("submenu");
    var submenu = document.getElementById("submenu_"+id);
//    console.log(cordX+ '  ' +cordY);
    if (cordX >= submenu_wrap.left + submenu_wrap.width ||  cordX < submenu_wrap.left  ||   cordY >= submenu_wrap.top + submenu_wrap.height ||  cordY < submenu_wrap.top )       {
        submenu.style.display = 'none';
        clearInterval(submenu.timer);
        
        for (i=0; i < submenu_arr.length; i++){
            var elem = document.getElementById(submenu_arr[i]);
            if (elem.className.indexOf("active") != -1) elem.style.display = '';
        }
        document.onmousemove = '';
    }
}


function getPosition(elementId){                     
    var element = document.getElementById(elementId);
        
    var left = 0;
    var top = 0;
    
    while (element){
        left   += element.offsetLeft;
        top    += element.offsetTop;
        element = element.offsetParent;
    }

    return {top:top,left:left};
}