﻿//Set custom configurations
var menuConfig = {
    sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)
    interval: 100, // number = milliseconds for onMouseOver polling interval
    over: megaHoverOver, // function = onMouseOver callback (REQUIRED)
    timeout: 500, // number = milliseconds delay before onMouseOut
    out: megaHoverOut // function = onMouseOut callback (REQUIRED)
};


//On Hover Over
function megaHoverOver() {
    $(this).find(".sub").stop().fadeTo('fast', .9).show(); //Find sub and fade it in
    (function ($) {
        //Function to calculate total width of all ul's
        jQuery.fn.calcSubWidth = function () {
            rowWidth = 0;
            //Calculate row
            $(this).find("ul").each(function () { //for each ul...
                rowWidth += $(this).width(); //Add each ul's width together
            });
        };
    })(jQuery);

    if ($(this).find(".row").length > 0) { //If row exists...

        var biggestRow = 0;

        $(this).find(".row").each(function () {	//for each row...
            $(this).calcSubWidth(); //Call function to calculate width of all ul's
            //Find biggest row
            if (rowWidth > biggestRow) {
                biggestRow = rowWidth;
            }
        });

        $(this).find(".sub").css({ 'width': biggestRow }); //Set width
        $(this).find(".row:last").css({ 'margin': '0' });  //Kill last row's margin

    } else { //If row does not exist...

        $(this).calcSubWidth();  //Call function to calculate width of all ul's

        if ($(this).parent().is('.menu-base') && !$(this).is('.seperator')) {

            //console.log.log($(this).outerWidth());

            var _mainWidth = $(this).parents('.menu-base').width();
            var _winWidth = $(window).width();
            var _leftPosition = 0;
            var _leftPosition = 0;
            var _mainPadding = parseInt((_winWidth - _mainWidth) / 2);
            var _menuPadding = parseInt($(this).find('.sub').css('padding-left'), 10) + parseInt($(this).find('.sub').css('padding-right'), 10) + parseInt($(this).find('.sub').css('margin-left'), 10) + parseInt($(this).find('.sub').css('margin-right'), 10);

            //http://stackoverflow.com/questions/590602/padding-or-margin-value-in-pixels-as-integer-using-jquery
            //parseInt(jQuery('#something').css('margin-left'), 10)

            $('ul#topnav > li:lt(' + $(this).index() + ')').each(function () {
                //_leftPosition += $(this).width();
                _leftPosition += $(this).outerWidth();
            });

            var _mainSpace = _mainWidth - _leftPosition;

            if ((rowWidth + _menuPadding) > _mainWidth) {
                _mainSpace = parseInt(((rowWidth +_menuPadding) - _mainWidth) / 2) * -1;
                $(this).find('.sub').css({ 'left': _mainSpace });
            }
            else if (rowWidth > _mainSpace) {
                $(this).find('.sub').css({ 'left': (_mainSpace - (rowWidth + _menuPadding)) });
            }

            


            //console.log.log('Main Width: ' + _mainWidth + '\r\nLeft: ' + _leftPosition + '\r\nWidth: ' + rowWidth + '\r\nPadding: ' + _mainPadding + '\r\nAvaliable: ' + _mainSpace);
        }
        

        $(this).find(".sub").css({ 'width': rowWidth }); //Set Width
        

    }
}

//On Hover Out
function megaHoverOut() {
    $(this).find(".sub").stop().fadeTo('fast', 0, function () { //Fade to 0 opactiy
        $(this).hide();  //after fading, hide it
    });
}

$(document).ready(function () {
    //$("ul#topnav li .sub").css({ 'opacity': '0' }); //Fade sub nav to 0 opacity on default
    $("ul#topnav li").hoverIntent(menuConfig); //Trigger Hover intent with custom configurations
});
