/**
 * Created by Pascal on 30/09/15.
 */
$(function () {
    resizer();
    setPhotoSlider();

    $(window).resize(function () {
        resizer();
    });

    $(window).scroll(function () {
        stickyScrollContent();
        checkActiveMenu();
        if(!isElementPartInViewport($('.home-header .position'))){
            $('.page-content>header h2').addClass('show');
        }
        else{
            $('.page-content>header h2').removeClass('show');
        }
    });

    jQuery.each(jQuery('textarea[data-autoresize]'), function () {  //autosize TextArea
        var offset = this.offsetHeight - this.clientHeight;

        var resizeTextarea = function (el) {
            jQuery(el).css('height', 'auto').css('height', el.scrollHeight + offset);
        };
        jQuery(this).on('keyup input', function () {
            resizeTextarea(this);
        }).removeAttr('data-autoresize');
    });

    $('.internalLink').click(function () {
        animateScroll($(this));
        return false;
    });

    $('.room-content .next, .selection ul li').click(function () {
        roomSwitcher($(this).data('clickKey'));
        setPhotoSlider();
    });

    $('.location-row .list .list-item').click(function () {
        var toRight = true;

        indexActive = $('.location-row .list .active').index();
        newActive = $(this).index();

        if (indexActive > newActive) {
            toRight = false
        }

        if (indexActive != newActive) {
            locationSwitcher($(this).data('clickKey'), toRight);
            checkActiveMenu();
        }
    });

    $('.location-buttons .next-icon-location, .location-buttons .prev-icon-location').click(function () {
        var toRight = true;
        if ($(this).hasClass('prev-icon-location')) {
            toRight = false;
        }
        locationSwitcher($(this).data('clickKey'), toRight);
        checkActiveMenu();
    });

    $('.location .read-more').click(function () {
        locationSwitcher($(this).data('clickKey'), true);
        checkActiveMenu();
    });

    $('.rooms .controllers >div').click(function () {

        var activeSlider = $('.image-slider.active .image');
        var amount = activeSlider.size();

        var current = 0;
        activeSlider.each(function (index) {
            if ($(this).hasClass('active')) {
                current = index;
            }
        });

        if ($(this).hasClass('next')) {
            current++;
            if (current == amount) {
                current = 0;
            }
        }
        if ($(this).hasClass('prev')) {
            if (current == 0) {
                current = amount - 1;
            }
            else {
                current--;
            }
        }
        $('.image-slider.active .image.active').removeClass('active');
        activeSlider.eq(current).addClass('active');
        setPhotoSlider();
    });

    $('.rooms-row .room-photos').swipe({
        swipeLeft:function(event, direction, distance, duration, fingerCount){
            var activeSlider = $('.image-slider.active .image');
            var amount = activeSlider.size();

            var current = 0;
            activeSlider.each(function (index) {
                if ($(this).hasClass('active')) {
                    current = index;
                }
            });
            if (current == 0) {
                current = amount - 1;
            }
            else {
                current--;
            }
            $('.image-slider.active .image.active').removeClass('active');
            activeSlider.eq(current).addClass('active');
            setPhotoSlider();

        },
        swipeRight:function(event, direction, distance, duration, fingerCount){
            var activeSlider = $('.image-slider.active .image');
            var amount = activeSlider.size();
            var current = 0;
            activeSlider.each(function (index) {
                if ($(this).hasClass('active')) {
                    current = index;
                }
            });
            current++;
            if (current == amount) {
                current = 0;
            }
            $('.image-slider.active .image.active').removeClass('active');
            activeSlider.eq(current).addClass('active');
            setPhotoSlider();
        },
        threshold:40
    });

});

function checkActiveMenu() {
    var menu = ['home', 'ruimtes', 'locationSend', 'renovatie', 'contact'];

    $.each(menu, function(key, item){
        if(isElementPartExtraInViewport($('#'+item), 300)){
            if(item == 'locationSend'){
                if($('#locationSend .list .active').hasClass('cursus')){
                    $('nav a.active').removeClass('active');
                    $('nav a.cursus').addClass('active');
                }
                if($('#locationSend .list .active').hasClass('meeting')){
                    $('nav a.active').removeClass('active');
                    $('nav a.vergadering').addClass('active');
                }
                if($('#locationSend .list .active').hasClass('partylocation')){
                    $('nav a.active').removeClass('active');
                    $('nav a.feest').addClass('active');
                }
                if($('#locationSend .list .active').hasClass('weekDay')){
                    $('nav a.active').removeClass('active');
                    $('nav a.bezinningsweek').addClass('active');
                } 
            }
            else {
                $('nav a.active').removeClass('active');
                $('nav a.' + item).addClass('active');
            }
        }
    });
}

function resizer() {
    $('.page-content .home-header').height(($('.page-content .home-header').width() / 16 * 6));
    $('.home-header .position').height($('.home-header .position').width());

    //Ruimte blokken
    var roomHeight = 0;
    $('.room-content .room-text').each(function () {
        if ($(this).height() > roomHeight) {
            roomHeight = $(this).height();
        }
    });

    $('.information-row .backgrounds .wood').height($('.information-row').height());


    if ($(window).width() >= 1100) {
        if ($(".rooms-row .rooms").height() > roomHeight) {
            roomHeight = $(".rooms-row .rooms").height();
        }
        $('.room-photos').height(roomHeight);
    }
    else {
        $('.room-photos').height($('.room-photos').width() / 4 * 2);
    }

    $('.room-content').height(roomHeight);
    $('.information-row ').css('padding-bottom', ((roomHeight / 2) + 'px'));
    $('.rooms-row ').css('margin-top', ('-' + (roomHeight / 2) + 'px'));
    $('.forrest-rooms ').css('top', ('-' + (roomHeight / 2) + 'px'));
    $('.location-row ').css('margin-top', ('-' + (roomHeight / 2) + 'px'));
    $('.forrest-rooms').css('height', (((roomHeight / 2) + 320) + 'px'));

    //Location blokken
    var locationHeight = 0;
    $('.locations .location').each(function () {
        if ($(this).height() > locationHeight) {
            locationHeight = $(this).height();
        }
    });
    $('.locations').height(locationHeight);

    //resize video frame
    $('.video-frame iframe').width(( $('.video-frame').width() - 10));
    $('.video-frame iframe').height(( ($('.video-frame').width() - 10) / 16 * 9)); 

}

function isElementFullInViewport(el) {
    //special bonus for those using jQuery
    if (el.length > 0) {
        if (typeof jQuery === "function" && el instanceof jQuery) {
            el = el[0];
        }

        var rect = el.getBoundingClientRect();

        return (
            rect.top >= 0 &&
            rect.bottom <= (window.innerHeight || $(window).height())
        );
    }
}

function isElementPartInViewport(el) {
    if (el.length > 0) {
        //special bonus for those using jQuery
        if (typeof jQuery !== 'undefined' && el instanceof jQuery) el = el[0];

        var rect = el.getBoundingClientRect();
        // DOMRect { x: 8, y: 8, width: 100, height: 100, top: 8, right: 108, bottom: 108, left: 8 }
        var windowHeight = (window.innerHeight || document.documentElement.clientHeight);
        var windowWidth = (window.innerWidth || document.documentElement.clientWidth);

        var vertInView = (rect.top <= windowHeight) && ((rect.top + rect.height) >= 0);
        var horInView = (rect.left <= windowWidth) && ((rect.left + rect.width) >= 0);

        return (vertInView && horInView);
    }
}

function isElementPartExtraInViewport(el, margin) {
    if (el.length > 0) {
        //special bonus for those using jQuery
        if (typeof jQuery !== 'undefined' && el instanceof jQuery) el = el[0];

        var rect = el.getBoundingClientRect();
        // DOMRect { x: 8, y: 8, width: 100, height: 100, top: 8, right: 108, bottom: 108, left: 8 }
        var windowHeight = (window.innerHeight || document.documentElement.clientHeight);
        var windowWidth = (window.innerWidth || document.documentElement.clientWidth);

        var vertInView = (rect.top <= (windowHeight - margin)) && ((rect.top + rect.height) >= 0);
        var horInView = (rect.left <= windowWidth) && ((rect.left + rect.width) >= 0);

        return (vertInView && horInView);
    }
}

function tabletOrMobile() {
    if (window.navigator.userAgent.match(/Mobile/i)
        || window.navigator.userAgent.match(/iPhone/i)
        || window.navigator.userAgent.match(/iPod/i)
        || window.navigator.userAgent.match(/IEMobile/i)
        || window.navigator.userAgent.match(/Windows Phone/i)
        || window.navigator.userAgent.match(/Android/i)
        || window.navigator.userAgent.match(/BlackBerry/i)
        || window.navigator.userAgent.match(/webOS/i)) {
        return true;
        //alert('True - Mobile - ' + navigator.userAgent);
    } else {
        //alert('False - Mobile - ' + navigator.userAgent);
        //return false;
    }
    if (window.navigator.userAgent.match(/Tablet/i)
        || window.navigator.userAgent.match(/iPad/i)
        || window.navigator.userAgent.match(/Nexus 7/i)
        || window.navigator.userAgent.match(/Nexus 10/i)
        || window.navigator.userAgent.match(/KFAPWI/i)) {
        return true;
        //alert('True - Tablet - ' + navigator.userAgent);
    }
    if ($('body').width() <= 500) {
        return true;
    }
    else {
        //alert('False - Tablet - ' + navigator.userAgent);
        //return false;
    }
}

function animateScroll(e, offset, time) {
    offset = typeof offset !== 'undefined' ? offset : 100;
    time = typeof time !== 'undefined' ? time : 800;

    var scrollTo = e.prop('href');
    scrollTo = scrollTo.substr(scrollTo.indexOf('#') + 1);

    switch (scrollTo) {
        case 'weekDay':
        case 'partylocation':
        case 'cursus':
        case 'meeting':

            locationSwitcher(scrollTo, true, true);
            scrollTo = 'location';
            break;

        default:
            break;
    }


    $('html,body').animate({
        scrollTop: $('#' + scrollTo).offset().top - offset
    }, time);
}

function roomSwitcher(next) {
    var imageTo = '';

    switch (next) {
        case 'main_building':
            next = 'large_room';
            break;
        case 'side_room':
        case 'side_kitchen':
        case 'side_toilet':
            imageTo = next;
            next = 'side_building';
            break;
        case 'side_building':
            imageTo = 'side_room';
            break;
        default:
            break;
    }


    $('.selection ul li').removeClass('active');
    if (imageTo == '') {
        $('.selection ul li.' + next).addClass('active');
    }
    else {
        $('.selection ul li.' + imageTo).addClass('active');
    }

    $('.room-content .active').removeClass('active');
    $('.room-content .room-text.' + next).addClass('active');
    $('.room-content .next.' + next).addClass('active');

    $('.room-photos .image-slider').removeClass('active');
    $('.room-photos .image-slider .image').removeClass('active');
    $('.room-photos .' + next + '-images').addClass('active');
    if (imageTo == '' || imageTo == 'side_toilet') {
        $('.room-photos .' + next + '-images .image:first-child').addClass('active');
    }
    else {
        $('.room-photos .' + next + '-images .image.' + imageTo + '-images').addClass('active');
    }
    //console.log($(this).data('clickKey'));
}

function locationSwitcher(clicked, toRight, prevent) {

    prevent = typeof prevent !== 'undefined' ? prevent : false;

    switch (clicked) {
        case 'feest':
            clicked = 'partylocation';
            break;

        case 'vergadering':
            clicked = 'meeting';
            break;

        case 'bezinningsweek':
            clicked = 'weekDay';
            break;

        default:
            break;
    }


    $('.locations .location').removeClass('active');
    $('.locations .location').removeClass('activeRight');
    $('.locations .location').removeClass('activeLeft');

    if (toRight) {
        $('.locations .' + clicked + '-location').addClass('activeRight');
    }
    else {
        $('.locations .' + clicked + '-location').addClass('activeLeft');
    }

    $('.location-buttons .active').removeClass('active');
    $('.location-buttons .' + clicked).addClass('active');

    $('.location-row .list .active').removeClass('active');
    $('.location-row .list .' + clicked).addClass('active');


    /*$('.locations .active').css({
     transform: "translate3d(0, 0, 0)"
     });*/

    if (!prevent) {
        $('html,body').animate({
            scrollTop: $('.locations').offset().top - 180
        }, 800);
    }

}

var myPhotoSlider;

var activeSlider;
var maxSlider;

var currentActiveElement;

function setPhotoSlider() {
    clearInterval(myPhotoSlider);
    activeSlider = $('.image-slider.active');
    currentActiveElement = activeSlider.find('.image.active');
    maxSlider = (activeSlider.find('div').length -1);

    //console.log(activeSlider);

    myPhotoSlider = setInterval(updatePhotoSlider, 3000); 

}

function updatePhotoSlider() {
    var tempC = $('.image-slider.active div').index(currentActiveElement);
    activeSlider.find('.image.active').removeClass('active');
    tempC++;
    if(tempC > maxSlider){
        tempC = 0;
    }
    currentActiveElement = activeSlider.find('.image').eq(tempC);
    activeSlider.find('.image').eq(tempC).addClass('active');
}


function stickyScrollContent() {
    var element = $('.location-row .list.nonStick');
    var stickyElement = $('.location-row .stick-content');
    var before = $('.renovation-block');

    if (element.length) {


        var offsetDetails = element.offset().top - $(window).scrollTop();
        var offsetBeforeDetails = before.offset().top - $(window).scrollTop();

        if ($(window).width() >= 800) {
            if (offsetDetails <= 60 && offsetBeforeDetails >= (60 + element.height())) {
                stickyElement.addClass('sticky');
            }
            else {
                stickyElement.removeClass('sticky');
            }
        }
        else {
            if (offsetDetails <= 0 && offsetBeforeDetails >= (element.height())) {
                stickyElement.addClass('sticky');
            }
            else {
                stickyElement.removeClass('sticky');
            }
        }
    }
}