https://carcassonne.org/themes/custom/boot5/js/slider_x.js?tlk8m2

1jQuery(document).ready(function ($) {
2  // Cache les boutons de déplacement s'ils ne sont pas nécessaires
3  var btn_suiv = jQuery('.wrapper-slider-x .slider-suiv');
4  btn_suiv.each(function() {
5    var slider = $(this).closest('.wrapper-slider-x').find('.slider-x');
6    var btn_prec = $(this).closest('.wrapper-slider-x').find('.slider-prec');
7    // alert(btn_prec.length);
8    var elt_temoin = slider.find('.view-content > :last-child');
9
10    var bouton_suivant_utile = isElementHorizontallyOffscreen(elt_temoin);
11    if (! bouton_suivant_utile) {
12      // alert('désactivation');
13      btn_prec.addClass('d-none'); // utilise $(this) pour cibler l'élément actuel de la boucle
14      $(this).addClass('d-none');
15    }
16  });
17  $(".wrapper-slider-x .slider-prec").bind({
18    click: function() {
19      var cible = (jQuery)(this);
20      var btn_prec = cible.parents('.wrapper-slider-x').find('.slider-prec');
21      var btn_suiv = cible.parents('.wrapper-slider-x').find('.slider-suiv');
22      var slider = cible.parents('.wrapper-slider-x').find('.slider-x');
23      var pos_premier = parseInt(slider.find('.view-content > :first-child').offset().left);
24      if (pos_premier < 0) {
25        var page_courante = parseInt(slider.attr("data-page"));
26        var page_cible = page_courante - 1;
27        slider.removeClass('page' + page_courante);
28        slider.addClass('page' + page_cible);
29        btn_prec.removeClass('disabled');
30        btn_suiv.removeClass('disabled');
31        // Il faut laisser le temps au slider de se déplacer avant d'évaluer la position de celui-ci
32        setTimeout(function(){
33          // Si le premier enfant a une coordonnée supérieur à 0 alors il est visible et on ne peut pas se déplacer plus à gauche
34          if (slider.find('.view-content > :first-child').offset().left > 0) {
35            btn_prec.addClass('disabled');
36          };
37          // Mise à jour des éventuels 'dots' cf publication de la page d'accueil dans le cas où
38          // le changement provient d'un slide sur un smartphone
39          var cible_dot = cible.parents('.wrapper-slider-x').find('.wrapper-dot-control > [data-page="'+page_cible+'"]').click();
40        }, 1000);
41        slider.attr("data-page", page_cible);
42      }
43    },
44  });
45  $( ".wrapper-slider-x .slider-suiv" ).bind({
46    click: function() {
47      var cible = (jQuery)(this);
48      var btn_prec = cible.parents('.wrapper-slider-x').find('.slider-prec');
49      var btn_suiv = cible.parents('.wrapper-slider-x').find('.slider-suiv');
50      var slider = cible.parents('.wrapper-slider-x').find('.slider-x');
51      var largeur_parent = parseInt(slider.width());
52      var pos_dernier = parseInt(slider.find('.view-content > :last-child').offset().left) + parseInt(slider.find('.view-content > :last-child').width());
53      if (! btn_suiv.hasClass('disabled')) {
54        var page_courante = parseInt(slider.attr("data-page"));
55        var page_cible = page_courante + 1;
56        slider.removeClass('page' + page_courante);
57        slider.addClass('page' + page_cible);
58        slider.attr("data-page", page_cible);
59        btn_prec.removeClass('disabled');
60        btn_suiv.removeClass('disabled');
61        // Pour éviter des problème de détection de fin de scroll avec suivant, on peut indiquer dans le bouton
62        // suivant le nombre maxi de page
63        var max_page;
64        if(typeof(btn_suiv.attr("data-max-page"))  === "undefined") {
65          max_page = 9999;
66        } else {
67          max_page = parseInt(btn_suiv.attr("data-max-page"));
68        }
69        if (page_cible + 1 === max_page) {
70          btn_suiv.addClass('disabled');
71        };
72        // Il faut laisser le temps au slider de se déplacer avant d'évaluer la position de celui-ci
73        setTimeout(function(){
74          // Si le dernier enfant a une coordonnée droite (coordonnées gauche + largeur) qui est inférieur à la largeur du conteneur visible, alors on ne peut pas se déplacer plus à droite
75          var pos_dernier = parseInt(slider.find('.view-content > :last-child').offset().left) + parseInt(slider.find('.view-content > :last-child').width());
76          if (pos_dernier <= largeur_parent + 200) {
77            btn_suiv.addClass('disabled');
78          };
79          // Mise à jour des éventuels 'dots' cf publication de la page d'accueil dans le cas où
80          // le changement provient d'un slide sur un smartphone
81          var cible_dot = cible.parents('.wrapper-slider-x').find('.wrapper-dot-control >

81 [data-page="'+page_cible+'"]').click();
82        }, 500);
83      }
84    },
85  });
86  $(".wrapper-dot-control > *").bind({
87    click: function() {
88      var cible = (jQuery)(this);
89      var dots = cible.parents('.wrapper-dot-control').find('> *');
90      var slider = cible.parents('.wrapper-slider-x').find('.slider-x');
91      var page_cible = parseInt(cible.attr("data-page"));
92      var page_courante = parseInt(slider.attr("data-page"));
93
94      dots.removeClass('icon-danger');
95      dots.removeClass('icon-grey');
96      dots.addClass('icon-grey');
97      cible.removeClass('icon-grey');
98      cible.addClass('icon-danger');
99      slider.removeClass('page' + page_courante);
100      slider.addClass('page' + page_cible);
101      slider.attr("data-page", page_cible);
102    },
103  });
104
105  let touchstartX = 0;
106  let touchendX = 0;
107  let touchstartY = 0;
108  let touchendY = 0;
109
110  $(".wrapper-slider-x").on("touchstart", function(e) {
111    // e.preventDefault();
112    // changedTouches contains all of the touchstart events
113    // that occurred at the same time
114    var changedTouches = e.originalEvent.changedTouches;
115    // for (var i = 0; i < changedTouches.length; i++) {
116    var touch = changedTouches[changedTouches.length - 1];
117    touchstartX= touch.pageX;
118    touchstartY= touch.pageY;
119    // }
120  });
121
122
123  // touchend events occur when you lift your finger
124  $(".wrapper-slider-x").on("touchend", function(e) {
125    // e.preventDefault();
126    var cible = (jQuery)(this);
127
128    var changedTouches = e.originalEvent.changedTouches;
129    // for (var i = 0; i < changedTouches.length; i++) {
130    var touch = changedTouches[changedTouches.length - 1];
131    touchendX= touch.pageX;
132    touchendY= touch.pageY;
133    // }
134    handleGesture(e);
135  });
136
137  function handleGesture(e) {
138    if (Math.abs(touchendX - touchstartX) > Math.abs(touchendY - touchstartY)) {
139      if (touchendX <= touchstartX - 50) {
140        $(e.target).parents('.wrapper-slider-x').find('.slider-suiv').click();
141      }
142      if (touchendX >= touchstartX + 50) {
143        $(e.target).parents('.wrapper-slider-x').find('.slider-prec').click();
144      }
145    }
146  }
147});
148
149/**
150 * Retourne vrai si l'élément jquery s'affiche en dehors de la fenêtre (en totalité ou partie)
151 * @param $el
152 * @returns {boolean}
153 */
154function isElementHorizontallyOffscreen($el) {
155  if (typeof $el[0] === 'undefined') {
156    return false;
157  } else {
158    const el = $el[0];
159    const elementLeft = el.offsetLeft;
160    const elementRight = elementLeft + el.offsetWidth;
161    const windowWidth = window.innerWidth;
162    const windowLeft = window.scrollX || document.documentElement.scrollLeft;
163    const windowRight = windowLeft + windowWidth;
164    return (elementRight > windowRight);
165  }
166}