https://bodicine.com/cdn/shop/t/2/assets/scrolling-text-banner.js?v=116571392916308698541770827532

1customElements.get("scrolling-text-banner")||customElements.define("scrolling-text-banner",class extends HTMLElement{constructor(){super(),this.spacing=20,this.speedFactor=10,this.speed=100,this.mobileBreakpoint=600,this.mobileSpeedFactor=.7,this.resizeObserver=null,this.sectionType=this.dataset.sectionType,this.itemIteration=10}connectedCallback(){this.spacing=parseInt(this.getAttribute("data-spacing"))||this.spacing;const speedInput=parseInt(this.getAttribute("data-speed"))||5;this.speed=this.mapSpeed(speedInput),this.mobileSpeedFactor=parseFloat(this.getAttribute("data-mobile-speed-factor"))||this.mobileSpeedFactor,this.sectionType==="scrolling-text-with-icon"?this.initializeScrollingIcon():this.initializeScrollingText(),this.observeResizing()}disconnectedCallback(){this.resizeObserver&&this.resizeObserver.disconnect()}mapSpeed(input){return 30+270*((input-1)/9)}getAdjustedSpeed(){return window.innerWidth<this.mobileBreakpoint?this.speed*this.mobileSpeedFactor:this.speed}initializeScrollingIcon(){const heroIcon=this.querySelectorAll(".hero__icon-with-text");if(!heroIcon.length){console.error("No `.hero__icon-with-text` element found inside the scrolling-text-banner component.");return}const parentElement=heroIcon[0].parentElement,iterations=Math.ceil(this.itemIteration/heroIcon.length),scrollingContainer=document.createElement("div");scrollingContainer.classList.add("scrolling-container"),parentElement?.appendChild(scrollingContainer);for(let i=0;i<2;i++){const wrapper=document.createElement("div");wrapper.classList.add("scrolling-wrapper");for(let j=0;j<iterations;j++)heroIcon.forEach(icon=>{const textWrapper=document.createElement("div");textWrapper.classList.add("scrolling-text");const htmlContent=icon.outerHTML;htmlContent&&(textWrapper.innerHTML=htmlContent),textWrapper.style.marginRight=`${this.spacing}px`,wrapper.appendChild(textWrapper)});scrollingContainer.appendChild(wrapper)}heroIcon.forEach(icon=>{icon.style.display="none",icon.inert=!0}),this.setAnimationSpeed(scrollingContainer)}initializeScrollingText(){const heroTitle=this.querySelector(".hero__title");if(!heroTitle){console.error("No `.hero__title` element found inside the scrolling-text-banner component.");return}const textContent=heroTitle.textContent.trim();if(!textContent){console.error("No text content found inside the `.hero__title` element.");return}heroTitle.innerHTML="";const scrollingContainer=document.createElement("div");scrollingContainer.classList.add("scrolling-container"),heroTitle.appendChild(scrollingContainer);for(let i=0;i<2;i++){const wrapper=document.createElement("div");wrapper.classList.add("scrolling-wrapper");for(let j=0;j<this.itemIteration;j++){const textWrapper=document.createElement("div");textWrapper.classList.add("scrolling-text"),textWrapper.textContent=textContent,textWrapper.style.marginRight=`${this.spacing}px`,wrapper.appendChild(textWrapper)}scrollingContainer.appendChild(wrapper)}this.setAnimationSpeed(scrollingContainer)}setAnimationSpeed(scrollingContainer){requestAnimationFrame(()=>{const wrappers=scrollingContainer.querySelectorAll(".scrolling-wrapper");if(wrappers.length!==2)return;const wrapperWidth=wrappers[0].offsetWidth,adjustedSpeed=this.getAdjustedSpeed(),duration=wrapperWidth/adjustedSpeed;scrollingContainer.style.width=`${wrapperWidth*2}px`,wrappers.forEach((wrapper,index)=>{wrapper.style.animationDuration=`${duration}s`,wrapper.style.animationDelay=`${-index*duration}s`})})}observeResizing(){if(this.sectionType==="scrolling-text-with-icon"){const heroIcon=this.querySelectorAll(".hero__icon-with-text");if(!heroIcon.length)return;this.resizeObserver=new ResizeObserver(()=>{this.recalculateAnimation()}),heroIcon.forEach(icon=>{this.resizeObserver.observe(icon)})}else{const heroTitle=this.querySelector(".hero__title");if(!heroTitle)return;this.resizeObserver=new ResizeObserver(()=>{this.recalculateAnimation()}),this.resizeObserver.observe(heroTitle)}}recalculateAnimation(){const scrollingContainer=this.querySelector(".scrolling-container");scrollingContainer&&this.setAnimationSpeed(scrollingContainer)}});
2//# sourceMappingURL=/cdn/shop/t/2/assets/scrolling-text-banner.js.map?v=116571392916308698541770827532