﻿var HeaderNavID = 'headernavbar';

var HeaderNavHeight = 55;

var MenuLIClass = 'horizontalCMSListMenuLI';
var SubListMenuULClass = 'horizontalsubCMSListMenuUL';
var MainHeaderDiv = 'horizontalCMSListMenuUL';
var MainWrapperDiv = 'MenuWrapperDiv';
var MenuLinkClass = 'horizontalCMSListMenuLink';

var MenuHoverClass = 'MenuItemHover';
var MenuActiveClass = 'MenuItemActive';

var MenuHideButtonDivClass = 'menuHideButtonDiv';
var MenuHideButtonText = ' ';

var AnimationTime = 200;

var TimeoutLength = 1000;
var timer;
var tabsToMove;
var maxHeight;

$(document).ready(function() {

    maxHeight = 0;

    $('.' + SubListMenuULClass).each(function(index, element) {
        var height = $(element).outerHeight();

        if (height > maxHeight) {
            maxHeight = height;
        }
    });

    $('.' + SubListMenuULClass).hide();

    var wrapperDiv = CreateDivAroundMenu($('.' + MainHeaderDiv));

    $('.' + MenuLIClass + ' > .' + SubListMenuULClass).each(function(index, element) {
        var itemWidth = $('.' + MainWrapperDiv).width() / $(element).children().length;
        var totalPadding = parseInt($('.' + MenuLIClass).css('padding-left'), 10) + parseInt($('.' + MenuLIClass).css('padding-right'), 10);

        $(element).css('left', 0);
        $(element).find('.' + SubListMenuULClass).css('width', itemWidth - totalPadding);
        $(element).children().css('width', itemWidth - totalPadding);
    });
});

$(document).ready(function() {
$('.' + MenuLinkClass).hover(
    function() {
        $(this).addClass(MenuHoverClass);
    },
    function() {
        $(this).removeClass(MenuHoverClass);
    });
});

$(document).ready(function() {
    $('#' + HeaderNavID).hover(
        function() {
            window.clearTimeout(timer);
        },
        function() {
            SetupHideTimer();
        });
});

$(document).ready(function() {
$('.' + MenuLinkClass).click(
    function() {

    if ($('.' + SubListMenuULClass + ':visible').length == 0 || $('.' + SubListMenuULClass + ':visible').first().equals($(this).next())) {
            ToggleActiveTab($(this));
        }
        else {
           // debugger;
            tabsToMove = $(this).parent().index() - $('.' + SubListMenuULClass + ':visible').parent().index()

            SwitchBetweenTabs();
        }
        return false;
    });
});

function ToggleActiveTab(selectedTarget) {

    if (selectedTarget.parent().find('.' + SubListMenuULClass).is(':visible')) {
        selectedTarget.removeClass(MenuActiveClass);

        $('.MenuWrapperDiv').animate({
            height: HeaderNavHeight
        }, AnimationTime, function() {
            selectedTarget.parent().find('.' + SubListMenuULClass).hide();
        });

        $('.' + MenuHideButtonDivClass).remove();
        
    } else {
    
        selectedTarget.addClass(MenuActiveClass);

        selectedTarget.parent().find('.' + SubListMenuULClass).show();

        var headerHeight = selectedTarget.parent().find('.' + SubListMenuULClass).first().height();

        $('.MenuWrapperDiv').css('height', headerHeight);

        $('.MenuWrapperDiv').animate({
            height: 300
        }, AnimationTime);

        selectedTarget.parent().find('.' + SubListMenuULClass + ':not(:first)').each(function(index, element) {
            $(element).css('height', maxHeight);
        });

        AddHideButton();
        
    }
}

function CreateDivAroundMenu(element) {

    var wrapperDiv = $('<div class="' + MainWrapperDiv + '"></div>');
    wrapperDiv.append(element);
    $('#' + HeaderNavID).append(wrapperDiv);

    return wrapperDiv;
}

function AddHideButton() {
    var hideButtonDiv = $('<div class="' + MenuHideButtonDivClass + '"></div>');
    var hideButton = $('<a href="#" >' + MenuHideButtonText + '</a>');
    hideButton.click(function() {
    ToggleActiveTab($('.' + MenuLIClass + ' > .' + SubListMenuULClass + ':visible'));
    });

    $(hideButtonDiv).append(hideButton);
    $('.' + MainWrapperDiv).append(hideButtonDiv);
}

function SwitchBetweenTabs(selectedTarget) {

    var currentElement = $('.' + SubListMenuULClass + ':visible');

    if (tabsToMove < 0) {
        SetupElementToLeftForAnimation(currentElement);
        SetupCurrentElementForAnimation(currentElement, 'left');
        tabsToMove++;
    } else if (tabsToMove > 0) {
        SetupCurrentElementForAnimation(currentElement, 'right');
        SetupElementToRightForAnimation(currentElement);
        tabsToMove--;
    }
}

function SetupElementToLeftForAnimation(selectedTarget) {

    var nextElementToLeft = selectedTarget.parent().prev().find('.' + SubListMenuULClass);
    nextElementToLeft.first().css("left", -900);
    nextElementToLeft.css("height", maxHeight);
    nextElementToLeft.first().css('height', 'auto');
    
    nextElementToLeft.show();

    var speed = AnimationTime / Math.abs(tabsToMove);

    $(nextElementToLeft).first().animate({
        left: 0
    }, speed, function() { $(selectedTarget).hide(); $(nextElementToLeft).first().css('left', 0); SwitchBetweenTabs(); });
}

function SetupCurrentElementForAnimation(selectedTarget, direction) {

    var nextElementToLeft = selectedTarget.parent().find('.' + SubListMenuULClass);
    nextElementToLeft.css("height", maxHeight);
    nextElementToLeft.first().css('height', 'auto');

    var left;

    if (direction == 'right') {
        left = -900;
    }
    else {
        left = 900;
    }

    var speed = AnimationTime / Math.abs(tabsToMove);

    $(nextElementToLeft).first().animate({
        left: left
    }, speed, function() { $(this).hide(); $(nextElementToLeft).first().css('left', 0); });
}

function SetupElementToRightForAnimation(selectedTarget) {

    var nextElementToRight = $(selectedTarget).parent().next().first().find('.' + SubListMenuULClass); ;
    nextElementToRight.first().css("left", 900);
    nextElementToRight.css("height", maxHeight)
    nextElementToRight.first().css('height', 'auto');

    nextElementToRight.show();

    var speed = AnimationTime / Math.abs(tabsToMove);

    $(nextElementToRight).first().animate({
        left: 0
    }, speed, function() { SwitchBetweenTabs(); });
}

function SetupHideTimer(timeout) {
    if (!hasEvent($(document), OnMouseMove)) {
        $(document).mousemove(OnMouseMove);
    }
}

function OnMouseMove(e) {
    var parentElement = event.target;

    if ($(parentElement).closest('#' + HeaderNavID).length == 0) {
        $(document).unbind('mousemove', OnMouseMove);
       // timer = window.setTimeout(HideActiveTab, TimeoutLength);
    }
}

function HideActiveTab() {

    if ($('.' + SubListMenuULClass + ':visible').length == 0) {
        return;
    }  

    $('.' + SubListMenuULClass + ':visible').first().prev().removeClass(MenuActiveClass);

    var headerHeight = $('.' + SubListMenuULClass + ':visible').parent().find('.' + SubListMenuULClass).first().height();

    $('.MenuWrapperDiv').animate({
        height: headerHeight
    }, AnimationTime, function() {
        //debugger;
        $('.' + SubListMenuULClass + ':visible').hide();
    });

    $('.' + MenuHideButtonDivClass).remove();
    
}

$.fn.equals = function(compareTo) { 
  if (!compareTo || !compareTo.length || this.length != compareTo.length) { 
    return false; 
  } 
  for (var i=0; i<this.length; i++) { 
    if (this[i]!==compareTo[i]) { 
      return false; 
    } 
  } 
  return true;
}

function hasEvent(element, func) {

    if ($(element).data('events') == undefined)
        return false;

    this.functionHandler = func;

    jQuery.each($(element).data('events'), function(i, event) {
        jQuery.each(event, function(i, handler) {
            if (handler.handler == functionHandler)
                return true;
        });
    });
}
