https://www.waterdrop.com/cdn/shop/t/30/assets/fullscreen-promotion-DFs4jmIP.js

1import{g as d}from"./theme-C25wr5Yb.js";import{t as r}from"./throttle-B1EiILCE.js";import l from"./custom-html-element-Cddc4xm8.js";import"./exports-NHIMKJG4.js";import"./logger-pamvzmAu.js";import"./event-zU-Y6ZHH.js";class c extends l{constructor(){super(),this._handleAnimate=this._handleAnimate.bind(this),this._handleDebouncedAnimate=this._handleDebouncedAnimate.bind(this),this._handleDebouncedVideo=this._handleDebouncedVideo.bind(this),this._handleMediaQueryChange=this._handleMediaQueryChange.bind(this),this.playPauseVideo=this.playPauseVideo.bind(this),this.topSpacing=48,this.opacityShift=200,this.isFirstAnimation=!0;const{breakpoints:e}=d();this.breakpoints=e,this.mediaQuery=window.matchMedia(this.breakpoints.md)}connectedCallback(){this._media=this.querySelector(".js-fullscreen-media"),this._content=this.querySelector(".js-fullscreen-content"),this._overlay=this.querySelector(".js-fullscreen-overlay"),this.hasVideo=this.querySelector(".js-video-wrapper"),this.hasVideo&&(this._desktopVideo=this.querySelector(".js-video-desktop-view"),this._mobileVideo=this.querySelector(".js-video-mobile-view"),this._overlay.addEventListener("click",this.playPauseVideo),this.autoPlayVideo()),this._contentRect={contentHeight:this._content.getBoundingClientRect().height},this._initializeListeners(),this._initializeStyles(),this._animate()}_initializeListeners(){this.mediaQuery.addEventListener("change",this._handleMediaQueryChange),document.addEventListener("scroll",this._handleAnimate),window.addEventListener("resize",this._handleDebouncedAnimate),window.addEventListener("resize",this._handleDebouncedVideo)}disconnectedCallback(){super.disconnectedCallback(),this.mediaQuery.removeEventListener("change",this._handleMediaQueryChange),document.removeEventListener("scroll",this._handleAnimate),window.removeEventListener("resize",this._handleDebouncedAnimate),window.removeEventListener("resize",this._handleDebouncedVideo)}_handleMediaQueryChange(e){this.topSpacing=e.matches?48:24,this.opacityShift=e.matches?200:100}_initializeStyles(){this._handleMediaQueryChange(this.mediaQuery),this._handleAnimate()}autoPlayVideo(){var e,t,s,i;this.mediaQuery.matches?((s=this._desktopVideo)==null||s.play(),(i=this._mobileVideo)==null||i.pause()):((e=this._mobileVideo)==null||e.play(),(t=this._desktopVideo)==null||t.pause())}playPauseVideo(){var e,t,s,i,n,o;this.mediaQuery.matches?(i=this._desktopVideo)!=null&&i.paused?(n=this._desktopVideo)==null||n.play():(o=this._desktopVideo)==null||o.pause():(e=this._mobileVideo)!=null&&e.paused?(t=this._mobileVideo)==null||t.play():(s=this._mobileVideo)==null||s.pause()}_animate(){if(!this._content||!this._contentRect)return;const{height:e,top:t,bottom:s}=this.getBoundingClientRect(),{height:i}=this._content.getBoundingClientRect();if(t>0){const o=Math.abs(t/e),a=1+.03*o,h=-100*o;this._media.style.transform=`matrix(${a}, 0, 0, ${a}, 0, ${h})`}const n=this.topSpacing*2;window.innerHeight-t>=i+n&&this._content.setAttribute("data-position","fixed"),window.innerHeight-t<i+n&&this._content.setAttribute("data-position","top"),window.innerHeight-s>0&&this._content.setAttribute("data-position","bottom"),window.innerHeight-t>=i+n+this.opacityShift?(this._content.style.opacity=1,this._content.setAttribute("aria-hidden",!1)):(this._content.style.opacity=0,this._content.setAttribute("aria-hidden",!0)),this.isFirstAnimation&&(this.isFirstAnimation=!1,setTimeout(()=>{this._media.classList.remove("transition-transform")},250))}_handleAnimate(){r(()=>this._animate(),15)()}_handleDebouncedAnimate(){this._debounce(()=>this._animate(),50)}_handleDebouncedVideo(){this._debounce(()=>this.playPauseVideo(),50)}}customElements.get("fullscreen-promotion")||customElements.define("fullscreen-promotion",c);