https://www.troisfoisvin.com/wp-content/themes/troisfoisvin/templa…/temoignage/temoignage.js?ver=20221208.003

1(function($){
2
3    /**
4     * initializeBlock
5     *
6     * Adds custom JavaScript to the block HTML.
7     *
8     * @date    15/4/19
9     * @since   1.0.0
10     *
11     * @param   object $block The block jQuery element.
12     * @param   object attributes The block attributes (only available when editing).
13     * @return  void
14     */
15    var initializeBlock = function( $block ) {
16         if($block.find('.temoignages__nav').length > 0){
17           $block.find('.temoignages__texte').slick({
18            	slidesToShow: 1,
19            	slidesToScroll: 1,
20            	arrows: true,
21            	fade: true,
22            	asNavFor: '.temoignages__nav',
23            });
24
25           $block.find('.temoignages__nav').slick({
26             slidesToShow: 5,
27            	slidesToScroll: 1,
28            	asNavFor: '.temoignages__texte',
29            	dots: false,
30            	focusOnSelect: true,
31              arrows: true,
32              prevArrow:'<div class="arrow arrow_prev"><svg xmlns="http://www.w3.org/2000/svg" width="12.994" height="28.183" viewBox="0 0 12.994 28.183"><path id="Tracé_7383" data-name="Tracé 7383" d="M5756.653,1629.479l-10.93-13.461,10.93-13.461" transform="translate(-5744.436 -1601.926)" fill="none" stroke="#d09680" stroke-miterlimit="10" stroke-width="2"/></svg></div>',
33              nextArrow:'<div class="arrow arrow_next"><svg xmlns="http://www.w3.org/2000/svg" width="12.994" height="28.183" viewBox="0 0 12.994 28.183"><path id="Tracé_7383" data-name="Tracé 7383" d="M5745.724,1629.479l10.93-13.461-10.93-13.461" transform="translate(-5744.947 -1601.926)" fill="none" stroke="#d09680" stroke-miterlimit="10" stroke-width="2"/></svg></div>',
34              responsive: [
35                {
36                  breakpoint: 600,
37                  settings: {
38                    slidesToShow: 1,
39                    slidesToScroll: 1
40
41                  }
42                }
43
44              ]
45            });
46          // Remove active class from all thumbnail slides
47          $block.find('.temoignages__nav .slick-slide').removeClass('slick-active');
48
49          // Set active class to first thumbnail slides
50          $block.find('.temoignages__nav .slick-slide').eq(0).addClass('slick-active');
51
52          // On before slide change match active thumbnail to current slide
53          $block.find('.temoignages__texte').on('afterChange', function (event, slick, currentSlide, nextSlide) {
54           var mySlideNumber = currentSlide;
55           console.log(currentSlide);
56           $block.find('.temoignages__nav .slick-slide').removeClass('slick-active');
57           /*$block.find('.temoignages__nav .slick-slide').eq(mySlideNumber).addClass('slick-active');*/
58          });
59
60          $block.find('.temoignages__texte').on('beforeChange', function (event, slick, currentSlide, nextSlide) {
61            var mySlideNumber = nextSlide;
62            console.log(nextSlide);
63            $block.find('.temoignages__nav .slick-slide').removeClass('slick-active');
64          });
65
66        }else{
67          $block.find('.temoignages__texte').slick({
68            slidesToShow: 1,
69            slidesToScroll: 1,
70            arrows: true,
71            fade: true,
72          autoplay:true,           });
73        }
74
75    }
76
77    // Initialize each block on page load (front end).
78    $(document).ready(function(){
79        $('.temoignages').each(function(){
80            initializeBlock( $(this) );
81        });
82    });
83
84    // Initialize dynamic block preview (editor).
85    if( window.acf ) {
86        window.acf.addAction( 'render_block_preview/type=temoignage', initializeBlock );
87    }
88
89})(jQuery);