31 lines
726 B
JavaScript
31 lines
726 B
JavaScript
import { Controller } from "@hotwired/stimulus"
|
|
|
|
export default class extends Controller {
|
|
static targets = [ "image", "dialog", "zoomedImage" ]
|
|
|
|
connect() {
|
|
this.dialogTarget.addEventListener('transitionend', this.onTransitionEnd.bind(this))
|
|
}
|
|
|
|
// Only remove the image src after the CSS transition has finished
|
|
onTransitionEnd(event) {
|
|
if (this._waitingForTransition && !this.dialogTarget.open) {
|
|
this._waitingForTransition = false
|
|
this.zoomedImageTarget.src = ""
|
|
}
|
|
}
|
|
|
|
open(event) {
|
|
this.dialogTarget.showModal()
|
|
this.#set(event.target.closest("a"))
|
|
}
|
|
|
|
reset() {
|
|
this._waitingForTransition = true
|
|
}
|
|
|
|
#set(target) {
|
|
this.zoomedImageTarget.src = target.href
|
|
}
|
|
}
|