﻿/// <reference path="jquery-1.3.2.min.js" />

$j(document).ready(function() {
    var allItems = $j("#MainMenuLevel .Item");
    var allItemCount = allItems.length;

    allItems.each(function(idx, e) {
        // Applying menu styles to each menu item.
        // [MB]
        var currentItemActive = $j(e).hasClass("Active");
        var leftItemClass = "";
        var rightItemClass = "";

        var classSuffix = (currentItemActive) ? "Active" : "Inactive";
        var hoverSuffix = "Hovered";

        if (idx == 0) {
            leftItemClass = "LeftOuter";
            rightItemClass = "RightInner";
        }
        else if (idx == (allItemCount - 1)) {
            leftItemClass = "LeftInner";
            rightItemClass = "RightOuter";
        }
        else {
            leftItemClass = "LeftInner";
            rightItemClass = "RightInner";
        }

        var oldWidth = $j(e).css("width");
        $j(e).css("width", parseInt(oldWidth) - 18);
        $j(e).attr("id", "MainMenuCurrent_" + idx);

        $j(e).before("<div class=\"Item BorderItem " + leftItemClass + classSuffix + "\" id=\"MainMenuBefore_" + idx + "\"></div>");
        $j(e).after("<div class=\"Item BorderItem " + rightItemClass + classSuffix + "\" id=\"MainMenuAfter_" + idx + "\"></div>");

        if (currentItemActive) {
            $j(e).attr("active", "active");
        }

        var domEl = $j(e).get(0);
        if (domEl) {
            var match = domEl.innerHTML.toLowerCase().match(/\<br/);
            if (!match) {
                $j(e).css("height", "25px");
                $j(e).css("padding-top", "10px");
            }
        }

        // Attaching event handlers to the menu items.
        // [MB]
        $j(e).hover(function(itemToHover) {
            $j("#MainMenuBefore_" + idx).removeClass(leftItemClass + classSuffix).addClass(leftItemClass + hoverSuffix);
            $j("#MainMenuAfter_" + idx).removeClass(rightItemClass + classSuffix).addClass(rightItemClass + hoverSuffix);
            $j("#MainMenuCurrent_" + idx).addClass(hoverSuffix);
        }, function(itemToUnhover) {
            $j("#MainMenuBefore_" + idx).removeClass(leftItemClass + hoverSuffix).addClass(leftItemClass + classSuffix);
            $j("#MainMenuAfter_" + idx).removeClass(rightItemClass + hoverSuffix).addClass(rightItemClass + classSuffix);
            $j("#MainMenuCurrent_" + idx).removeClass(hoverSuffix);
        });
    });


    var subCatItems = $j("#SubCatNav .Item");
    var subCatItemCount = allItems.length;

    if (subCatItemCount > 0) {
        subCatItems.each(function(idx, e) {
            var currentItemActive = $j(e).hasClass("Active");
            $j(e).attr("id", "SubCatNavCurrent_" + idx);
            var borderClass = (currentItemActive) ? "Active" : "";

            //            $j(e).before("<div class=\"BorderItem " + borderClass + "LeftBorder\" id=\"SubCatNavBefore_" + idx + "\"></div>");
            //            $j(e).after("<div class=\"BorderItem " + borderClass + "RightBorder\" id=\"SubCatNavAfter_" + idx + "\"></div>");

            // Attaching event handlers to the menu items.
            // [MB]
            if (!currentItemActive) {
                $j(e).hover(function(itemToHover) {
                    $j("#SubCatNavBefore_" + idx).addClass("HoveredLeftBorder");
                    $j("#SubCatNavAfter_" + idx).addClass("HoveredRightBorder");
                    $j("#SubCatNavCurrent_" + idx).addClass("Hovered");
                }, function(itemToUnhover) {
                    $j("#SubCatNavBefore_" + idx).removeClass("HoveredLeftBorder");
                    $j("#SubCatNavAfter_" + idx).removeClass("HoveredRightBorder");
                    $j("#SubCatNavCurrent_" + idx).removeClass("Hovered");
                });
            }
        });
    }


    var forKidsItems = $j(".ForKidsMenu .Item");
    var forKidsItemCount = forKidsItems.length;

    if (forKidsItemCount > 0) {
        forKidsItems.each(function(idx, e) {
            $j(".Content", e).after("<div class=\"RightEdge\"></div>");
            $j(e).attr("id", "KidsMenuItem_" + idx);

            $j(e).hover(function(itemToHover) {
                $j("#KidsMenuItem_" + idx).addClass("Hovered");
            }, function(itemToUnhover) {
                $j("#KidsMenuItem_" + idx).removeClass("Hovered");
            });
        });
    }
});
