(function ($) {
    if($('.pane--overview .filters').length) {
        var url = window.location.href.split("?cat=");
        if(url.length <= 1) {
            $('.filter').addClass('active');
        } else {
            $('.filter--'+url[1]).addClass('active');
            $('.filter--'+url[1]).attr("href",url[0]);
        }
    }

    $("select#category").change(function () {
        var getSubcat = $("select#category :selected").text();
        subcatHasChanged = getSubcat;
        console.log(getSubcat);
            
        if($("select#category :selected").val() == 0) {    
            console.log($("select#category :selected").val());
            $(".col-lg-3").each(function () {
                $(this).show();
            });
        } else {
            $(".col-lg-3").each(function () {
                var getDataSubcat = $(this).data("subcat");
                console.log(getDataSubcat);
                if (getDataSubcat === getSubcat) {
                    $(this).show();
                } else {
                    $(this).hide();
                }
            });
        }
    });

    // Lazyload lozad.js
    $("img").each(function () {
        // voegt class 'lozad' toe aan alle img's voor Lazyload behalve img's in een carousel
        $(this).not('.carousel img').not('.no-lozad').addClass('lozad');
        $(this).not('.carousel img').not('.no-lozad').attr("data-src", $(this).attr("src"));
        $(this).not('.carousel img').not('.no-lozad').removeAttr("src");
    });
    // lazy loads elements with default selector as '.lozad'
    const observer = lozad();
    observer.observe();

   
        $('.read-more').click(function() {
            // alert('You clicked the link.');
            return false;
        });

    // Toggle menu en de classes voor mobiele verschillen
    $('.main-header__hamburger').on('click', function () {
        $(this).toggleClass('is-mobile');
        $('.main-header__nav').toggleClass('is-mobile');
        $('.main-header__top').toggleClass('is-mobile');
    });
    $('.nav--language').on('click', function () {
        $('.nav--language .sub-menu').toggleClass('is-open');
    });

    // Carousel initiatie
    $('.carousel--highlight').flickity({
        // options
        cellAlign: 'left',
        contain: true,
        pageDots: false,
        imagesLoaded: true,
        prevNextButtons: false,
        wrapAround: true
    });

    $('.carousel--categories').flickity({
        // options
        cellAlign: 'left',
        contain: true,
        pageDots: false,
        imagesLoaded: true,
        prevNextButtons: false,
        wrapAround: true,
        autoPlay: 4000,
    });

    $('.carousel--posts').flickity({
        // options
        cellAlign: 'left',
        contain: true,
        pageDots: false,
        imagesLoaded: true,
        prevNextButtons: false,
        wrapAround: true,
        watchCSS: true
    });

    $('.carousel--default').flickity({
        // options
        cellAlign: 'left',
        contain: false,
        pageDots: true,
        imagesLoaded: true,
        prevNextButtons: true,
        wrapAround: true,
        imagesLoaded: true,
    });

    jQuery('.carousel').each(function () {
        var carousel = jQuery(this),
            carouselOptions = {
                imagesLoaded: true,
                cellSelector: '.carousel__slide',
                prevNextButtons: false,
                cellAlign: 'left',
                pageDots: false,
                adaptiveHeight: false,
                setGallerySize: false
            };
        // Instantiate
        var flickity = new Flickity(this, carouselOptions);
        
        $('.btn--next', this.parentNode).on('click', function () {
            flickity.next();
        });
        $('.btn--prev', this.parentNode).on('click', function () {
            flickity.previous();
        });
    });

    
    
    $('.iframe-start').on('click', function() {
        iframe = $('iframe').attr('src');
        if($(this).not().hasClass('active')) {
            $(this).addClass('active');
            $('iframe').attr('src', iframe+'?autohide=1&autoplay=1&color&controls=0');
        } else {
            $('iframe').attr('src', iframe-'?autohide=1&autoplay=1&color&controls=0');
        }
    });

    if($('.content').outerHeight() > 600) {
        $('.content').addClass('closed');
    } else {
        $('.read-more').css('display', 'none');
    }
    $('.read-more').on('click', function() {
        if($('.content').hasClass('closed')) {
            $('.content').removeClass('closed');
        } else {
            $('.content').addClass('closed');      
        }
    });  
    
    if ($(window).width() <= 800){	
        $('.hero .searchform input[type="text"]').attr("placeholder", "Zoeken...");
        $('.pane--overview .searchform input[type="text"]').attr("placeholder", "Zoeken...");
    } else {
        var url = window.location.href;
        
        if (url.indexOf("evenementen") >= 0) {
            $('.hero .searchform input[type="text"]').attr("placeholder", "Vind hier jouw evenementen");
            $('.pane--overview .searchform input[type="text"]').attr("placeholder", "Vind hier jouw evenementen");
        } else {
            $('.hero .searchform input[type="text"]').attr("placeholder", "Vind hier jouw locals");
            $('.pane--overview .searchform input[type="text"]').attr("placeholder", "Vind hier jouw locals");
        }
    }
    $(window).resize(function(){
        if ($(window).width() <= 800){	
            $('.hero .searchform input[type="text"]').attr("placeholder", "Zoeken...");
            $('.pane--overview .searchform input[type="text"]').attr("placeholder", "Zoeken...");
        } else {
            var url = window.location.href;
            
            if (url.indexOf("evenementen") >= 0) {
                $('.hero .searchform input[type="text"]').attr("placeholder", "Vind hier jouw evenementen");
                $('.pane--overview .searchform input[type="text"]').attr("placeholder", "Vind hier jouw evenementen");
            } else {
                $('.hero .searchform input[type="text"]').attr("placeholder", "Vind hier jouw locals");
                $('.pane--overview .searchform input[type="text"]').attr("placeholder", "Vind hier jouw locals");
            }
        }
    });
    
    [].forEach.call(document.getElementsByClassName("iframe-lightbox-link"), function (el) {
        el.lightbox = new IframeLightbox(el);
    });
})(jQuery);

// Video script
window.addEventListener('DOMContentLoaded', videoPlayer);

function videoPlayer(){
    const videoContainers = document.querySelectorAll('.video__container');
    
    videoContainers.forEach(videoContainer => {
        const playButton = videoContainer.querySelector('[data-video-button]');
        const videoIframe = videoContainer.querySelector('[data-video-iframe]');
        const videoWrapper = videoContainer.querySelector('.video__wrapper');

        if(!playButton){
            return;
        }
    
        playButton.addEventListener('click', function(){
            // Set data-src to src
            videoIframe.src = videoIframe.getAttribute('data-src');
            this.classList.add('hide');
            videoWrapper.classList.add('active');
        });
    });
}