https://www.pactomundial.org/wp-content/themes/pacto_mundial/assets/js/onu-landing.js?v=1790848997

1// function sliderCounter() {
2//   $( ".content-slider-tabs .slick-slider" ).each(function( index ) {  
3//     $(this).on('beforeChange', function(event, slick, currentSlide, nextSlide){
4//       var count = nextSlide + 1;
5//       $(this).find('.slick-prev').find('.current').text(count + ' / ');
6//     });
7//     // Total
8//     var numItems = $(this).find('.slick-slide').length;
9//     var numItemsc = numItems; 
10
11//   //  console.log(numItemsc);
12//     $(this).find('.slick-prev').find('.total').text(numItemsc);
13//   });
14// }
15
16function sliderCounter() {
17  $(".content-slider-tabs .slick-slider").each(function(index) {
18    var totalSlides = $(this).slick("getSlick").slideCount; // Obtener el número total de slides
19    
20    $(this).on('beforeChange', function(event, slick, currentSlide, nextSlide) {
21      var count = nextSlide + 1;
22      $(this).find('.slick-prev').find('.current').text(count + ' / ');
23    });
24
25    // Actualizar el valor total
26    $(this).find('.slick-prev').find('.total').text(totalSlides);
27  });
28}
29
30setTimeout(function() { 
31    $('.slider-tabs').slick('setPosition');
32    sliderCounter();
33}, 100);
34
35//video banner landing
36$(".onu-landing .miniatura").click(function(){
37    console.log("video")
38    let src = $(this).siblings('iframe').attr('src');
39    $(this).siblings('iframe').attr('src',src+'?autoplay=1');
40    $(this).fadeOut();
41  })
42  
43  // On before slide change
44  $('.slider-tabs').on('afterChange', function(event, slick, currentSlide, nextSlide){
45    // Cuando cambiamos cambiamos el selector
46    if ($(window).width() <= 767) {
47   
48     
49        var data = $( ".item.slick-slide.slick-active" ).find('h2').text();
50
51        $('.first-item').remove();
52
53        $('ul.slider-dots').prepend('<div class="first-item"><span class="data-superior">'+ data +' </span></div>');
54   
55      
56    
57    }
58  });
59
60
61  // Home
62  $('.slider-tabs').slick({
63    infinite: true,
64    slidesToShow: 1,
65    slidesToScroll: 1,
66    adaptiveHeight: false,
67    dots : true,
68    arrows : true,
69    // arrow pager
70    prevArrow:"<button type='button' class='slick-prev pull-left'><div class='cont-number'><span class='current tmp'>1 / </span>  <span class='total tmp'></span></div></button>",
71    nextArrow:"<button type='button' class='slick-next pull-right'></button>",  
72    // name tabs dots
73    customPaging: function (slider, i) {
74      console.log(i);
75      var title = $(slider.$slides[i]).data('title');
76      return '<span class="dots-item"><span class="dots-number">' + '</span>' + title + ' </span>';
77    },  
78    dotsClass: 'slider-dots',
79 
80    
81    responsive: [
82        {
83          breakpoint: 1025,
84          settings: {
85            infinite: true,
86            slidesToShow: 1,
87            adaptiveHeight: true,
88            draggable: false,
89           // touchMove: true,
90            
91          }
92        }
93      ]
94  });
95
96$(document).ready(function(){
97
98  if ($(window).width() <= 767) {
99
100    // lo primero que haremos es cargar el item  1
101   $('ul.slider-dots').prepend('<div class="first-item"><span class="data-superior">Fórmate </span></div>');
102  
103    
104
105    $(document).on("click","ul.slider-dots .first-item",function() {
106     
107      var is_open = $(this).parent('.slider-dots').hasClass("open");
108      if (is_open) {
109        $('.slider-dots').removeClass("open");
110      } else {
111        $('.slider-dots').addClass("open");
112      }
113      $(this).remove();
114    });
115
116    $(document).on("click",".dots-item",function() {         
117      $('.slider-dots').removeClass("open");
118    });
119        
120        
121      
122    }
123
124    if ($(window).width() >= 7671) {
125  
126        $(".slider-tabs .slider-dotss").click(function() {            
127          var is_open = $(this).hasClass("open");
128          if (is_open) {
129              $(this).removeClass("open");
130          } else {
131              $(this).addClass("open");
132          }
133        });
134
135      
136
137      
138            
139            var $activeItem = $(".slider-tabs .slider-dots li:first-child span");
140            $activeItem.addClass("selected");
141            
142            // Agregar la clase "first-item" al primer <li> padre
143          //  $(".slider-tabs .slider-dots li:first-child").addClass("first-item");
144            
145            $(".slider-tabs .slider-dots li").click(function() {
146            
147              var $clickedItem = $(this).find("span");
148            
149              // Verificar si el elemento clicado es el primer hijo de la lista
150              if ($(this).is(":first-child")) {
151               // $(this).addClass("first-item");
152              } else {
153                //$(this).removeClass("first-item");
154              }
155            
156              if ($clickedItem[0] !== $activeItem[0]) {
157                var clickedValue = $clickedItem.html();
158                var clickedSlide = $clickedItem.data("slide");
159            
160                var activeValue = $activeItem.html();
161                var activeSlide = $activeItem.data("slide");
162            
163                $clickedItem.html(activeValue);
164                $clickedItem.data("slide", activeSlide);
165                $activeItem.html(clickedValue);

166                $activeItem.data("slide", clickedSlide);
167            
168                $(".slider-tabs .slider-dots li span").removeClass("selected");
169                $clickedItem.addClass("selected");
170            
171                $activeItem = $clickedItem;
172              }
173            });
174    }
175});
176
177//Height equals
178jQuery(document).ready(function ($) {
179    function equalHeight(group) {
180        var tallest = 0;
181        group.each(function () {
182            var thisHeight = $(this).height();
183            if (thisHeight > tallest) {
184                tallest = thisHeight;
185            }
186        });
187        group.height(tallest);
188    }
189
190    equalHeight($(".slider-tabs .item h3"));
191
192    // También puedes llamar a la función en otro evento o en otra parte del código si es necesario.
193    // Por ejemplo, en respuesta a un evento de cambio de tamaño de la ventana.
194    // $(window).resize(function () {
195    //     equalHeight($(".slider-tabs .item h3"));
196    // });
197});
198
199  
200  // counter roll
201  const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
202  const nextFrame = () => new Promise(resolve => requestAnimationFrame(resolve));
203  const animate = (elem, prop, value, duration) => {
204      return nextFrame().then(() => new Promise(resolve => {
205          elem.style.transition = `${prop} ${duration}ms`;
206          elem.style[prop] = `${value}px`;
207          const done = () => {
208              elem.style.transition = `${prop} 0ms`;
209              resolve();
210          }
211          elem.addEventListener("transitionend", done, {once: true});
212      })).then(nextFrame);
213  };
214  
215  // DOM element wrapper for the counter functionality
216  class Counter {
217      constructor(element, length = 4, upwards = true) {
218          this.element = element;
219          this._value = 0;
220          this.upwards = !!upwards;
221          this.digits = Array.from({length}, () => element.appendChild(document.createElement("li")));
222      }
223      get value() {
224          return this._value;
225      }
226      set value(value) {
227          this._value = value;
228          const numStr = value.toString().padStart(4, "0").slice(-this.digits.length);
229          // Display the current number in the counter element (no animation)
230          this.digits.forEach( (digit, i) => {
231              // Put three lines, each having a digit, where the middle one is the current one:
232              digit.innerHTML = `${(+numStr[i]+(this.upwards ? 9 : 1))%10}<br>${numStr[i]}<br>${(+numStr[i]+(this.upwards ? 1 : 9))%10}`;
233              digit.style.top = `${-this.element.clientHeight}px`; // scroll the middle digit into view
234          });
235      }
236      async roll(direction = 1, duration = 500) {
237          await nextFrame();
238          const numChangingDigits = Math.min(this.digits.length, 
239              this.value.toString().length - this.value.toString().search(direction > 0 ? /9*$/ : /0*$/) + 1);
240          const numStr = this.value.toString().padStart(4, "0").slice(-numChangingDigits);
241          const promises = this.digits.slice(-numChangingDigits).map((digit, i) =>
242              animate(digit, "top", (direction > 0) === this.upwards ? -this.element.clientHeight*2 : 0, duration)
243          );
244          await Promise.all(promises);
245          this.value = this.value + direction;
246          await nextFrame();
247      }
248      async rollTo(target, duration = 500, pause = 300) {
249          const direction = Math.sign(target - this.value);
250          while (this.value !== target) {
251              await this.roll(direction, duration);
252              await delay(pause);
253          }
254      }
255  }
256
257var counterList = document.getElementById('counter-list');
258
259if (counterList !== null) {
260    var numero = parseInt(counterList.getAttribute('data-numero'));
261
262    if (!isNaN(numero)) {
263        const counter = new Counter(counterList, 5, true);
264        counter.value = numero - 30;
265        counter.rollTo(numero, 50, 50);
266    } 
267} 
268
269
270//animación slider
271$(document).ready(function() {
272	var sliders = $(".biblioteca .slider-biblio");
273  
274	function isInViewport(element) {
275	  var bounds = element[0].getBoundingClientRect();
276	  return bounds.top < window.innerHeight && bounds.bottom > 0;
277	}
278  
279	function showSlider() {
280	  sliders.filter(":not(.visible)").each(function() {
281		if (isInViewport($(this))) {
282		  $(this).addClass('visible');
283		}
284	  });
285	}
286  
287	$(window).on('scroll', showSlider);
288	showSlider();
289});