https://cdn2.futurefund.com/assets/controllers/showcase_controller-27504b4e.js

1import { Controller } from '@hotwired/stimulus'
2
3export default class extends Controller {
4  static targets = [ 'frontImage', 'backImage', 'item' ]
5
6  connect() {
7    this.itemTargets.forEach((item) => {
8      if (item.getAttribute('open')) {
9        this.backImageTarget.src = item.getAttribute('data-showcase-image-param')
10        this.frontImageTarget.src = item.getAttribute('data-showcase-image-param')
11      }
12    })
13  }
14
15  hover(event) {
16    if (!event.currentTarget.getAttribute('open')) {
17      this.itemTargets.forEach((item) => {
18        item.removeAttribute('open')
19      })
20      event.currentTarget.setAttribute('open', 'true')
21
22      this.backImageTarget.src = event.params["image"]
23
24      this.frontImageTarget.addEventListener("transitionend", (e) => {
25        this.frontImageTarget.src = event.params["image"]
26        this.frontImageTarget.classList.remove('transition-opacity', 'opacity-0')
27      });
28
29      this.frontImageTarget.classList.add('transition-opacity', 'opacity-0')
30    }
31  }
32}