{"version":3,"file":"carousel.06ac7b1230df7cdd2bda.js","mappings":"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","sources":["webpack://paternitylab.com/./themes/paternitylab/src/js/carousel.js"],"sourcesContent":["// Get DOM elements\nconst thumbnails = document.querySelectorAll('.carousel-container .thumbnail');\nconst arrows = document.querySelectorAll('.carousel-container .arrow');\nconst mainImageContainer = document.querySelector('.carousel-container .main-image-container');\nconst videoContainer = document.querySelector('.carousel-video-container');\n\n// Configuration\nconst maxVisibleThumbnails = 4;\n\n// Variables for carousel navigation\nlet currentIndex = 0;\nlet startX;\nlet endX;\n\n// Initialize the carousel\ninitializeCarousel();\n\n/**\n * Sets the given thumbnail as active and updates the main image and video.\n *\n * @param {Element} thumbnail The thumbnail to be set as active.\n */\nfunction setActiveThumbnail(thumbnail) {\n  toggleThumbnailActiveClass(thumbnail);\n  setCarouselActiveMedia(thumbnail);\n  toggleThumbnailDisplay(thumbnail);\n}\n\n/**\n * Adds the 'thumbnail-active' class to the given thumbnail and removes it from the others.\n *\n * @param {Element} thumbnail The selected thumbnail.\n */\nfunction toggleThumbnailActiveClass(thumbnail) {\n  thumbnails.forEach((_thumbnail) => _thumbnail.classList.remove('thumbnail-active'));\n  thumbnail.classList.add('thumbnail-active');\n}\n\n/**\n * Sets the carousel active media (image or video) based on the given thumbnail.\n *\n * @param {Element} thumbnail The selected thumbnail.\n */\nfunction setCarouselActiveMedia(thumbnail) {\n  const videoEmbedCode = thumbnail.getAttribute('data-wistia-video');\n  if (videoEmbedCode) {\n    setVideo(videoEmbedCode);\n  } else {\n    setMainImage(thumbnail);\n  }\n}\n\n/**\n * Sets the main image and its description.\n *\n * @param {Element} thumbnail The selected thumbnail.\n */\nfunction setMainImage(thumbnail) {\n  const mainImage = document.querySelector('.carousel-container .main-image');\n  mainImage.src = thumbnail.src;\n  mainImage.alt = thumbnail.alt;\n  setVideoDisplay(false);\n  setMainImageDisplay(true);\n}\n\n/**\n * Sets the video embed code.\n *\n * @param {string} videoEmbedCode The video embed code.\n */\nfunction setVideo(videoEmbedCode) {\n  const parser = new DOMParser();\n  const doc = parser.parseFromString(videoEmbedCode, 'text/html');\n  appendScriptsToContainer(Array.from(doc.getElementsByTagName('script')), videoContainer);\n  videoContainer.innerHTML = doc.querySelector('.wistia_responsive_padding').outerHTML;\n  setVideoDisplay(true);\n  setMainImageDisplay(false);\n}\n\n/**\n * Sets the display property of the video container.\n *\n * @param {boolean} displayVideo Whether the video should be displayed.\n */\nfunction setVideoDisplay(displayVideo) {\n  videoContainer.style.display = displayVideo ? 'block' : 'none';\n}\n\n/**\n * Sets the display property of the main image container.\n *\n * @param {boolean} displayMainImage Whether the main image should be displayed.\n */\nfunction setMainImageDisplay(displayMainImage) {\n  mainImageContainer.style.display = displayMainImage ? 'flex' : 'none';\n}\n\n/**\n * Appends the given scripts to the given container.\n *\n * @param {Array} scripts The scripts to be appended.\n * @param {Element} container The container to which the scripts will be appended.\n */\nfunction appendScriptsToContainer(scripts, container) {\n  scripts.forEach((script) => {\n    const newScript = document.createElement('script');\n    newScript.src = script.src;\n    newScript.async = true;\n    container.appendChild(newScript);\n  });\n}\n\n/**\n * Gets the index of the thumbnail in the thumbnails array.\n *\n * @param {Element} thumbnail The selected thumbnail.\n *\n * @returns {number} The index of the thumbnail.\n */\nfunction getThumbnailIndex(thumbnail) {\n  return Array.from(thumbnails).indexOf(thumbnail);\n}\n\n/**\n * Toggles the visibility of thumbnails based on the scrolling direction.\n *\n * @param {Element} thumbnail The selected thumbnail.\n */\nfunction toggleThumbnailDisplay(thumbnail) {\n  const previousIndex = currentIndex;\n  currentIndex = getThumbnailIndex(thumbnail);\n  if (thumbnail.style.display !== 'none') {\n    return;\n  }\n\n  thumbnail.style.display = 'block';\n  const offset = previousIndex - currentIndex;\n  let targetIndex = offset > 0 ? currentIndex + maxVisibleThumbnails : currentIndex - maxVisibleThumbnails;\n  targetIndex = Math.min(Math.max(targetIndex, 0), thumbnails.length - 1);\n  setThumbnailDisplay(targetIndex, 'none');\n}\n\n/**\n * Sets the 'display' property of the thumbnail at the given index.\n *\n * @param {number} index The index of the thumbnail.\n * @param {string} displayValue The value of the 'display' property.\n */\nfunction setThumbnailDisplay(index, displayValue) {\n  if (!thumbnails[index]) {\n    return;\n  }\n\n  thumbnails[index].style.display = displayValue;\n}\n\n/**\n * Event handler for clicking on thumbnails.\n *\n * @param {Event} event The click event.\n */\nfunction thumbnailClickHandler(event) {\n  setActiveThumbnail(event.currentTarget);\n}\n\n/**\n * Event handler for clicking on arrows.\n *\n * @param {Event} event The click event.\n */\nfunction arrowClickHandler(event) {\n  const activeThumbnail = document.querySelector('.thumbnail.thumbnail-active');\n  const isArrowRight = event.currentTarget.classList.contains('arrow-right');\n  let nextThumbnail = isArrowRight ? activeThumbnail.nextElementSibling : activeThumbnail.previousElementSibling;\n  if (!nextThumbnail) {\n    nextThumbnail = isArrowRight ? thumbnails[0] : thumbnails[thumbnails.length - 1];\n  }\n\n  setActiveThumbnail(nextThumbnail);\n}\n\n/**\n * Initializes arrows by adding event listeners.\n */\nfunction initializeArrows() {\n  if (!arrows) {\n    return;\n  }\n\n  arrows.forEach((arrow) => arrow.addEventListener('click', arrowClickHandler));\n}\n\n/**\n * Initializes the thumbnails by adding event listeners and hiding the ones that should not be visible.\n */\nfunction initializeThumbnails() {\n  if (!thumbnails) {\n    return;\n  }\n\n  thumbnails.forEach((thumbnail) => {\n    thumbnail.addEventListener('click', thumbnailClickHandler);\n    const index = getThumbnailIndex(thumbnail);\n    if (index >= maxVisibleThumbnails) {\n      setThumbnailDisplay(index, 'none');\n    }\n  });\n}\n\n/**\n * Initializes the carousel by adding event listeners and initializing the thumbnails.\n */\nfunction initializeCarousel() {\n  if (!document.querySelectorAll('.carousel-container').length) {\n    return;\n  }\n\n  initializeArrows();\n  initializeThumbnails();\n  enableSwipeToChangeActiveThumbnail(mainImageContainer);\n  enableSwipeToChangeActiveThumbnail(videoContainer);\n  setActiveThumbnail(thumbnails[currentIndex]);\n}\n\n/**\n * Enables swipe gestures to change the active thumbnail on a given container.\n *\n * @param {Element} container The container to which the touch listeners will be added.\n */\nfunction enableSwipeToChangeActiveThumbnail(container) {\n  if (!container) {\n    return;\n  }\n\n  container.addEventListener('touchstart', captureStartingXCoordinate, false);\n  container.addEventListener('touchmove', preventDefault, false);\n  container.addEventListener('touchend', handleSwipeGesture, false);\n}\n\n/**\n * Captures the starting X coordinate of the touch gesture.\n *\n * @param {Event} event The touchstart event.\n */\nfunction captureStartingXCoordinate(event) {\n  startX = event.touches[0].clientX;\n}\n\n/**\n * Prevents the default behavior of the touchmove event.\n *\n * @param {Event} event The touchmove event.\n */\nfunction preventDefault(event) {\n  event.preventDefault();\n}\n\n/**\n * Handles the swipe gesture, clicking on the left or right arrow based on the swipe direction.\n *\n * @param {Event} event The touchend event.\n */\nfunction handleSwipeGesture(event) {\n  endX = event.changedTouches[0].clientX;\n  const deltaX = startX - endX;\n  const containerRect = this.getBoundingClientRect();\n  const containerLeft = containerRect.left;\n  const containerWidth = containerRect.width;\n  const halfContainerWidth = containerWidth / 2;\n  if (deltaX > 50 && endX <= containerLeft + halfContainerWidth) {\n    document.querySelector('.carousel-container .arrow-right').click();\n  } else if (deltaX < -50 && endX >= containerLeft + halfContainerWidth) {\n    document.querySelector('.carousel-container .arrow-left').click();\n  }\n}\n"],"names":["thumbnails","document","querySelectorAll","arrows","mainImageContainer","querySelector","videoContainer","startX","endX","currentIndex","setActiveThumbnail","thumbnail","forEach","_thumbnail","classList","remove","add","toggleThumbnailActiveClass","videoEmbedCode","getAttribute","doc","DOMParser","parseFromString","scripts","container","Array","from","getElementsByTagName","script","newScript","createElement","src","async","appendChild","innerHTML","outerHTML","setVideoDisplay","setMainImageDisplay","setVideo","mainImage","alt","setMainImage","setCarouselActiveMedia","previousIndex","getThumbnailIndex","style","display","targetIndex","Math","min","max","length","setThumbnailDisplay","toggleThumbnailDisplay","displayVideo","displayMainImage","indexOf","index","displayValue","thumbnailClickHandler","event","currentTarget","arrowClickHandler","activeThumbnail","isArrowRight","contains","nextThumbnail","nextElementSibling","previousElementSibling","enableSwipeToChangeActiveThumbnail","addEventListener","captureStartingXCoordinate","preventDefault","handleSwipeGesture","touches","clientX","changedTouches","deltaX","containerRect","this","getBoundingClientRect","containerLeft","left","halfContainerWidth","width","click","arrow"],"sourceRoot":""}