/**
 * Created by driesjanssen on 7/4/17.
 */
/*==========================================================================
 Main Navigation
 ========================================================================== */

// Global variables
var fixedNavFlag = false;
$(".fixed-header").hide();

// Show fixed header when top-header disappears out of the viewport
$(window).on('scroll', function(){
    var topHeader = $('.top-header');
    var fixedHeader = $('.fixed-header');

    var topHeaderHeight = topHeader.outerHeight();
    var waveHeight = topHeader.find('.wave').outerHeight();
    var totalHeaderHeight = topHeaderHeight + waveHeight;

    if($(window).width() > 900){
        // Shows fixed navigation when ...
        if($(window).scrollTop() > totalHeaderHeight){
            if( ! fixedNavFlag)
            {
                fixedHeader.fadeIn(500);
                fixedNavFlag = true;
            }
        }

        else
        {
            fixedHeader.fadeOut(400);
            fixedNavFlag = false;
        }
    }

});

// Declare some flags to see if navigation menu is open or closed
var menuOpen = false;

// Declare used variables
var mainNav = $('.top-header').find('.main-navigation');
var mainFixedNav = $('.fixed-header').find('.main-navigation');

var mainNavHeight = mainNav.find($('.navigation')).height();
$(window).on('resize', function(){
    var mainNavHeight = mainNav.find($('.navigation')).height();
});

$('.hamburger-icon').on('click', function(){

    var topHeader = $('.top-header');
    var fixedHeader = $('.fixed-header');

    var headerHeight = topHeader.outerHeight();
    var waveHeight = topHeader.find('.wave').outerHeight();
    var totalHeaderHeight = headerHeight + waveHeight;

    if($(this).data('href') == "top-header-hamburger-icon" || $(this).data('href') == "fixed-header-hamburger-icon")
    {

        // If navigation menu is closed, open it
        if(menuOpen == false)
        {
            openNavs()
        }

        // If navigation menu is open, close it
        else
        {
            closeNavs();
        }
    }

    else
    // If navigation menu is mobile
    {
        console.log('mobile view');
    }

});

// function that shows navigation with slideDown effect
var openNavs = function(){
    TweenLite.fromTo(mainNav, 0.5, {autoAlpha:0, height: '0'}, {height: ''+ (mainNavHeight + 50) +'px', autoAlpha:1, ease:Power1.easeOut});
    menuOpen = true;

    TweenLite.fromTo(mainFixedNav, 0.5, {autoAlpha:0, height: '0'}, {height: ''+ (mainNavHeight + 50) +'px', autoAlpha:1, ease:Power1.easeOut});
    menuOpen = true;
};

// function that closes navigation
var closeNavs = function(){
    TweenLite.to(mainNav, 0.4, {height: '0', autoAlpha:0});
    menuOpen = false;

    TweenLite.to(mainFixedNav, 0.4, {height: '0', autoAlpha:0});
    menuOpen = false;
};