// Start reading at the bottom of this file.
// Thanks Son of Suckerfish.

var menuHoverDelayTime = 0;
var needIframeHack = false;
var timeout = undefined;
var numMenusOpen = 0;
var els = new Array();

// You got here from the bottom of this file, I presume?
// Attaches events to everything that needs an event.  Saves an array
// of the menu buttons for later.
setUpHover = function() {
    var el = undefined;
    var suppr = undefined;

    if(document.getElementById("prodnav") != undefined) {
        // find the menus and store them for later use.  Attach
        // event handlers to them.
        var tags = document.getElementsByTagName("li");
        for (var i = 0; i < tags.length; i++) {
            if(tags[i].id.indexOf("menucat") != -1) {
                els[els.length] = tags[i];
                tags[i].onmouseover = function() { showMenu(this); };
                tags[i].onmouseout = function() { hideMenu(this); };

                // Attach events to highlight the menu items themselves.
                menus = tags[i].getElementsByTagName('li');
                for (var j = 0; j < menus.length; ++j) {
                    menus[j].onmouseover = function() { highlightMenuItem(this, true); };
                    menus[j].onmouseout = function() { highlightMenuItem(this, false); };
                }

                // Create an iframe for each of the menu items, to keep
                // form elements from showing through.
                if (needIframeHack) {
                    suppr = document.createElement("iframe");
                    // JPG format so browser will cache the image.
                    suppr.setAttribute("src", "//akamaipix.crutchfield.com/null.jpg");
                    suppr.style.display = "none";
                    tags[i].insertBefore(suppr, tags[i].getElementsByTagName("ul")[0]);
                }
            }
        }
    }
}

// Fires when you mouse over/out of one of the individual menu items.
function highlightMenuItem(obj, onOff) {
    if (onOff) {
        obj.className = "sfhover";
    }
    else {
        obj.className = "";
    }
}

// This function actually turns the menu on or off.  'obj' is the
// button bar -- the <li> that contains the menu <ul>.
function displayMenu(obj, on) {
    if (needIframeHack) {
        var iframe = obj.getElementsByTagName("iframe")[0];
        var menu = obj.getElementsByTagName("ul")[0];
        if (iframe && menu && on) {
            // Make the iframe the same size as the menu, but behind it.
            // This keeps form elements from showing through the menu.
            iframe.style.width = menu.offsetWidth;
            iframe.style.height = menu.offsetHeight;
            iframe.style.top = menu.style.top;
            iframe.style.left = menu.style.left;
            iframe.style.zIndex = menu.style.zIndex + 1;
            iframe.style.display = "block";
        }
        else {
            iframe.style.display = "none";
        }
    }
    if (on) {
        // Don't just set the className to 'sfhover' because it might have
        // several classes applied.  Prepend 'sfhover ' to the className,
        // to preserve the other classes.
        obj.className = "sfhover " + obj.className;
        ++numMenusOpen;
    }
    else if (obj.className.indexOf("sfhover") >= 0) {
        obj.className = obj.className.replace(new RegExp("sfhover ?"), "");
        --numMenusOpen;
    }
}

// Turns off all menus.
function closeAllMenus(currentMenu) {
    for (var i = 0; i < els.length; ++i) {
        displayMenu(els[i], false);
        if (els[i].id != currentMenu.id) {
            showOnState(els[i], false);
        }
    }
}

// Shows the "on" state in the button bar itself (not the actual menu)
// by swapping out the image the user hovered over.
function showOnState(litem, on) {
    var img = litem.getElementsByTagName("img")[0];
    if (img) {
        if (on) {
            img.src = img.src.replace('_off', '_on');
        }
        else {
            img.src = img.src.replace('_on', '_off');
        }
    }
}

// Fires when the user hovers over a button bar.  Either displays
// the menu right away (if the user moved from another menu) or casuse
// the menu to display after some time.
function showMenu(litem) {
    if (timeout != undefined) {
        clearTimeout(timeout);
        timeout = undefined;
    }
    if ((el=document.getElementById(litem.id)) != null) {
        var numMenusPrevOpen = numMenusOpen;
        closeAllMenus(el);
        showOnState(el, true);
        if (numMenusPrevOpen > 0) {
            // The user is moving the mouse between open menus, so don't delay.
            displayMenu(el, true);
        }
        else {
            var code = 'if((el=document.getElementById("' + litem.id + '"))!=null){'
                + 'displayMenu(el, true);}';
            timeout = setTimeout(code, menuHoverDelayTime);
        }
    }
}

// Fires when the user mouses out of a button bar.
function hideMenu(litem) {
    if (timeout != undefined) {
        clearTimeout(timeout);
        timeout = undefined;
    }
    var code = 'if((el=document.getElementById("' + litem.id + '"))!=null)'
        + '{displayMenu(el, false);showOnState(el, false);}';
    timeout = setTimeout(code, menuHoverDelayTime);
}

// Hack to stop a weird behavior on IE.  Read the wiki for details.
if(window.attachEvent) {
    window.attachEvent(
        'onload',
        function() {
            if((so = document.getElementById("specialOffers")) != null) {
                var old = so.className;
                so.className = "sfhover " + so.className;
                so.className = old;
            }
        }
    );
}

// This is the "entry point" to the code.  This causes the setUpHover code
// to run when the page loads.  Now go look at the setUpHover code.
// Thanks http://www.brothercake.com/site/resources/scripts/onload.
// Other browsers just degrade gracefully to a button bar.
if(window.addEventListener) { // standard
    window.addEventListener('load', setUpHover, false);
}
else if(document.addEventListener) { // opera 7
    document.addEventListener('load', setUpHover, false);
}
else if(window.attachEvent) { // win/ie
    needIframeHack = true;
    window.attachEvent('onload', setUpHover);
}