<turbo-stream action="update" target="mall-map-wrapper"><template><div data-controller="photo" id="mall-photos" itemscope="" itemtype="https://schema.org/ImageGallery"><div class="carousel slide carousel-fade" data-bs-interval="false" data-bs-ride="false" data-bs-touch="true" data-bs-wrap="true" id="main-slide"><div class="carousel-inner"></div></div><div aria-label="Photo thumbnails" class="d-flex overflow-auto gap-1 py-1" id="thumbnail-strip" role="tablist"></div></div><div aria-hidden="true" aria-labelledby="mallPhotoEnlargeModalLabel" class="modal fade" id="mallPhotoEnlargeModal" tabindex="-1"><div class="modal-dialog modal-fullscreen"><div class="modal-content bg-transparent border-0 vh-100"><h1 class="visually-hidden" id="mallPhotoEnlargeModalLabel">West Main Shopping Center Photo Gallery</h1><button aria-label="Close" class="btn btn-dark btn-lg position-absolute rounded-circle d-flex align-items-center justify-content-center mall-photo-modal-close" data-bs-dismiss="modal" type="button"><i class="ri-close-line fs-4"></i></button><div class="modal-body p-0 h-100 d-flex align-items-center justify-content-center"><div class="carousel slide carousel-fade" data-bs-interval="false" data-bs-ride="false" data-bs-touch="true" data-bs-wrap="true" id="mallPhotoCarousel"><div class="carousel-inner vh-100"></div></div></div></div></div></div><div id="mall-photo-scripts"><script>deletePhoto = function(elementID) {
  var img = document.getElementById(elementID)
  if (!img) return
  var thumb = img.closest('.thumbnail-item')
  if (!thumb) return
  var strip = document.getElementById('thumbnail-strip')
  if (!strip) return
  var thumbs = Array.from(strip.querySelectorAll('.thumbnail-item'))
  var idx = thumbs.indexOf(thumb)

  // Remove carousel item
  var items = document.querySelectorAll('#main-slide .carousel-item')
  if (items[idx]) {
    var wasActive = items[idx].classList.contains('active')
    items[idx].remove()
    if (wasActive) {
      var remaining = document.querySelectorAll('#main-slide .carousel-item')
      if (remaining.length > 0) remaining[0].classList.add('active')
    }
  }

  // Remove thumbnail
  thumb.remove()

  // Re-index thumbnail data-slide-index attributes
  document.querySelectorAll('#thumbnail-strip .thumbnail-item').forEach(function(t, i) {
    t.setAttribute('data-slide-index', i)
  })

  // Also remove from enlargement modal carousel
  var modalItems = document.querySelectorAll('#mallPhotoCarousel .carousel-item')
  if (modalItems[idx]) {
    var wasModalActive = modalItems[idx].classList.contains('active')
    modalItems[idx].remove()
    if (wasModalActive) {
      var remainingModal = document.querySelectorAll('#mallPhotoCarousel .carousel-item')
      if (remainingModal.length > 0) remainingModal[0].classList.add('active')
    }
  }

  // Re-index modal indicators
  var indicators = document.querySelectorAll('#mallPhotoCarousel .carousel-indicators button')
  if (indicators) {
    indicators.forEach(function(btn, i) {
      btn.setAttribute('data-bs-slide-to', i)
      btn.setAttribute('aria-label', 'Slide ' + (i + 1))
    })
  }
}</script></div></template></turbo-stream>