import { Application } from "@hotwired/stimulus"

const application = Application.start()

// Configure Stimulus development experience
application.debug = false
window.Stimulus   = application

export { application }

// URL: https://edforshaw.co.uk/hotwire-turbo-stream-animations
// FIXME: data-stream-exit-class not working..
document.addEventListener("turbo:before-stream-render", function(event) {
    // Add a class to an element we are about to add to the page
    // as defined by its "data-stream-enter-class"
    if (event.target.firstElementChild instanceof HTMLTemplateElement) {
      var enterAnimationClass = event.target.templateContent.firstElementChild.dataset.streamEnterClass
      if (enterAnimationClass) {
        event.target.templateElement.content.firstElementChild.classList.add(enterAnimationClass)
      }
    }
  
    // Add a class to an element we are about to remove from the page
    // as defined by its "data-stream-exit-class"
    var elementToRemove = document.getElementById(event.target.target)
    if (elementToRemove) {
      var streamExitClass = elementToRemove.dataset.streamExitClass
      if (streamExitClass) {
        // Intercept the removal of the element
        event.preventDefault()
        elementToRemove.classList.add(streamExitClass)
        // Wait for its animation to end before removing the element
        elementToRemove.addEventListener("animationend", function() {
          event.target.performAction()
        })
      }
    }
  })