function initiateSwiper() {
	const currentBlock = document.querySelector(
		".wp-block-carhop-blocks-highlight-timeline"
	);
	if (!currentBlock) return;

	// const swiperFraction = currentBlock.querySelector(
	// 	".swiper-pagination-fraction"
	// );
	const slides = currentBlock.querySelectorAll(".swiper-slide");
	const slideCount = slides.length;
	const years = Array.from(slides).map((slide) => {
		const yearEl = slide.querySelector(".highlight-timeline-step__year");
		if (yearEl && yearEl.textContent) {
			return yearEl.textContent.trim();
		}
		const id = slide.id || "";
		const match = id.match(/^year-(.+)$/);
		return match ? match[1] : "";
	});

	highlightTimelineSwiper = new Swiper(".highlight-timeline-swiper", {
		slidesPerView: 1,
		spaceBetween: 30,
		loop: true,
		grabCursor: true,
		keyboard: {
			enabled: true,
			onlyInViewport: true,
		},
		navigation: {
			nextEl: ".swiper-button-next",
			prevEl: ".swiper-button-prev",
		},
		mousewheel: {
			enabled: true,
			forceToAxis: true, // Force le scroll dans l'axe du slider
			sensitivity: 1, // Sensibilité du scroll (1 = normal)
			releaseOnEdges: false, // Continue le scroll même aux bords
		},
		pagination: {
			el: ".swiper-pagination",
			clickable: true,
			renderBullet: function (index, className) {
				return `<button class="${className}">${years[index] ?? ""}</button>`;
			},
		},
	});
}

window.addEventListener("DOMContentLoaded", (event) => {
	initiateSwiper();

	// swiperCheckBreakpoints();
	// window.addEventListener("resize", swiperCheckBreakpoints);
});