stylescape/ts/media/SliderManager.ts

Stylescape is a visual identity framework developed by Scape Agency.

// Manages an image slider or carousel functionality, handling next and previous actions.

// export default class SliderManager {
//     private slides: NodeListOf<HTMLElement>
//     private currentIndex: number = 0

//     constructor(sliderSelector: string) {
//         this.slides = document.querySelectorAll(`${sliderSelector} .slide`)
//         this.showSlide(this.currentIndex)
//     }

//     private showSlide(index: number): void {
//         this.slides.forEach((slide, i) => {
//             slide.style.display = i === index ? 'block' : 'none'
//         })
//     }

//     nextSlide(): void {
//         this.currentIndex = (this.currentIndex + 1) % this.slides.length
//         this.showSlide(this.currentIndex)
//     }

//     prevSlide(): void {
//         this.currentIndex = (this.currentIndex - 1 + this.slides.length) % this.slides.length
//         this.showSlide(this.currentIndex)
//     }
// }

// Usage
// const slider = new SliderManager('#mySlider')
// slider.nextSlide() or slider.prevSlide() to control