var _menu = {
    Timeout: 500,
    CloseTimer: 0,
    MenuItem: 0,
    CurrentNode: null,
    open: function () {
        _menu.cancelTimer();
        _menu.close();
        _menu.MenuItem = $(this).find('ul').css('visibility', 'visible');

        $(this).addClass("menu_item_hover");
        $(this).children("a").css("color", "#8E171A");

        //if no child nodes, add css to round bottom corners
        if ($(this).children().length == 1) {
            $(this).removeClass("menu_item_hover");

            //code breaks in IE7 and below, so skip (doesn't matter b/c doesn't support CSS3 anyway)
            if (!($.browser.msie && $.browser.version <= 7)) {
                $("#menu li a:hover")
                        .css("-moz-border-radius-bottomleft", "5px")
                        .css("-moz-border-radius-bottomright", "5px")
                        .css("border-bottom-left-radius", "5px")
                        .css("border-bottom-right-radius", "5px");
            }
        }
        else { //round corners of menu
            $(this).children("ul").children("li:last-child").children("a")
                    .css("-moz-border-radius-bottomleft", "5px")
                    .css("-moz-border-radius-bottomright", "5px")
                    .css("border-bottom-left-radius", "5px")
                    .css("border-bottom-right-radius", "5px");

            $(this).children("ul").children("li:first-child").children("a")
                    .css("-moz-border-radius-topright", "5px")
                    .css("border-top-right-radius", "5px");
        }
    },
    close: function () {
        if (_menu.MenuItem) {
            _menu.MenuItem.css('visibility', 'hidden');

            if (_menu.CurrentNode)
                _menu.CurrentNode.removeClass("menu_item_hover").children("a").css("color", "#FFF");
        }
    },
    timer: function () {
        //if no child nodes, change color before timer does
        if ($(this).children().length == 1)
            $(this).children("a").css("color", "#FFF");

        _menu.CurrentNode = $(this);
        _menu.CloseTimer = window.setTimeout(_menu.close, _menu.Timeout);
    },
    cancelTimer: function () {
        if (_menu.CloseTimer) {
            window.clearTimeout(_menu.CloseTimer);
            _menu.CloseTimer = null;
        }
    }
}

$(document).ready(function () {
    $("#menu > li").bind("mouseover", _menu.open);
    $("#menu > li").bind("mouseout", _menu.timer);
});

document.onclick = _menu.close;