/**
 * Created by Pascal on 18/01/17.
 */
var scrollable = true;

$(function () {

    initHistory();

    //Here is the page content load en set to page
    History.Adapter.bind(window, 'statechange', function () { // Note: We are using statechange instead of popstate
        var State = History.getState(); // Note: We are using History.getState() instead of event.state

        //Save needed stats
        var code_name = State.data.code_name;
        var url = State.data.url;
        var animatedContent = false;
        var directionInvert = false;

        if (typeof code_name === 'undefined') code_name = 'home';
        if (typeof url === 'undefined') url = '/';


        //Close menu and set new active item
        $('.mobile-navigation').removeClass('active');
        $('.mobile-navigation nav li.active').removeClass('active');
        $('.mobile-navigation nav li.' + code_name).addClass('active');

        //remove ajaxOverlay State of old
        $('.ajaxOverlay').removeClass('ajaxOverlay');


        //Prepare Ajax Call
        var preData = {
            code_name: code_name,
            ajax_url: url
        };

        //Add extra state info about page or category to Ajax Call
        if (typeof State.data.page !== 'undefined') preData['page'] = State.data.page;
        if (typeof State.data.category !== 'undefined') preData['category'] = State.data.category;
        if (typeof State.data.article !== 'undefined') preData['article'] = State.data.article;

        if (typeof State.data.direction !== 'undefined' && State.data.direction == 'previous') directionInvert = true;

        //Load page content by Ajax call to AjaxViewController
        $.ajax({
            method: 'POST',
            url: '/loadPageContent',
            data: preData
        }).done(function (data) {
            var response = JSON.parse(data);

            //Update Meta info
            $('head title').html(response.metaTitle);
            $('head meta[name=description]').attr('content', response.metaDescription);

            //Append loaded content to history content (placeholder)
            $('.ajax-container').append(response.content);

            //Move extra script tags to the bottom
            var script = $('.ajax-container script').detach();
            scriptId = script.attr('id');
            if ($('#' + scriptId).length == 0) {
                $('body').append(script);
            }

            //Let all other objects except the new ajax content move out
            $('.ajax-container >*:not(:last-child)').addClass('moveOut');
            if (directionInvert)  $('.ajax-container >*:not(:last-child)').addClass('invert');

            //Update Menu
            $('.mobile-navigation nav li').removeClass('active');
            $('.mobile-navigation nav li a[data-page="' + code_name + '"]').parent().addClass('active');

            //Call the init functions because of DOM update
            initMain();
            initHistory();

            animatedContent = animateNewContent(directionInvert);
            directionInvert = false;
        });

        //Recall animateNewContent if there is a javascript bug on previous next buttons browser
        setTimeout(function () {
            if (!animatedContent) animatedContent = animateNewContent(directionInvert);
        }, 750);


    });
});

function initHistory() {

    //Click function for all links with class 'x', which triggers the State Change function
    $('.history-link').click(function () {
        pushHistoryState($(this));
        return false;
    });

    if (document.addEventListener) {
        document.addEventListener("mousewheel", MouseWheelHandler(), false);
        document.addEventListener("DOMMouseScroll", MouseWheelHandler(), false);
    } else {
        sq.attachEvent("onmousewheel", MouseWheelHandler());
    }

}

//prepare object from element
function pushHistoryState(element) {
    var code_name = element.data('page');
    var href = element.data('url');

    if (code_name == 'home') href = '/';

    var sendObject = {
        code_name: code_name,
        url: href
    };

    //Check if has link has page or category data
    if (element.data('post-page')) sendObject['page'] = element.data('post-page');
    if (element.data('category')) sendObject['category'] = element.data('category');
    if (element.data('article')) sendObject['article'] = element.data('article');
    if (element.data('direction')) sendObject['direction'] = element.data('direction');

    if (Modernizr.history) {
        History.pushState(sendObject, null, sendObject.url);
    }
}

function animateNewContent(invert) {
    scrollable = false;
    //if animation filtering blog items
    $('.ajax-container >*:last-child:not(.post-detail)').addClass('ajaxOverlay');
    $('.ajax-container >*:last-child').addClass('animate');
    if(invert) $('.ajax-container >*:last-child').addClass('invert');

    //Animate to top for mobile
    $('html, body').animate({scrollTop: '0'}, 700);

    //remove other content after 500 seconds
    setTimeout(function () {
        $('.ajax-container >.moveOut').remove();
        $('.ajax-container *.animate').removeClass('animate').removeClass('invert');
    }, 750);

    setTimeout(function () {
        //Recall Facebook comment api
        FB.XFBML.parse();
    }, 1200);

    setTimeout(function () {
        scrollable = true;
    }, 1500);

    return true;
}

function MouseWheelHandler() {
    return function (e) {
        // cross-browser wheel delta
        var e = window.event || e;
        var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));

        //Check if scroll is allowed
        if(scrollable && $(window).width() >= 901  && $(window).height() >= 751) {
            if (delta < 0) {
                // If home block is there animate to blog
                if( $('#home').length ){
                    pushHistoryState($('#homeBlogLink'));
                }

                // If blog overview has next items animate to overview page
                if( $('#nextPage').length ){
                    pushHistoryState($('#nextPage'));
                }

                disableScrollDetection();
            }
            else {
                // If blog overview has previous items page animate to overview page
                if( $('#previousPage').length ){
                    pushHistoryState($('#previousPage'));
                }

                disableScrollDetection();
            }
        }
        return false;
    }
}

function disableScrollDetection() {
    scrollable = false;
    setTimeout(function () {
        scrollable = true;
    }, 1500);
}