https://veggiecraft.com/cdn/shop/t/36/assets/announcement-bar.js?v=53799446119024640351788973316

1import{Component}from"@theme/component";import{debounce,prefersReducedMotion}from"@theme/utilities";export class AnnouncementBar extends Component{#current=0;#interval=void 0;#resizeObserver=void 0;#handleResize=debounce(()=>{this.#updateTextMarquees()},250);connectedCallback(){super.connectedCallback(),this.addEventListener("mouseenter",this.suspend),this.addEventListener("mouseleave",this.resume),document.addEventListener("visibilitychange",this.#handleVisibilityChange),this.#resizeObserver=new ResizeObserver(this.#handleResize),this.#resizeObserver.observe(this),requestAnimationFrame(()=>{this.#buildPagination(),this.#updateTextMarquees(),this.play()})}disconnectedCallback(){super.disconnectedCallback(),this.#resizeObserver?.disconnect(),this.#resizeObserver=void 0,document.removeEventListener("visibilitychange",this.#handleVisibilityChange)}updatedCallback(){super.updatedCallback(),this.#buildPagination(),requestAnimationFrame(()=>this.#updateTextMarquees())}#buildPagination(){const slides=this.refs.slides??[],slidesContainer=this.querySelector(".announcement-bar__slides"),existingPagination=this.querySelector(".announcement-bar__pagination");if(!slidesContainer||slides.length<=1){existingPagination?.remove();return}let pagination=existingPagination;pagination instanceof HTMLElement?slidesContainer.contains(pagination)&&this.appendChild(pagination):(pagination=document.createElement("nav"),pagination.className="announcement-bar__pagination",pagination.setAttribute("aria-label",this.dataset.paginationLabel??"Announcements"),this.appendChild(pagination));let dotsList=pagination.querySelector(".announcement-bar__dots");if(dotsList instanceof HTMLElement||(dotsList=document.createElement("ol"),dotsList.className="announcement-bar__dots",pagination.appendChild(dotsList)),dotsList.childElementCount!==slides.length){dotsList.replaceChildren();for(let index=0;index<slides.length;index++){const listItem=document.createElement("li"),dot=document.createElement("button");dot.type="button",dot.className="announcement-bar__dot t3",dot.textContent=String(index+1),dot.setAttribute("aria-label",`Slide ${index+1} of ${slides.length}`),dot.setAttribute("on:click",`/select/${index}`),dot.setAttribute("ref","dots[]"),dot.setAttribute("aria-selected",index===0?"true":"false"),listItem.appendChild(dot),dotsList.appendChild(listItem)}super.updatedCallback()}this.#syncPaginationState()}#syncPaginationState(){const slideCount=(this.refs.slides??[]).length;if(slideCount<=1)return;let relativeIndex=this.#current%slideCount;relativeIndex<0&&(relativeIndex+=slideCount);const{dots}=this.refs;if(!dots)return;(Array.isArray(dots)?dots:[dots]).forEach((dot,index)=>{dot.setAttribute("aria-selected",`${index===relativeIndex}`)})}#updateTextMarquees(){for(const slide of this.refs.slides??[])slide instanceof HTMLElement&&this.#updateSlideMarquee(slide)}#updateSlideMarquee(slide){const viewport=slide.querySelector(".announcement-bar__text-viewport"),text=slide.querySelector(".announcement-bar__text");if(!(viewport instanceof HTMLElement)||!(text instanceof HTMLElement))return;const hasMarquee=slide.hasAttribute("data-text-marquee"),overflows=slide.querySelector(".announcement-bar__marquee")?marqueeStillNeeded(viewport,slide):textNeedsMarquee(viewport,text);overflows&&!hasMarquee?this.#enableMarquee(slide,viewport,text):!overflows&&hasMarquee?this.#disableMarquee(slide):overflows&&hasMarquee&&this.#setMarqueeDuration(slide)}#enableMarquee(slide,viewport,text){if(prefersReducedMotion()){slide.setAttribute("data-text-marquee","");return}slide.setAttribute("data-text-marquee","");const marquee=document.createElement("div");marquee.className="announcement-bar__marquee";const track=document.createElement("div");track.className="announcement-bar__marquee-track";const segment=document.createElement("div");segment.className="announcement-bar__marquee-segment",segment.appendChild(text);const duplicateSegment=document.createElement("div");duplicateSegment.className="announcement-bar__marquee-segment",duplicateSegment.setAttribute("aria-hidden","true"),duplicateSegment.appendChild(text.cloneNode(!0)),track.append(segment,duplicateSegment),marquee.appendChild(track),viewport.appendChild(marquee),requestAnimationFrame(()=>this.#setMarqueeDuration(slide))}#disableMarquee(slide){slide.removeAttribute("data-text-marquee"),slide.style.removeProperty("--announcement-marquee-duration");const viewport=slide.querySelector(".announcement-bar__text-viewport"),marquee=viewport?.querySelector(".announcement-bar__marquee"),text=marquee?.querySelector(".announcement-bar__marquee-segment .announcement-bar__text")??viewport?.querySelector(":scope > .announcement-bar__text");text instanceof HTMLElement&&viewport instanceof HTMLElement&&(marquee?.remove(),viewport.appendChild(text))}#setMarqueeDuration(slide){const track=slide.querySelector(".announcement-bar__marquee-track");if(!(track instanceof HTMLElement))return;const segment=track.querySelector(".announcement-bar__marquee-segment");

1if(!(segment instanceof HTMLElement))return;const textWidth=segment.scrollWidth,pxPerSecond=40*getMarqueeSpeedMultiplier(slide),duration=Math.max(10,textWidth/pxPerSecond);slide.style.setProperty("--announcement-marquee-duration",`${duration}s`)}next(){this.#goToSlide(this.#current+1)}previous(){this.#goToSlide(this.#current-1)}select(index,_event){const slideCount=(this.refs.slides??[]).length;!slideCount||index<0||index>=slideCount||(this.#goToSlide(index),this.autoplay&&(this.suspend(),this.play()))}#goToSlide(index){const slideCount=(this.refs.slides??[]).length;if(!slideCount)return;this.#current=index;let relativeIndex=index%slideCount;relativeIndex<0&&(relativeIndex+=slideCount),this.refs.slides?.forEach((slide,slideIndex)=>{slide.setAttribute("aria-hidden",`${slideIndex!==relativeIndex}`)}),this.#syncPaginationState(),this.#onActiveSlideChange(relativeIndex)}#onActiveSlideChange(relativeIndex){requestAnimationFrame(()=>{this.#updateTextMarquees(),this.#restartMarqueeForSlide(relativeIndex)})}#restartMarqueeForSlide(relativeIndex){if(prefersReducedMotion())return;const slides=this.refs.slides??[];for(const slide of slides){if(!(slide instanceof HTMLElement))continue;const track=slide.querySelector(".announcement-bar__marquee-track");if(track instanceof HTMLElement)for(const animation of track.getAnimations())animation.currentTime=0}const activeSlide=slides[relativeIndex];if(!(activeSlide instanceof HTMLElement))return;const activeTrack=activeSlide.querySelector(".announcement-bar__marquee-track");if(activeTrack instanceof HTMLElement)for(const animation of activeTrack.getAnimations())animation.currentTime=0,animation.play()}play(interval=this.autoplayInterval){this.autoplay&&(this.paused=!1,this.#interval=setInterval(()=>{this.matches(":hover")||document.hidden||this.next()},interval))}pause(){this.paused=!0,this.suspend()}get paused(){return this.hasAttribute("paused")}set paused(paused){this.toggleAttribute("paused",paused)}suspend(){clearInterval(this.#interval),this.#interval=void 0}resume(){!this.autoplay||this.paused||(this.pause(),this.play())}get autoplay(){return!!this.autoplayInterval}get autoplayInterval(){const interval=this.getAttribute("autoplay"),value=parseInt(`${interval}`,10);if(!Number.isNaN(value))return value*1e3}get current(){return this.#current}set current(current){this.#goToSlide(current)}#handleVisibilityChange=()=>document.hidden?this.pause():this.resume()}const MARQUEE_SPEED_MIN=5,MARQUEE_SPEED_MAX=15,MARQUEE_SPEED_DEFAULT=10;function getMarqueeSpeedMultiplier(slide){const speedSetting=parseInt(slide.dataset.marqueeSpeed??`${MARQUEE_SPEED_DEFAULT}`,10);return Math.min(MARQUEE_SPEED_MAX,Math.max(MARQUEE_SPEED_MIN,speedSetting))/MARQUEE_SPEED_DEFAULT}function marqueeStillNeeded(viewport,slide){const segment=slide.querySelector(".announcement-bar__marquee-segment:not([aria-hidden])");return segment instanceof HTMLElement?segment.scrollWidth>viewport.clientWidth:!0}function textNeedsMarquee(viewport,textEl){const containerWidth=viewport.clientWidth;if(containerWidth<=0)return!1;const lineHeight=parseFloat(getComputedStyle(textEl).lineHeight);if(!Number.isNaN(lineHeight)&&textEl.scrollHeight>lineHeight*1.25)return!0;const probe=textEl.cloneNode(!0);probe.style.cssText="position:absolute;visibility:hidden;white-space:nowrap;width:max-content;max-width:none;pointer-events:none;",viewport.appendChild(probe);const needsMarquee=probe.scrollWidth>containerWidth;return probe.remove(),needsMarquee}customElements.get("announcement-bar-component")||customElements.define("announcement-bar-component",AnnouncementBar);
2//# sourceMappingURL=/cdn/shop/t/36/assets/announcement-bar.js.map?v=53799446119024640351788973316