diff --git a/plugins/carhop-blocks/acf-blocks/gallery/view.js b/plugins/carhop-blocks/acf-blocks/gallery/view.js new file mode 100644 index 0000000..e3343a3 --- /dev/null +++ b/plugins/carhop-blocks/acf-blocks/gallery/view.js @@ -0,0 +1,36 @@ +document.addEventListener("DOMContentLoaded", function () { + const galleries = document.querySelectorAll(".block-gallery"); + if (!galleries) return; + + const currentBlock = document.querySelector(".block-gallery"); + if (!currentBlock) return; + + const swiperFraction = currentBlock.querySelector(".swiper-pagination-fraction"); + const slides = currentBlock.querySelectorAll(".swiper-slide"); + const slideCount = slides.length; + swiperFraction.textContent = `Article n°1 sur ${slideCount}`; + + new Swiper(".gallery-swiper", { + slidesPerView: 2, + spaceBetween: 30, + loop: true, + grabCursor: true, + navigation: { + nextEl: ".swiper-button-next", + prevEl: ".swiper-button-prev", + }, + pagination: { + el: ".swiper-pagination", + clickable: true, + renderBullet: function (index, className) { + return ``; + }, + }, + on: { + slideChange: (swiper) => { + const slidesCount = swiper?.slides?.length; + swiperFraction.textContent = `Photo n°${swiper.realIndex + 1} sur ${slidesCount}`; + }, + }, + }); +});