slideshow : prev() step-by-step avec auto-chaînage inverse
All checks were successful
Deploy / Deploy to Production (push) Successful in 10s
All checks were successful
Deploy / Deploy to Production (push) Successful in 10s
Chaque appel à prev() retire un slide à la fois dans l'ordre inverse.
currentGroup stocke { slide, auto } pour savoir si le slide révélé
était une étape automatique — si oui, prev() s'enchaîne avec un délai
aléatoire (250-500ms) jusqu'à la base manuelle du groupe.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
02cdd82d87
commit
07db943d58
1 changed files with 36 additions and 16 deletions
|
|
@ -36,7 +36,7 @@ export class CreditsSlideshow {
|
|||
this.nextImageIndex = 1;
|
||||
this.insertsShownInGroup = 0;
|
||||
this.portraitPairDone = false;
|
||||
this.currentGroup = [slides.images[0]];
|
||||
this.currentGroup = [{ slide: slides.images[0], auto: false }];
|
||||
this.groupHistory = [];
|
||||
this.zIndex = 0;
|
||||
slides.images[0].node.style.zIndex = 0;
|
||||
|
|
@ -88,19 +88,19 @@ export class CreditsSlideshow {
|
|||
this.currentSlide = slide;
|
||||
if (slide.type === "image") {
|
||||
if (auto) {
|
||||
this.currentGroup.push(slide);
|
||||
this.currentGroup.push({ slide, auto });
|
||||
} else {
|
||||
this.groupHistory.push(this.currentGroup);
|
||||
this.currentGroup = [slide];
|
||||
this.currentGroup = [{ slide, auto }];
|
||||
}
|
||||
this.nextImageIndex = this.slides.images.indexOf(slide) + 1;
|
||||
this.insertsShownInGroup = 0;
|
||||
this.portraitPairDone = auto;
|
||||
} else if (slide.type === "insert") {
|
||||
this.currentGroup.push(slide);
|
||||
this.currentGroup.push({ slide, auto });
|
||||
this.insertsShownInGroup++;
|
||||
} else {
|
||||
this.currentGroup.push(slide);
|
||||
this.currentGroup.push({ slide, auto });
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -135,25 +135,45 @@ export class CreditsSlideshow {
|
|||
}
|
||||
|
||||
prev() {
|
||||
if (this.currentGroup.length > 1) {
|
||||
const leaving = this.currentGroup.pop();
|
||||
leaving.slide.node.classList.replace("active", "next");
|
||||
|
||||
const arriving = this.currentGroup[this.currentGroup.length - 1];
|
||||
arriving.slide.node.style.zIndex = ++this.zIndex;
|
||||
arriving.slide.node.classList.replace("previous", "active");
|
||||
this.currentSlide = arriving.slide;
|
||||
|
||||
if (leaving.slide.type === "insert") {
|
||||
this.insertsShownInGroup--;
|
||||
} else if (leaving.slide.type === "image") {
|
||||
this.nextImageIndex = this.slides.images.indexOf(arriving.slide) + 1;
|
||||
this.portraitPairDone = false;
|
||||
}
|
||||
|
||||
if (arriving.auto) {
|
||||
setTimeout(() => this.prev(), 250 + Math.random() * 250);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.groupHistory.length) return;
|
||||
|
||||
this.currentGroup.forEach((slide) => {
|
||||
slide.node.classList.remove("active", "previous");
|
||||
slide.node.classList.add("next");
|
||||
});
|
||||
const leaving = this.currentGroup[0];
|
||||
leaving.slide.node.classList.replace("active", "next");
|
||||
|
||||
const prevGroup = this.groupHistory.pop();
|
||||
if (!prevGroup.length) return;
|
||||
|
||||
this.currentGroup = prevGroup;
|
||||
const lastSlide = prevGroup[prevGroup.length - 1];
|
||||
lastSlide.node.style.zIndex = ++this.zIndex;
|
||||
lastSlide.node.classList.replace("previous", "active");
|
||||
this.currentSlide = lastSlide;
|
||||
const arriving = prevGroup[prevGroup.length - 1];
|
||||
arriving.slide.node.style.zIndex = ++this.zIndex;
|
||||
arriving.slide.node.classList.replace("previous", "active");
|
||||
this.currentSlide = arriving.slide;
|
||||
|
||||
const prevImages = prevGroup.filter((s) => s.type === "image");
|
||||
this.nextImageIndex = this.slides.images.indexOf(prevImages[prevImages.length - 1]) + 1;
|
||||
this.insertsShownInGroup = prevGroup.filter((s) => s.type === "insert").length;
|
||||
const prevImages = prevGroup.filter((s) => s.slide.type === "image");
|
||||
this.nextImageIndex = this.slides.images.indexOf(prevImages[prevImages.length - 1].slide) + 1;
|
||||
this.insertsShownInGroup = prevGroup.filter((s) => s.slide.type === "insert").length;
|
||||
this.portraitPairDone = prevImages.length > 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue