/****************************************************************
 *                                                              *
 * Moc 10 Media                                                 *
 * A Division of The Working Man Group, L.L.C.                  *
 * http://www.moc10media.com/                                   *
 *                                                              *
 * Script Name: menus.js                                        *
 * Script Version: 1.0                                          *
 * Script Info: Drop Down Menus Script                          *
 *                                                              *
 ****************************************************************/

// Initialize some variables
// The "menus" array is a multidimensional array that holds the name of a menu div and an X position compensation value.
// For example, if the web page is a 900px wide page, centered in the middle, and you want the first menu to come up 25px
// pushed in to the right of the main 900px div on the page, you enter 25 into the second value of that array. That value
// is calculated against the "gutter" value along of the sides of the page to position the menu item correctly.

var top = 0;
var gutter = 0;
var scrollOffset = 0;
var menuOpen = "";
var menus = new Array(new Array("servicesMenu", 280, 125),
                      new Array("resInfoMenu", 280, 185),
                      new Array("contactMenu", 280, 230));

// Function to initialize the menus

function initMenus() {

    // Set the gutter of the page
    gutter = (document.body.clientWidth - 950) / 2;

    // Establish the menu positions
    for (i = 0; i < menus.length; i++) {

        top = menus[i][2];

        // Compensate for scrolling
        if ((navigator.platform.indexOf("Mac") != -1) && (navigator.userAgent.indexOf("Safari") != -1)) {
            scrollOffset = window.pageYOffset;
        } else {
            scrollOffset = document.body.scrollTop;
            top = top - scrollOffset;
            scrollOffset = 0;
        }

        div = document.getElementById(menus[i][0]);
        div.style.top = top + "px";
        div.style.left = (gutter + menus[i][1]) + "px";
    }
}

// Function to show a menu

function showMenu(div) {

    // Re-initialize the menus based on any new window sizing or scrolling
    initMenus();

    // Set the menuOpen variable and display the current menu
    menuOpen = div;
    var currentMenu = document.getElementById(div);
    currentMenu.style.display = "block";
}

// Function to hide a menu

function hideMenu(div) {
    menuOpen = "";
    idName = document.getElementById(div);
    idName.style.display = "none";
}

// Function to hide all menus

function hideAll(div) {
    for (i = 0; i < menus.length; i++) {
        div = document.getElementById(menus[i][0]);
        div.style.display = "none";
    }
}

// Function to check for the mouse outside of a menu and close that menu

function checkMenu(event) {
    if (menuOpen != "") {
        // Set the boundaries of the current open menu (top X,Y and bottom X,Y) to detect if the mouse is outside of the menu
        // There's about a 30px pad to allow for some cushion as the mouse rolls out of the menu area 
        var currentMenuOpen = document.getElementById(menuOpen);
        var topXCoor = currentMenuOpen.offsetLeft - 300;
        var topYCoor = currentMenuOpen.offsetTop - 100 - scrollOffset;
        var bottomXCoor = currentMenuOpen.offsetLeft + currentMenuOpen.offsetWidth + 100;
        var bottomYCoor = currentMenuOpen.offsetTop + currentMenuOpen.offsetHeight + 100 - scrollOffset;

        if (navigator.appName.indexOf("Microsoft") != -1) {
            if ((window.event.clientX > bottomXCoor) || (window.event.clientX < topXCoor) || (window.event.clientY < topYCoor) || (window.event.clientY > bottomYCoor)) {
                hideMenu(menuOpen);
            }
        } else {
            if ((event.clientX > bottomXCoor) || (event.clientX < topXCoor) || (event.clientY < topYCoor) || (event.clientY > bottomYCoor)) {
                hideMenu(menuOpen);
            }
        }

    }
}

