var navTimer = null;

$(document).ready(function () {
    // This will be at least until we insert the <div> permanently into the page.
    $('<div id="nav_dropdown"></div>').insertAfter("#navigation");
    $('#nav_dropdown').hide();


    $("#navigation ul").children().each(function () {
        $(this).hover(function () {
            // Stop the timer and the submenu.
            switch_back();

            // Present the menu.
            $('#nav_dropdown').find().show();
            $('#nav_dropdown').show();
            $('#nav_dropdown').append('<div id="menu_ptr"></div>');

            // This is to handle a compatibility issue with IE:
            // Determine the absolution location of the navigation.
            var nav_offset = $("#navigation").offset();
            $('#nav_dropdown').css("left", nav_offset.left);

            // Transplant the submenu into the <div> we want.
            $(this).find("ul").first().clone().appendTo("#nav_dropdown");

            // Update the links so that the banners, menus, etc. behave properly.
            var parent_href = $(this).find("a").first().attr("href");
            var parent_href_chunks = parent_href.split("&");
            $("#nav_dropdown").find("a").each(function () {
                child_href = $(this).attr("href");
                child_href = parent_href_chunks[0] + "&url=" + child_href;
                $(this).attr("href", child_href);
            });

            // Update the menu image.
            var img_src = $(this).find("img").first().attr("src");
            var img_src_chunks = img_src.split("/");
            img_src_chunks[img_src_chunks.length - 1] = "active_" + img_src_chunks[img_src_chunks.length - 1];
            img_src = img_src_chunks.join("/");
            $(this).find("img").first().attr("src", img_src);

            // Add the little pointer thing.          
            var img_width = $(this).find("img").first().width();
            var img_offset = $(this).find("img").first().offset();
            var img_pos = $(this).find("img").first().position();
            var ptr_offset = $("#menu_ptr").offset();
            var ptr_pos = $("#menu_ptr").position();
            var adj_left = ptr_offset.left - ptr_pos.left;
            $("#menu_ptr").css("left", (img_pos.left - adj_left + 15) + "px");

            // We're giving the transplanted <ul> a class to
            // distinguish it from the others we will create.
            $("#nav_dropdown").children("ul").addClass("source");

            // Now we're going to pull selections of the source <ul>
            // to create new <ul>s to distribute the <li>s across
            // the submenu <div>.

            var width = $("#nav_dropdown .source").width();
            var cols = 4; // From the design.
            var rows = $("#nav_dropdown .source").children("li").length / cols;
            rows = Math.ceil(rows);

            for (i = 0; i < cols; i++) {
                $("#nav_dropdown .source").children("li").clone().slice(i * rows, (i + 1) * rows).appendTo("#nav_dropdown");
                if (i == 0)
                    $("#nav_dropdown").children("li").wrapAll("<ul class='first' style='width: " + width + "px;'></ul>");
                else
                    $("#nav_dropdown").children("li").wrapAll("<ul style='width: " + width + "px;'></ul>");
            }

            var nav_count = $("#nav_dropdown").children("ul").length;

            // Only present the menu of there's content;
            // some navigation button's don't have submenus.
            if (nav_count <= 0) {
                $("#nav_dropdown").hide();
            }

        }, function () {
            clearTimeout(navTimer);
            navTimer = setTimeout('switch_back();', 100);
        });
    });

    $('#nav_dropdown').hover(function () {
        clearTimeout(navTimer);
    }, function () {
        clearTimeout(navTimer);
        navTimer = setTimeout('switch_back();', 100);
    });
});



function switch_back() {
    $('#nav_dropdown').hide();
    $("#nav_dropdown").children().remove();
    $("#navigation img").each(function () {
        var img_src = $(this).attr("src")
        var active_pos = img_src.indexOf("active_");
        if (active_pos > -1) {
            img_src = img_src.replace("active_", "");
            $(this).attr("src", img_src)
        }
    });
    $("#menu_ptr").css("left", "auto");
    $("#menu_ptr").css("top", "auto");
    clearTimeout(navTimer);
}


function navImage(id, image, blank, i, total) {
    if (image == "")
        if (blank == "")
            $("#img_" + id).attr('src', "/Content/AirWeigh/Images/empty.gif");
        else
            $("#img_" + id).attr('src', "/UserFiles/AWNavigation/" + blank);
    else
        $("#img_" + id).attr('src', "/UserFiles/AWNavigation/" + image);

    var parent = $("#img_" + id).parent('li');


    var totalHeight = total * 34;
    var maxHeight = totalHeight - (34 * 4);
    var top = i * 34;


    if (top >= maxHeight && total > 3)
        $("#img_" + id).css("margin-top", maxHeight);
    else if (total < 4)
        $("#img_" + id).css("margin-top", 0);
    else
        $("#img_" + id).css("margin-top", top);
}