/*
On document load
================
*/
    $(document).ready( function()
    {
        $(window).on( "resize", function()
        {
            // Close menu if we resize to desktop
                if ( bIsMenuOpen && $(window).width() >= 800 )
                {
                    fCloseMobileMenu();
                }
        });

        /*
        INITATE NAVIGATION DROPDOWNS
        ============================
        Make it so when we hover the navigation elements / click them
        the navigation menu displays
        */

            // On mouse over dropdown container
            $(".dropdown-root-container").mouseover( function()
            {
                // If we are on desktop
                    if( $(window).width() >= 992 )
                    {
                        // Open the menu
                            fOnDropdownHover(  $(this) );
                    }
            });

        // On mouse leave dropdown container
            $(".dropdown-root-container").mouseleave( function()
            {
                // If we are on desktop
                    if( $(window).width() >= 992 )
                    {
                        // Close the menu
                            fOnDropdownNoLongerHover( $(this) );
                    }
            });

        // On mouse click
            $(".dropdown-root-container").click( function()
            {
                // If the menu is open
                    if( $(this).children().last().is(":visible") )
                    {
                        // Then close the menu
                            fOnDropdownNoLongerHover( $(this) );
                    }
                // If the menu is closed
                    else
                    {
                        // Then open the menu
                            fOnDropdownHover(  $(this) );
                    }
            });
            
        });

        
/*
Mobile Menu
===========
*/
    var bIsMenuOpen = false;

    function fOpenMobileMenu()
    {
        bIsMenuOpen = true;

        // Add the css class to activate the side menu
            $(".nav-menu").addClass("active-mobile-menu");
    }

    function fCloseMobileMenu()
    {
        bIsMenuOpen = false;

        // Add the css class to remove the side menu
            $(".nav-menu").removeClass("active-mobile-menu");
    }


/*
fOnDropdownHover()
==================
Opens the releavnt dropdown menu for the navigation
*/

    function fOnDropdownHover( oElement)
    {
        // Store the dropdown menu
            var oDropdownMenu = oElement.children().last();

        // If the dropdown menu isn't active
            if( !oDropdownMenu.hasClass("menu-is-active") )
            {
                // Add the menu is active class
                    oDropdownMenu.addClass("menu-is-active");

                // Store the first child (first col-)
                    var oMenuFirstChild = oDropdownMenu.children().first().children().first();

                // Stop any animations playing (cancels close animation if required)
                    oDropdownMenu.stop();

                // Remove the menu is active closing class incase we have canceld the closing
                    oDropdownMenu.removeClass("menu-is-closing");

                // Set the opaciy to 0
                    oDropdownMenu.css( { opacity : 0 } );

                // Show the dropdown menu
                    oDropdownMenu.show();

                // If the dropdown menu's outer width is too small (The navigation looks squished) and its positined to the right of the screen
                    if( oDropdownMenu.outerWidth() <= 400 && oDropdownMenu.offset().left >= ($(window).width() / 2) )
                    {
                        // If the first child has the class of col-md-6, then it's a half menu
                            if( oMenuFirstChild.hasClass("col-md-6") )
                            {
                                // Store the last child (Second col-6)
                                    var oMenuLastChild = oDropdownMenu.children().first().children().last();

                                // Remove the col-md-6 class
                                    oMenuFirstChild.removeClass("col-md-6");

                                // Add the col-md-12 class
                                    oMenuFirstChild.addClass("col-md-12");

                                // Add a class to track if the menu used to have col-md-6
                                    oMenuFirstChild.addClass("had-col-md-6");

                                // Remove the col-md-6 class
                                    oMenuLastChild.removeClass("col-md-6");

                                // Add the col-md-12 class
                                    oMenuLastChild.addClass("col-md-12");

                                // Add a class to track if the menu used to have col-md-6
                                    oMenuLastChild.addClass("had-col-md-6");
                            }
                    }

                // Set the opaciy to 1
                    oDropdownMenu.animate( { opacity : 1 } , 500 );
            }
    }

/*
fOnDropdownNoLongerHover()
==========================
closes the releavnt dropdown menu for the navigation
*/

    function fOnDropdownNoLongerHover( oElement )
    {
        // Store the dropdown menu
            var oDropdownMenu = oElement.children().last();

            // If the dropdown menu is active
                if( oDropdownMenu.hasClass("menu-is-active") )
                {
                    // Remove the dropdown menu class
                        oDropdownMenu.removeClass("menu-is-active");

                    // Add the removing class
                        oDropdownMenu.addClass("menu-is-closing");

                    // Set the opaciy to 0
                        oDropdownMenu.stop().animate( { opacity : 0 } , 300, function()
                        {
                            // If we are still wanting to close the menu
                                if( oDropdownMenu.hasClass("menu-is-closing") )
                                {
                                    // Hide the dropdown menu
                                        oDropdownMenu.hide();

                                    // Remove the dropdown closing class
                                        oDropdownMenu.removeClass("menu-is-closing");
                                }
                        });
                }
    }