studio-variable/hic-et-nunc
5
0
Fork 0
Code Issues 3 Pull requests Projects Releases Packages Wiki Activity Actions

Index > JS > Add a script for slide number
All checks were successful
Deploy / Deploy to Production (push) Successful in 6s
Details

Browse source
This commit is contained in:
Camilledenoray 2026-07-08 18:14:26 +02:00
parent d3375637b6
commit 869527a721
1 changed files with 27 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

27
assets/js/project-slideshow.js
View file

@ -18,6 +18,33 @@ document.addEventListener("DOMContentLoaded", () => {
const firstSlideLastProject = firstSlide(lastProject);
const lastSlideLastProject = lastSlide(lastProject);
// Affiche le numéro de la slide courante dans .slide-number > .current-image
// (le total est déjà géré en PHP via $slides->count()).
const updateSlideNumber = (project) => {
const slides = project.querySelectorAll(".project-slideshow > .slide");
const activeSlide = project.querySelector(
".project-slideshow > .slide.active",
);
const currentImage = project.querySelector(".slide-number .current-image");
if (!currentImage || !activeSlide) return;
currentImage.textContent = [...slides].indexOf(activeSlide) + 1;
};
// On observe la classe .active de chaque slide : ainsi le numéro se met à
// jour quelle que soit la source du changement (navigation image/projet
// ici, ou ouverture d'un projet dans project-toggle.js).
projects.forEach((project) => {
updateSlideNumber(project); // état initial
project
.querySelectorAll(".project-slideshow > .slide")
.forEach((slide) =>
new MutationObserver(() => updateSlideNumber(project)).observe(slide, {
attributes: true,
attributeFilter: ["class"],
}),
);
});
function goToNextPicture() {
const selectedProject = document.querySelector(".project.selected");
const activeSlide = selectedProject.querySelector(