﻿// init top slider
$("[data-top-slider]").owlCarousel({
    rewind: true,
    margin: 20,
    nav: true,
    dots: false,
    lazyLoad: true,
    autoplay: true,
    autoplayTimeout: 8000,
    autoplayHoverPause: true,
    navText: ['<i class="flaticon-back" data-arrow data-arrow-prev aria-hidden="true"></i>','<i class="flaticon-next" data-arrow data-arrow-next aria-hidden="true"></i>'],
    responsive:{
        0:{
            items: 2
        },
        480:{
            items: 3
        },
        768:{
            items: 4
        },
        991:{
            items: 5
        },
        1199:{
            items: 6
        }
    },
    onInitialized: showHideTopOwlArrows
}).on('changed.owl.carousel', showHideTopOwlArrows());

function showHideTopOwlArrows(){
    var viewport = $(window).width(),
        items = $("[data-top-slider]").find(".owl-item").length;

    if ((viewport >= 1199 && items > 6) //desktop
        || ((viewport >= 991 && viewport < 1199) && items > 5) //desktopsmall
        || ((viewport >= 768 && viewport < 991) && items > 4) //desktopsmall
        || ((viewport >= 480 && viewport < 768) && items > 3) //tablet
        || (viewport < 480 && items > 2) //mobile
    ) {
        $("[data-top-slider]").find(".owl-nav").show();
    } else {
        $("[data-top-slider]").closest(".owl-carousel").find(".owl-nav").hide();
    }
}

// init action slider
$("[data-action-slider]").owlCarousel({
    items: 1,
    rewind: true,
    margin: 20,
    nav: false,
    // dots: false,
    lazyLoad: true,
    autoplay: true,
    autoplayTimeout: 8000,
    autoplayHoverPause: true,
    // navText: ['<i class="flaticon-back" data-arrow data-arrow-prev aria-hidden="true"></i>','<i class="flaticon-next" data-arrow data-arrow-next aria-hidden="true"></i>'],
});

// init sale slider
$("[data-sale-slider]").owlCarousel({
    //items: 2,
    responsive: {
        0: {
            items: 2
        },
        480: {
            items: 3
        },
        768: {
            items: 3
        },
        991: {
            items: 4
        },
        1199: {
            items: 4
        }
    },
    rewind: true,
    margin: 20,
    nav: true,
    dots: false,
    lazyLoad: true,
    // autoplay: true,
    // autoplayTimeout: 8000,
    // autoplayHoverPause: true,
    navText: ['<i class="flaticon-back" data-arrow data-arrow-prev aria-hidden="true"></i>','<i class="flaticon-next" data-arrow data-arrow-next aria-hidden="true"></i>'],
});

// init new slider
$("[data-new-slider]").owlCarousel({
    rewind: true,
    margin: 20,
    nav: true,
    // dots: false,
    lazyLoad: true,
    autoplay: true,
    autoplayTimeout: 8000,
    autoplayHoverPause: true,
    navText: ['<i class="flaticon-back" data-arrow data-arrow-prev aria-hidden="true"></i>','<i class="flaticon-next" data-arrow data-arrow-next aria-hidden="true"></i>'],
    responsive:{
        0:{
            items: 2
        },
        480:{
            items: 3
        },
        768:{
            items: 3
        },
        991:{
            items: 4
        },
        1199:{
            items: 4
        }
    },
    onInitialized: showHideNewOwlArrows
}).on('changed.owl.carousel', showHideNewOwlArrows());

function showHideNewOwlArrows(){
    var viewport = $(window).width(),
        items = $("[data-new-slider]").find(".owl-item").length;

    if ((viewport >= 1199 && items > 4) //desktop
        || ((viewport >= 991 && viewport < 1199) && items > 4) //desktopsmall
        || ((viewport >= 768 && viewport < 991) && items > 3) //desktopsmall
        || ((viewport >= 480 && viewport < 768) && items > 3) //tablet
        || (viewport < 480 && items > 2) //mobile
    ) {
        $("[i]").find(".owl-nav").show();
    } else {
        $("[data-new-slider]").closest(".owl-carousel").find(".owl-nav").hide();
    }
}

function initVideoModal() {
    // corect open modal with video
    var $openBtn = $('[data-video-model-btn]'),
        $modal = $('#video_modal'),
        $video = $("#video"),
        src;

    $openBtn.on('click', function() {
        if (!src) {
            src = $(this).attr("data-src");
        }
    });

    $modal.on('show.bs.modal', function (e) {
        if(!$video.attr("src")) {
            $video.attr('src', src);
        }
    });
    // END
}

initVideoModal();
