{"version":3,"sources":["webpack://gli-frontend/../web/themes/custom/gilderlehrman_theme/src/js/gli__3d-carousel-slide.js"],"names":["Drupal","Splide","behaviors","threeDCarouselSlide","attach","context","getElementsByClassName","length","splide","type","perPage","focus","autoWidth","updateOnMove","speed","drag","breakpoints","1023","on","slideCaption","Components","Slides","getAt","slide","querySelector","innerHTML","root","track","Elements","arrows","Arrows","window","innerWidth","arrowTop","offsetHeight","prev","style","top","next","newIndex","prevIndex","destIndex","captionArea","activeIndex","numSlides","getLength","forEach","index","slideElement","classList","add","remove","mount"],"mappings":"CAAA,SAAEA,EAAQC,GACRD,EAAOE,UAAUC,oBAAsB,CACrCC,OADqC,SAC9BC,GACL,GAAIA,EAAQC,uBAAuB,sBAAsBC,OAAQ,CAC/D,IAAMC,EAAS,IAAIP,EAAO,sBAAuB,CAC/CQ,KAAM,OACNC,QAAS,EACTC,MAAO,SACPC,WAAW,EACXC,cAAc,EACdC,MAAO,IACPC,MAAM,EACNC,YAAa,CACXC,KAAM,CACJF,MAAM,MAKZP,EAAOU,GAAG,WAAW,WAAW,MAExBC,EAAY,UADJX,EAAOY,WAAWC,OAAOC,MAAM,GAClBC,MAAMC,cAAc,+BAA7B,aAAG,EAAmDC,UACxEjB,EAAOkB,KAAKF,cAAc,oBAAoBC,UAAYN,KAG5DX,EAAOU,GAAG,UAAU,WAClB,IAAMS,EAAQnB,EAAOY,WAAWQ,SAASD,MACnCE,EAASrB,EAAOY,WAAWU,OAAOD,OAExC,GAAIE,OAAOC,YAAc,IAAK,CAC5B,IAEIC,EAFSN,EAAMO,aAEM,EAAK,QAEJ,IAAfL,EAAOM,OAChBN,EAAOM,KAAKC,MAAMC,IAAMJ,EAAW,WAEX,IAAfJ,EAAOS,OAChBT,EAAOS,KAAKF,MAAMC,IAAMJ,EAAW,WAIrCJ,EAAOM,KAAKC,MAAMC,IAAM,GACxBR,EAAOS,KAAKF,MAAMC,IAAM,MAI5B7B,EAAOU,GAAG,QAAQ,SAASqB,EAAUC,EAAWC,GAAW,MAEnDC,EAAclC,EAAOkB,KAAKF,cAAc,oBAExCL,EAAY,UADAX,EAAOY,WAAWC,OAAOC,MAAMiB,GAClBhB,MAAMC,cAAc,+BAAjC,aAAG,EAAuDC,UAC5EiB,EAAYjB,UAAYN,EAExB,IAAME,EAASb,EAAOY,WAAWC,OAC3BsB,EAAcF,EACdG,EAAYvB,EAAOwB,WAAU,GAEnCxB,EAAOyB,SAAQ,SAACvB,EAAOwB,GACrB,IAAMC,EAAezB,EAAMA,MAEvBwB,EAAQH,IAAeD,EAAc,EAAIC,GAAaA,GACxDI,EAAaC,UAAUC,IAAI,cAC3BF,EAAaC,UAAUE,OAAO,eACrBJ,EAAQH,IAAeD,EAAc,EAAIC,GAAaA,GAC/DI,EAAaC,UAAUC,IAAI,cAC3BF,EAAaC,UAAUE,OAAO,gBAE9BH,EAAaC,UAAUE,OAAO,cAC9BH,EAAaC,UAAUE,OAAO,qBAKpC3C,EAAO4C,WA1Ef,CA8EGpD,OAAQC","file":"/js/gli__3d-carousel-slide.js","sourcesContent":["((Drupal, Splide) => {\n  Drupal.behaviors.threeDCarouselSlide = {\n    attach(context) {\n      if (context.getElementsByClassName('splide-3d-carousel').length) {\n        const splide = new Splide('.splide-3d-carousel', {\n          type: 'loop',\n          perPage: 5,\n          focus: 'center',\n          autoWidth: true,\n          updateOnMove: true,\n          speed: 1000,\n          drag: false,\n          breakpoints: {\n            1023: {\n              drag: true\n            }\n          }\n        });\n\n        splide.on('mounted', function() {\n          const Slide = splide.Components.Slides.getAt(0);\n          const slideCaption = Slide.slide.querySelector('.media-image-caption')?.innerHTML;\n          splide.root.querySelector('.splide__caption').innerHTML = slideCaption;\n        });\n\n        splide.on('resize', function() {\n          const track = splide.Components.Elements.track;\n          const arrows = splide.Components.Arrows.arrows;\n\n          if (window.innerWidth <= 700) {\n            let height = track.offsetHeight;\n            // 44px is the height of the arrow element.\n            let arrowTop = (height / 2) - 22;\n\n            if (typeof arrows.prev != 'undefined') {\n              arrows.prev.style.top = arrowTop + 'px';\n            }\n            if (typeof arrows.next != 'undefined') {\n              arrows.next.style.top = arrowTop + 'px';\n            }\n          }\n          else {\n            arrows.prev.style.top = '';\n            arrows.next.style.top = '';\n          }\n        });\n\n        splide.on('move', function(newIndex, prevIndex, destIndex) {\n          // Switch caption text.\n          const captionArea = splide.root.querySelector('.splide__caption');\n          const nextSlide = splide.Components.Slides.getAt(newIndex);\n          const slideCaption = nextSlide.slide.querySelector('.media-image-caption')?.innerHTML;\n          captionArea.innerHTML = slideCaption;\n\n          const Slides = splide.Components.Slides;\n          const activeIndex = destIndex;\n          const numSlides = Slides.getLength(true);\n          // Loop through all the slides, including clones.\n          Slides.forEach((slide, index) => {\n            const slideElement = slide.slide;\n            // Apply styles to non-visible elements accordingly.\n            if (index % numSlides === (activeIndex - 1 + numSlides) % numSlides) {\n              slideElement.classList.add('clone-prev');\n              slideElement.classList.remove('clone-next');\n            } else if (index % numSlides === (activeIndex + 1 + numSlides) % numSlides) {\n              slideElement.classList.add('clone-next');\n              slideElement.classList.remove('clone-prev');\n            } else {\n              slideElement.classList.remove('clone-prev');\n              slideElement.classList.remove('clone-next');\n            }\n          });\n        });\n\n        splide.mount();\n      }\n    },\n  };\n})(Drupal, Splide);\n"],"sourceRoot":""}