import { Controller } from '@hotwired/stimulus'

export default class extends Controller {
    static targets = ['slide']
    static values = { index: { type: Number, default: 0 } }

    connect() {
        this.showSlide()
    }

    next() {
        this.indexValue = (this.indexValue + 1) % this.slideTargets.length
    }

    prev() {
        this.indexValue = (this.indexValue - 1 + this.slideTargets.length) % this.slideTargets.length
    }

    indexValueChanged() {
        this.showSlide()
    }

    showSlide() {
        this.slideTargets.forEach((slide, i) => {
            slide.classList.toggle('hidden', i !== this.indexValue)
        })
    }
}