/* ==========================================================================
   NavigationHandler handler
   - Primary usage for mobile NavigationHandler
   - Secondary if site used a pop-up/slide-in menu
 ========================================================================== */

const NavigationHandler = {

    navElement : '',
    shaderElement : '',
    headerElement : '',
    scrolled : 0,
    isActive : false,

    // Initialize click event
    init : function()
    {

        // Bind Navigation to Handler
        NavigationHandler.navElement = document.getElementById('navigation');
        NavigationHandler.shaderElement = document.getElementById('navigation-shader');
        NavigationHandler.headerElement = document.getElementsByTagName('header')[0];

        // Bind clicks to menu button
        const mobileMenuButton = document.getElementById('menu-trigger');
        if(isset(mobileMenuButton)){
            mobileMenuButton.addEventListener('click', function(){
                NavigationHandler.toggle();
            });
        }
        if(isset(NavigationHandler.shaderElement)){
            NavigationHandler.shaderElement.addEventListener('click', function(){
                NavigationHandler.toggle();
            });
        }
    },

    // Toggle navigation
    toggle : function()
    {
        if( ! NavigationHandler.navElement.classList.contains('active')) NavigationHandler.open();
        else NavigationHandler.close();
        return false;
    },

    // Open Navigation
    open : function()
    {
        NavigationHandler.scrolled = window.pageYOffset;
        NavigationHandler.navElement.classList.add('active');
        NavigationHandler.shaderElement.classList.add('active');
        NavigationHandler.headerElement.classList.add('active');
        NavigationHandler.isActive = true;

        document.body.classList.add('preventScroll');
    },

    // Close Navigation
    close : function()
    {

        NavigationHandler.navElement.classList.remove('active');
        NavigationHandler.shaderElement.classList.remove('active');
        NavigationHandler.headerElement.classList.remove('active');
        NavigationHandler.isActive = false;

        document.body.classList.remove('preventScroll');
    }
};