var to = null;
var BaseURL = Utilities.GetBaseURL();

$(document).ready(function() {

    $("ul.mainnav > li").bind("mouseenter", function(e) {

        var self = this;
        var groupid = $(this).children('a.Nav').attr("groupid");
        var attributeBox = $(this).children(".popOut").children(".attributeBox");
        var secondaryattributes = $(this).children(".popOut").children('.attributes').children('.primaryattributes').children('.secondaryattributes');
        var secondaryattributes2 = $(this).children(".popOut").children('.attributes').children('.primaryattributes2').children('.secondaryattributes');

        if (groupid == 'Product Categories') {
            $(this).children('.popOut').css("height", "300px");
            $(this).children('.popOut').css("left", "-7px");
            secondaryattributes.css("height", "300px");
            attributeBox.css("height", "310px");
            attributeBox.css("left", "300px");
        }
        else if (groupid == 'Product Series') {
            $(this).children('.popOut').css("height", "550px");
            $(this).children('.popOut').css("left", "150px");
            secondaryattributes.css("height", "550px");
            attributeBox.css("height", "560px");
            attributeBox.css("left", "300px");
        }
        else if (groupid == 'Applications') {
            $(this).children('.popOut').css("height", "465px");
            $(this).children('.popOut').css("left", "275px");
            secondaryattributes2.css("height", "465px");
            secondaryattributes.css("height", "465px");
            attributeBox.css("height", "475px");
            attributeBox.css("left", "300px");
        }

        this.timeOut = setTimeout(function() {
            $("ul.mainnav").find('.popOut:visible').hide();
            showNav(self);
            $("ul.mainnav").find('.thirdattributes:visible').hide();
            $("ul.mainnav").find('.thirdattributes2:visible').hide();
            $("ul.mainnav").find('.secondaryattributes:visible').hide();
            $("ul.mainnav").find('.attributeBox:visible').hide();
        }, 400);
        $(this).children('.popOut').css("width", "150px");

    }).bind("mouseleave", function() {
        if (this.timeOut != null)
            clearTimeout(this.timeOut);
    });

    $("ul.mainnav").bind("mouseenter", function() {

    }).bind("mouseleave", function() {
        if (to != null)
            clearTimeout(to);

        $(this).find('.popOut:visible').fadeOut("slow");
    });

    $("ul.mainnav a.attributes").mouseover(function() {
    
        $("ul.mainnav").find('.secondaryattributes:visible').hide();
        $(this).parents('.primaryattributes').children('.secondaryattributes').css("display", "block");
        $(this).parents('.primaryattributes2').children('.secondaryattributes').css("display", "block");

        $("ul.mainnav").find('.attributeBox').css("display", "block");
        var primaryattributeid = $(this).attr("primaryattributeid");
        var attributeBox = $(this).parents(".popOut").children(".attributeBox");
        attributeBox.css("left", "300px");
        attributeBox.load(BaseURL + "AJAX/NavRollOver.aspx?ESAttributeID=" + primaryattributeid);
    }).mouseout(function() {
        if (to != null)
            clearTimeout(to);

    });

    $("ul.mainnav a.attributeLink").mouseenter(function() {

        $("ul.mainnav").find('.thirdattributes:visible').hide();
        $("ul.mainnav").find('.thirdattributes2:visible').hide();
        $(this).parents('.divAttributes').children('.thirdattributes').css("display", "block");
        $(this).parents('.divAttributes2').children('.thirdattributes2').css("display", "block");
        $("ul.mainnav").find('.attributeBox').css("display", "block");


        var secondaryattributeid = $(this).attr("secondaryattributeid");
        var attributeBox = $(this).parents(".popOut").children(".attributeBox");


        if ($(this).parents('.popOut').height() == "300") {
            attributeBox.load(BaseURL + "AJAX/NavRollOver.aspx?ESAttributeID=" + secondaryattributeid);
            $(this).parents('.divAttributes').children('.thirdattributes').css("height", "300px");
        }
        else if ($(this).parents('.popOut').height() == "550") {
            $(this).parents('.divAttributes').children('.thirdattributes').css("height", "500px");
        }
        else if ($(this).parents('.popOut').height() == "465") {
            attributeBox.load(BaseURL + "AJAX/NavRollOver.aspx?ESAttributeID=" + secondaryattributeid);
            $(this).parents('.divAttributes').children('.thirdattributes').css("height", "465px");
            $(this).parents('.divAttributes2').children('.thirdattributes2').css("height", "465px");

            if (secondaryattributeid == 14) {
                attributeBox.css("left", "470px");
            } else {
                attributeBox.css("left", "300px");
            }
        }

    }).mouseleave(function() {
        if (to != null)
            clearTimeout(to);

    });

    $("ul.mainnav a.attributeLink2").mouseover(function() {
        $("ul.mainnav").find('.thirdattributes2:visible').hide();
        $(this).parents('.divAttributes2').children('.thirdattributes2').css("display", "block");
        $("ul.mainnav").find('.attributeBox').css("display", "block");
        var secondaryattributeid = $(this).attr("secondaryattributeid");
        var attributeBox = $(this).parents(".popOut").children(".attributeBox");
        attributeBox.load(BaseURL + "AJAX/NavRollOver.aspx?ESAttributeID=" + secondaryattributeid);

        if ($(this).parents('.popOut').height() == "465") {
            $(this).parents('.divAttributes2').children('.thirdattributes2').css("height", "465px");

            if (secondaryattributeid == 14) {
                attributeBox.css("left", "470px");
            } else {
                attributeBox.css("left", "300px");
            }
        }

    }).mouseout(function() {
        if (to != null)
            clearTimeout(to);

    });

    $("ul.mainnav a.attributeLink").click(function() {
    var primaryattributeid = $(this).parents('.primaryattributes').children('.attributes').attr("primaryattributeid");
        var secondaryattributeid = $(this).attr("secondaryattributeid");
        window.location.href = "NavigationLandingPage.aspx?PrimAttID=" + primaryattributeid + "&SecAttID=" + secondaryattributeid;
    });

    $("ul.mainnav a.attributeLink2").click(function() {
    var primaryattributeid = $(this).parents('.primaryattributes2').children('.attributes').attr("primaryattributeid");
        var secondaryattributeid = $(this).attr("secondaryattributeid");
        window.location.href = "NavigationLandingPage.aspx?PrimAttID=" + primaryattributeid + "&SecAttID=" + secondaryattributeid;
    });

    $("ul.mainnav a.thirdattributeLink").click(function() {
        var attributeBox = $(this).parents(".popOut").children(".attributeBox");
        var primaryattributeid = $(this).parents('.primaryattributes').children('.attributes').attr("primaryattributeid");
        var secondaryattributeid = $(this).parents('.divAttributes').children('.attributeLink').attr("secondaryattributeid");
        var thirdattributeid = $(this).attr('thirdattributeid');
        attributeBox.css("left", "300px");
        window.location.href = "NavigationLandingPage.aspx?PrimAttID=" + primaryattributeid + "&SecAttID=" + secondaryattributeid + "&ThirdAttID=" + thirdattributeid;
    });

    $("ul.mainnav a.thirdattributeLink2").click(function() {
        var attributeBox = $(this).parents(".popOut").children(".attributeBox");
        var primaryattributeid = $(this).parents('.primaryattributes2').children('.attributes').attr("primaryattributeid");
        var secondaryattributeid = $(this).parents('.divAttributes2').children('.attributeLink2').attr("secondaryattributeid");
        var thirdattributeid = $(this).attr('thirdattributeid2');
        attributeBox.css("left", "300px");
        window.location.href = "NavigationLandingPage.aspx?PrimAttID=" + primaryattributeid + "&SecAttID=" + secondaryattributeid + "&ThirdAttID=" + thirdattributeid;
    });
});

function showNav(root) {

    $(root).children('.popOut').each(function(index, element) {

        if (element.style.display != "block") {
            element.style.display = "block";
        }
    });
}