const slider = document.getElementById('listing-lightbox')

const lightboxSlider = new Splide('#lightbox-slider-listing', {
  type: 'fade',
  perPage: 1,
  speed: 500,
  easing: 'ease-in-out',
  gap: '16px',
  mediaQuery: 'min',
  arrows: true,
  pagination: false,
  rewind: true
})

lightboxSlider.on('mounted move', function () {
  document.getElementById(`current-slide-listing`).innerHTML =
    lightboxSlider.index + 1
})

lightboxSlider.mount()

const floorplanSlider = document.getElementById('floorplan-lightbox')

if (floorplanSlider) {
  const floorplanSlider = new Splide('#lightbox-slider-floorplan', {
    type: 'fade',
    perPage: 1,
    speed: 500,
    easing: 'ease-in-out',
    gap: '16px',
    mediaQuery: 'min',
    arrows: true,
    pagination: false,
    rewind: true
  })

  floorplanSlider.on('mounted move', function () {
    document.getElementById(`current-slide-floorplan`).innerHTML =
      floorplanSlider.index + 1
  })

  floorplanSlider.mount()
}