/* ==========================================================================
 Navigation handler
 ========================================================================== */

/**
 * Main navigation
 */
var Navigation = {

    // Initialize click event
    init : function()
    {
        var nav = this;

        // Bind clicks to burger button and overlay
        $('.burger-button, .navigation-overlay-container').bind('click',function()
        {
            nav.toggle();
        });

        $('#close-navigation').bind('click',nav.close)
    },

    // Toggle navigation
    toggle : function()
    {
        var nav = this;

        if( ! $('body.navigation-is-open').length) {
            nav.open();
        }
        else
        {
            nav.close();
        }
    },

    // Open navigation
    open : function()
    {
        $('body').addClass('navigation-is-open');
        // Slide in navigation
        TweenLite.to($('nav.main'), .8, { x:0,y:0,z:0, ease:Power4.easeOut });
        // Drop overlay
        TweenLite.to($('.navigation-overlay-container .drip'), .5, {top:'0', ease:Power4.easeOut});
    },

    // Close navigation
    close : function()
    {
        $('body').removeClass('navigation-is-open');
        // GSAP uses a matrix so we can't use percentage, calculate absolute width
        var newX = parseInt($('nav.main').outerWidth());
        // Slide out navigation
        TweenLite.to($('nav.main'), 1, { x: newX ,y:0,z:0, ease:Power3.easeOut });
        // Drop overlay
        TweenLite.to($('.navigation-overlay-container .drip'), .5, {top:'-100vh', ease:Power4.easeOut});
    }
};