//Starts when DOM is ready
$(function() {

    var closedImg = "/_layouts/images/beta1/freccia_bianca.gif";
    //set img path for when submenu is visible
    var openedImg = "/_layouts/images/beta1/freccia_gialla.gif";

    var cssClosed = {
        "background-image": "url('" + closedImg + "')",
        "background-repeat": "no-repeat",
        "background-position": "100% 50%"
    }

    var cssOpen = {
        "background-image": "url('" + openedImg + "')",
        "background-repeat": "no-repeat",
        "background-position": "100% 50%"
    }

    $("table.navigazione1livello").find("td:last").css(cssClosed);

    $("table.navigazione1livelloon").find("td:last").css(cssOpen);

    //For each Quick Launch navigation sub menu:
    $("table.navigazioneMenu2").each(function() {
        //Find any navigation items under the sub menu that have been selected.
        var selectedNavItems = $(this).find("table.navigazione2livelloon");

        //Find the corresponding navigation header of the current sub menu being processed
        var menuHeader = $(this).parents("tr:eq(0)").prev("tr").prev("tr").find("table.navigazione1livello:eq(0)");

        if ($(menuHeader).hasClass("navigazione1livelloon") || selectedNavItems.length > 0) {
            //if the navigation header for this sub menu is selected or if there are any
            //selected navigational items in this submenu, show the submenu.
            menuHeader.find("td:last").css(cssOpen);
            $(this).show();
        }
        else {
            menuHeader.find("td:last").css(cssClosed);
            //otherwise, hide the submenu
            $(this).hide();
        }

        $(this).find("tr[id]").each(function(i) {
            if (i > 0) {
                $(this).prev("tr").find("td:first").css({ "background-color": "#999999" });
            }
            $(this).find("a:first").css({ "margin-left": "0px" });
        });

    });

    //When a user clicks a navigation header, the user should be taken directly
    //to the site link. The javascript event handler to hide/display the submenus
    //should not be triggered.
    $("a.navigazione1livello").click(function(e) {
        e.stopPropagation();
    });

    //When the user hovers over the navigation header, it would be nice
    //to have an indicator that they can click on the header. Usually,
    //browsers use the hand icon to indicate clickable items.
    $("table.navigazione1livello").hover(function(e) {
        $(this).css("cursor", "hand");
    }, function(e) {
        $(this).css("cursor", "default");
    });

    //Finally, this adds a click event handler for the navigation header table
    $("table.navigazione1livello").click(function(e) {
        var subMenu = $(this).parents("tr:eq(0)").next("tr").next("tr").find("table.navigazioneMenu2:eq(0)");
        if (subMenu.length > 0) {
            //only if we have a submenu should we hide the other submenus and show the current one.
            $("table.navigazioneMenu2").hide();
            subMenu.show();
        }

    });
});