4334-cf5d1994eca58e32b6b1.js

"use strict";(self.webpackChunkembla_carousel_docs=self.webpackChunkembla_carousel_docs||[]).push([[4334],{4334:function(e,n,o){o.r(n),n.default="import { EmblaCarouselType, EmblaEventType } from 'embla-carousel'\n\nexport const setupLazyLoadImage = (\n  emblaApi: EmblaCarouselType\n): ((emblaApi: EmblaCarouselType, eventName: EmblaEventType) => void) => {\n  const imagesInView: number[] = []\n  const slideNodes = emblaApi.slideNodes()\n  const spinnerNodes = slideNodes.map(\n    (slideNode) =>\n      <HTMLElement>slideNode.querySelector('.embla__lazy-load__spinner')\n  )\n  const imageNodes = slideNodes.map(\n    (slideNode) =>\n      <HTMLImageElement>slideNode.querySelector('.embla__lazy-load__img')\n  )\n\n  const loadImageInView = (index: number): void => {\n    const imageNode = imageNodes[index]\n    const slideNode = slideNodes[index]\n    const spinnerNode = spinnerNodes[index]\n    const src = <string>imageNode.getAttribute('data-src')\n\n    imageNode.src = src\n    imagesInView.push(index)\n\n    const onLoad = (): void => {\n      slideNode.classList.add('embla__lazy-load--has-loaded')\n      spinnerNode.parentElement?.removeChild(spinnerNode)\n      imageNode.removeEventListener('load', onLoad)\n    }\n    imageNode.addEventListener('load', onLoad)\n  }\n\n  const loadImagesInView = (): boolean => {\n    emblaApi\n      .slidesInView()\n      .filter((index) => !imagesInView.includes(index))\n      .forEach(loadImageInView)\n    return imagesInView.length === imageNodes.length\n  }\n\n  const loadImagesInViewAndDestroyIfDone = (\n    emblaApi: EmblaCarouselType,\n    eventName: EmblaEventType\n  ): void => {\n    const loadedAll = loadImagesInView()\n    if (loadedAll) emblaApi.off(eventName, loadImagesInViewAndDestroyIfDone)\n  }\n\n  return loadImagesInViewAndDestroyIfDone\n}\n"}}]);
//# sourceMappingURL=4334-cf5d1994eca58e32b6b1.js.map