https://www.beama.org.uk/assets/js/beama/specific/carousel/carousel.js

1(function($) {
2
3    $(document).ready(function() {
4
5        $(window).load(function() {
6
7            // Slider 
8            $('.js-make-slider').each(function() {
9
10                var $slider = $(this),
11                    $sliderWrapper = $slider.closest('.slider-wrapper'),
12                    $sliderNav = $sliderWrapper.find('.slider-nav-wrapper'),
13                    $slideNext = $sliderWrapper.find('.js-slide-next'),
14                    $slidePrev = $sliderWrapper.find('.js-slide-prev'),
15                    $slideCurrent = $sliderWrapper.find('.slider-counter-current'),
16                    $slideTotal = $sliderWrapper.find('.slider-counter-total'),
17                    isTestimonialSlider = $slider.hasClass('testimonial-slider');
18
19                $slider.owlCarousel({
20                    margin     : 0,
21                    // loop       : true,
22                    items      : 1,
23                    smartSpeed : 600,
24                    autoHeight : true,
25                    dots       : ( isTestimonialSlider ) ? true : false,
26                    lazyLoad   : true,
27                    onInitialized : function(e) {
28
29                        var $total = e.item.count,
30                            $current = e.item.index + 1,
31                            $totalText = ("0" + $total).slice(-2),
32                            $currentText = ("0" + $current).slice(-2),
33                            isGallery = $slider.hasClass('gallery-slider');
34
35                        $slideTotal.text($totalText);
36                        $slideCurrent.text($currentText);
37
38                        if ( e.item.index === 0 ) {
39                            $slidePrev.addClass('is-disabled');
40                        }
41
42                        if ( e.item.index === e.item.count ) {
43                            $slideNext.addClass('is-disabled');
44                        }
45
46                        if ( isGallery ) {
47
48                            var $currentHeight = $(e.target).find('.owl-item').eq(e.item.index).find('.figure-image').height();
49
50                            $sliderNav.css({
51                                top: $currentHeight - 45
52                            })
53
54                            setTimeout(function() {
55                                $sliderNav.addClass('is-displayed');
56                            }, 600);
57
58                        }
59
60                    },
61                    onChanged : function(e) {
62
63                        var $current = e.item.index + 1,
64                            $currentText = ("0" + $current).slice(-2),
65                            isGallery = $slider.hasClass('gallery-slider');
66
67                        $slideCurrent.text($currentText);
68
69                        if ( e.item.index === 0 ) {
70                            $slidePrev.addClass('is-disabled');
71                        } else {
72                            $slidePrev.removeClass('is-disabled');
73                        }
74
75                        if ( e.item.index + 1 === e.item.count ) {
76                            $slideNext.addClass('is-disabled');
77                        } else {
78                            $slideNext.removeClass('is-disabled');
79                        }
80
81                        if ( isGallery ) {
82
83                            var $currentHeight = $(e.target).find('.owl-item').eq(e.item.index).find('.figure-image').height();
84
85                            $sliderNav.css({
86                                top: $currentHeight - 45
87                            });
88
89                        }
90        
91                    }
92                });
93
94                // Slide next
95                $slideNext.click(function(e) {
96                    e.preventDefault();
97
98                    $slider.trigger('next.owl.carousel');
99                })
100                
101                // Slide prev
102                $slidePrev.click(function(e) {
103                    e.preventDefault();
104
105                    $slider.trigger('prev.owl.carousel');
106                })
107
108            });
109
110
111            // Carousel
112            $('.js-make-carousel').each(function() {
113
114                if ( $(this).is('.carousel-four, .four-cols') ) {
115
116                    $(this).owlCarousel({
117                        loop            : false,
118                        autoHeight      : true,
119                        margin          : 20,
120                        smartSpeed      : 400,
121                        dots            : true,
122                        lazyLoad        : true,
123                        responsiveClass : true,
124                        responsive      : {
125                            0: {
126                                items  : 1,
127                                loop   : false,
128                                margin : 20
129                            },
130                            481: {
131                                items : 2
132                            },
133                            768: {
134                                items  : 2,
135                                margin : 20
136                            },
137                            980: {
138                                items  : 4,
139                                margin : 30
140                            }
141                        }
142                    });
143
144                } else if ( $(this).is('.carousel-two, .two-cols') ) {
145
146                    $(this).owlCarousel({
147                        loop            : false,
148                        autoHeight      : true,
149                        margin          : 20,
150                        smartSpeed      : 400,
151                        dots            : true,
152                        lazyLoad        : true,
153                        responsiveClass : true,
154                        responsive      : {
155                            0: {
156                                items  : 1,
157                                loop   : false,
158                                margin : 20
159                            },
160                            481: {
161                                items : 2
162                            },
163                            768: {
164                                items  : 2,
165                                margin : 20
166                            },
167                            980: {
168                                items  : 2,
169                                margin : 25
170                            }
171                        }
172                    });
173
174                } else {
175
176                    $(this).owlCarousel({
177                        loop            : false,
178                        autoHeight      : true,
179                        margin          : 20,
180                        smartSpeed      : 400,
181                        dots            : true,
182                        lazyLoad        : true,
183                        responsiveClass : true,
184                        responsive      : {
185                            0: {
186                                items  : 1,
187                                loop   : false,
188                                margin : 20
189                            },
190                            481: {
191                                items : 2
192                            },
193                            768: {
194                                items  : 2,
195                                margin : 20
196                            },
197                            980: {
198                                items  : 3,
199                                margin : 25
200                            }
201                        }
202                    });
203
204                }
205
206            });
207
208            // $(window).trigger( "resize" );
209
210        });
211
212    });
213
214})(jQuery);