var $el, leftPos, newWidth, currentLI, currentH5, currentNavItem, triggerSlide, navDisabled;
$mainNav = $(".mainnav");
	
var $magicLine = null;

$(function () {
    //debug
    //var currentNavItem = "mainnavclients";
    if ($.browser.msie && Number($.browser.version) <= 7) {
        navDisabled = true;
        $(".mainnavunderliner").hide();
    }


    if (!navDisabled) {
        $magicLine = $(".mainnavunderliner");
        triggerNavUpdate();

        $(".mainnav > li").hover(function () {
            // Magicline Hover effect
            $el = $(this).find('h5 a');
            leftPos = $el.position().left + 25;
            newWidth = $el.parent().width() - 50;
            if (!Number($magicLine.css('opacity'))) {
                //move it to the correct position straight away
                $magicLine.css({
                    'left': leftPos,
                    'width': newWidth,
                    'opacity': '1'
                });
            }
            else {
                $magicLine.stop().animate({
                    left: leftPos,
                    width: newWidth
                });
            }
            //$magicLine.css('opacity', 1);

            if (currentH5) {
                // Un-Bold Default Nav
                currentH5.stop().animate({
                    opacity: .50
                });
            }

            if (currentLI) {
                currentLI.children('ul').not(function () {
                    return $(this).parent().hasClass('currentmn');
                }).stop().animate({
                    opacity: 0
                });
            }

            // Bold the Main Nav Item
            $el.stop().animate({
                opacity: 1
            });

            // Animate In the Sub Nav

            if (!currentLI || !$(this).hasClass('currentmn')) {
                animateUL($(this).children('ul'));
            }

        }, function () {
            // Un-Bold the Nav
            $el.not(function () {
                if (currentH5 && currentH5.get(0) === this)
                    return true;
                else
                    return false;
            }).stop().animate({
                opacity: .50
            });

            // Animate Out the Sub Nav
            var $sub = $(this).children('ul').not(function () {
                if (currentLI && $(this).parent().hasClass('currentmn') && $(this).parent().get(0) === currentLI.get(0))
                    return true;
                else
                    return false;
            }).animate({
                opacity: '0'
            });

            if (currentH5) {
                // Return MagicLine to Default
                $magicLine.stop(true, true).animate({
                    left: $magicLine.data("origLeft"),
                    width: $magicLine.data("origWidth")
                });

                // Re-Bold Default Nav
                currentH5.stop(true, true).animate({
                    opacity: 1
                });

                // Re-Show Default Sub Nav
                animateUL(currentLI.not('.currentmn').children('ul'));
            } else {
                $magicLine.stop(true, true).animate({
                    opacity: 0
                });
            }
        }
	);
    }
});

function triggerNavUpdate() {

    if (!navDisabled) {
        $('.mainnav li ul[style*="opacity"]').css('opacity', '').css('display', '');
        $('.mainnav li a[style*="opacity"]').css('opacity', .50);

        if (currentNavItem === null || currentNavItem === undefined || currentNavItem == "") {
            $magicLine.css({ opacity: 0, left: 0 });
            currentLI = null;
            currentH5 = null;
        } else {
            currentLI = $("." + currentNavItem);
            currentH5 = currentLI.find("h5 a");

            currentLI.addClass('currentmn');

            // Put magicLine in default position
            $magicLine.stop(true)
			.css('opacity', 1)
			.width(currentH5.width() + 6)
			.css("left", currentH5.position().left + 25)
			.data("origLeft", $magicLine.position().left)
			.data("origWidth", $magicLine.width());

            // Bold Default Nav
            currentH5.stop(true).css({
                opacity: 1
            });

            // Show the Default Sub Nav
            currentLI.children('ul').stop(true).css({
                opacity: 1,
                display: 'block'
            });
        }
    }
}

function setNavigationItem(value) {
    $('.mainnav li ul[style*="opacity"]').css('opacity', '').css('display', '');
    $('.mainnav li h5 a[style*="opacity"]').css('opacity', .50);

    if(currentLI)
        currentLI.children('ul').css('opacity', 0);

    if (!navDisabled) {
        if (value !== null && value !== undefined && value != "") {
            currentLI = $("." + value.split(" ")[0]);
            currentH5 = currentLI.find("h5 a");

            currentLI.addClass('currentmn');

            // Put magicLine in default position
            $magicLine
			.css('opacity', 1)
			.width(currentH5.width() + 6)
			.css("left", currentH5.position().left + 25)
			.data("origLeft", $magicLine.position().left)
			.data("origWidth", $magicLine.width());

            // Bold Default Nav
            currentH5.css({
                opacity: 1
            });

            // Show the Default Sub Nav
            currentLI.children('ul').css({
                opacity: 1,
                display: 'block'
            });
        }
        else {
            $('.mainnav h5 a').animate({ opacity: '.50' });
            $('.mainnav li ul').animate({ opacity: '0' });
            $magicLine.animate({ opacity: '0' });
        }
    }
}

function animateUL(ul) {
    if (!navDisabled) {
        if (ul.length > 0) {
            $('.mainnav > li').removeClass('currentmn');
            ul.parent().addClass('currentmn');


            ul.css('opacity', 0);
            if (!ul.data("origLeft")) {
                ul.data("origLeft", Number(ul.css('padding-left').replace("px", "")));
            }
            ul.css('padding-left', ul.data("origLeft") + 30);
            ul.stop().animate({
                opacity: 1,
                'padding-left': ul.data("origLeft")
            }
         );
        }
    }
    
}