﻿
(function ($) {
    $.fn.extend({
        isChildOf: function (filter_string) {

            var parents = $(this).parents().get();

            for (j = 0; j < parents.length; j++) {
                if ($(parents[j]).is(filter_string)) {
                    return true;
                }
            }
            return false;
        }
    });
})(jQuery);

var AllowHideMenu = true;
var AllowSetHide = true;

//new way
var inMainMenu = false;

$(document).ready(function () {
    LoadMainMenu();
});

function LoadMainMenu() {
    
    $(".TopMenuItem").mouseover(function () {
        AllowHideMenu = false;
        $(".SecondBottom").hide();
        $(".ProductLowerMenu").hide();
        $(".Second").hide();
        $(".MainMenuHover").hide();
        $(".Third").hide();
        $("#ProductMenu").hide();
        $("#ProductMenuBottom").hide();

        var submenu = $(this).parent().find(".Second");
        var bottom = $(this).parent().find(".SecondBottom");

        var width = $(this).width();

        width = 180 - width;
        submenu.css("margin-left", -width + "px");

        var overlay = CreateMainMenuHover(this);
        var ProductLowerMenu = $(this).parent().find(".ProductLowerMenu");

        var offset = $(this).offset();
        overlay.css({top: offset.top + 15, left: offset.left});
        overlay.insertAfter(this);
        submenu.css({top: offset.top + 15, left: offset.left}).show();

        var productNodeTest = $(this).parent().find(".ProductNode").html();

        if (productNodeTest != null && productNodeTest != undefined) {
            var submenuOffset = submenu.offset();
            ProductLowerMenu.css({top: submenuOffset.top + submenu.height() + 20, left: submenuOffset.left});
            ProductLowerMenu.show();

            bottom.css({top: submenuOffset.top + submenu.height() + ProductLowerMenu.height() + 40, left: submenuOffset.left});
        }
        else {
            var submenuOffset = submenu.offset();
            bottom.css({top: submenuOffset.top + submenu.height() + 20, left: submenuOffset.left});
        }

        bottom.find(".Fill").width(194 - 16);

        bottom.show();
    });


    $("#MainMenu").mouseout(function () {
        AllowHideMenu = true;
        setTimeout(function () { HideAllMenus(); }, 300);
    });

    var ProductMenuExpansion = function () {
        AllowHideMenu = false;
        $("#ProductMenu").hide();
        $("#ProductMenuBottom").hide();

        var submenu = $(this).select(".Third");

        CreateProductMenu(submenu, $(this));
    };

    $(".SecondLevelItem").mouseover(ProductMenuExpansion);
    $(".ProductNode").mouseover(ProductMenuExpansion);
    $(".ProductMenu").mouseover(function () { AllowHideMenu = false; });

    SetMenuHideOptions();
};

function SetMenuHideOptions() {
    var disableHide = function () {
        AllowHideMenu = false;

    };

    $("#MainMenu").mouseover(disableHide);
    $("#MainMenu .Second").mouseover(disableHide);
    $("#MainMenu .SecondBottom").mouseover(disableHide);
    $("#MainMenu .ProductNode").mouseover(disableHide);
    $("#MainMenu .SecondLevelItem").mouseover(disableHide);
    $("#MainMenu .ProductNode").mouseover(disableHide);


    $(".ProductMenu").mouseover(disableHide);
    $("#ProductMenu").mouseover(disableHide);
    $("#ProductMenu .Column").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem .Title").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem .Title a").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem .ModelItems").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem .ModelItems .ModelItem").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem .ModelItems .ModelItem:hover").mouseover(disableHide);
    $("#ProductMenu .Column .SeriesItem .ModelItems .ModelItem a").mouseover(disableHide);
    $("#ProductMenu div").mouseover(disableHide);
    $("#ProductMenu a").mouseover(disableHide);
    $("#ProductMenu a").mouseout(disableHide);

}

function CreateMainMenuHover(element) {

    var item = $(element);
    var width = item.width() + 26;
    var overlay = "<div class=\"MainMenuHover\" style=\"width:" + width + "px\"><div class=\"MainMenuHoverLeft\"></div><div class=\"MainMenuHoverCenter\" style=\"width: " + (item.width() + 10) + "px;\"><a href=\"" + item.attr("href") + "\">" + item.html() + "</a></div><div class=\"MainMenuHoverRight\"></div></div>";
    var $overlay = $(overlay);
    $overlay.find(".MainMenuHoverCenter").click(function () {
        location.href = item.attr("href");
    });
    return $overlay;
}

function HideAllMenus() {

    if (AllowHideMenu) {

        $("#MainMenu .Second").hide();
        
        $("#MainMenu .SecondBottom").hide();
        $("#MainMenu .MainMenuHover").hide();
        $("#MainMenu .Third").hide();
        $("#ProductMenu").hide();
        $("#ProductMenuBottom").hide();
        $(".ProductLowerMenu").hide();
    }

}

function CreateProductMenu(ProductList, el) {
    var data = ParseProductList(ProductList);
    if (data.length > 0) {
        var ProductHTML = "";

        //default to 2 columns
        var maxColumns = 2;

        var columns = new Array();

        //if 6 or more series we will use 3 columns
        if (data.length >= 6) {
            maxColumns = 3;
        }


        var currentColumn = 0;
        for (var i = 0; i < data.length; i++) {
            if (columns[currentColumn] == null || columns[currentColumn] == undefined) {
                columns[currentColumn] = "";
            }

            columns[currentColumn] += BuildSeriesItem(data[i]);

            currentColumn++;
            if (currentColumn > maxColumns - 1) {
                currentColumn = 0;
            }
        }
        for (var i = 0; i < columns.length; i++) {
            ProductHTML += "<div class=\"Column\">" + columns[i] + "</div>";
        }

        var productMenu = $("#ProductMenu");
        var productMenuBottom = $("#ProductMenuBottom");

        if (maxColumns == 3) {
            productMenu.css("width", "660px");
        }
        else {
            productMenu.css("width", "440px");
        }

        productMenu.html(ProductHTML);
        var elOffset = el.offset();
        productMenu.css({top: elOffset.top - 10, left: elOffset.left + el.width()}); 
        productMenu.show();
       
        var height = productMenu.height();
        var width = productMenu.width();
        width = width + 40;

        if (width < 600) {
            width = width - 8;
            productMenuBottom.find(".RightCurve").show();
        }
        else {
            productMenuBottom.find(".RightCurve").hide();
        }
        
        productMenuBottom.css({
            "margin-top": (elOffset.top - 82 + height) + "px",
            left: elOffset.left + el.width()
        });
        
        productMenuBottom.find(".Fill").css("width", width);
        productMenuBottom.show();
        

        SetMenuHideOptions();
    }
}

function ParseProductList(ProductList) {
    var data = new Array();

    $(ProductList).find(".Series").each(function () {

        var seriesItem = new Object();

        seriesItem.Title = $(this).attr("title");
        seriesItem.Url = $(this).attr("url");
        seriesItem.Models = new Array();


        $(this).find(".Model").each(function () {
            var modelItem = new Object();
            modelItem.Title = $(this).attr("title");
            modelItem.Url = $(this).attr("url");
            seriesItem.Models.push(modelItem);
        });

        data.push(seriesItem);

    });

    return data;
}

function BuildSeriesItem(seriesData) {
    var series = "<div class=\"SeriesItem\">";

    series += "<div class=\"Title\"><a href=\"" + seriesData.Url + "\">" + seriesData.Title + "</a></div>";
    series += "<div class=\"ModelItems\">";
    for (var i = 0; i < seriesData.Models.length; i++) {
        series += BuildModelItem(seriesData.Models[i]);
    }
    series += "</div>";
    series += "</div>";

    return series;
}

function BuildModelItem(modelData) {
    var model = "<div class=\"ModelItem\">";
    model += "<a href=\"" + modelData.Url + "\">" + modelData.Title + "</a>";
    model += "</div>";

    return model;
}



