if (!window.hasOwnProperty('ribbon_swipers')) {
    window.ribbon_swipers = [];
}

$(document).ready(function(){

    $.each($(".promo-ribbon-swiper-container"), function (i, n) {

        //console.log("promo-ribbon-swiper-container")

        var $swiper = $(n);
        var id = $swiper.attr("id");
        var elements = parseInt($swiper.data('elements'));
        var slidesPerView = parseInt($swiper.data('slides'));

        var new_swiper = new Swiper ($swiper, {
            // Optional parameters
            direction: 'horizontal',
            slidesPerView: elements > slidesPerView ? slidesPerView : elements,
            spaceBetween: 0,
            slidesPerGroup: 1,
            loop: elements > slidesPerView,
            /*loopFillGroupWithBlank: true,*/
            autoplay: {
                delay: elements > slidesPerView ? 5500 : 300000
            },
            //waitForTransition: false,
            speed: 1200,
            observer: true,
            observeParents: true,

            // Responsive breakpoints
            breakpoints: {
                // when window width is <= 320px
                320: {
                    slidesPerView: 1,
                    spaceBetween: 0,
                    slidesPerGroup: 1,
                    loop: elements > 1,
                    autoplay: {
                        delay: 5500
                    },
                    speed: 1200,
                },
                // when window width is <= 480px
                480: {
                    slidesPerView: 1,
                    spaceBetween: 0,
                    slidesPerGroup: 1,
                    loop: elements > 1,
                    autoplay: {
                        delay: 5500
                    },
                    speed: 1200
                },
                // when window width is <= 640px
                640: {
                    slidesPerView: elements > 2 ? 2 : elements,
                    spaceBetween: 0,
                    slidesPerGroup: 1,
                    loop: elements > 2,
                    autoplay: {
                        delay: 5500
                    },
                    speed: 1200
                },
                // when window width is <= 640px
                1000: {
                    slidesPerView: elements > 3 ? 3 : elements,
                    spaceBetween: 0,
                    slidesPerGroup: 1,
                    loop: elements > 3,
                    autoplay: {
                        delay: 5500
                    },
                    speed: 1200
                }
            },


            /*effect: 'coverflow',
             grabCursor: true,
             centeredSlides: true,

             coverflowEffect: {
             rotate: 50,
             stretch: 0,
             depth: 100,
             modifier: 1,
             slideShadows : true,
             },*/


            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },

            // Navigation arrows
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },

            // And if we need scrollbar
            /*scrollbar: {
             el: '.swiper-scrollbar',
             },*/

            on: {
                init: function () {
                    this.$el.removeClass('hidden');
                    this.update();
                    //this.autoplay.start();
                },
                resize: function() {
                    this.update();
                }
            }

        });
        window.ribbon_swipers.push( new_swiper );

        $('#' + id).hover(function(){
            new_swiper.autoplay.stop();
        }, function(){
            new_swiper.autoplay.start();
        });




    });

});