swiper
Version:
Most modern mobile touch slider and framework with hardware accelerated transitions
2 lines • 2.69 kB
JavaScript
import{c as createShadow}from"../shared/create-shadow.min.mjs";import{e as effectInit}from"../shared/effect-init.min.mjs";import{e as effectTarget}from"../shared/effect-target.min.mjs";import{e as effectVirtualTransitionEnd}from"../shared/effect-virtual-transition-end.min.mjs";import{g as getSlideTransformEl,p as getRotateFix}from"../shared/utils.min.mjs";function EffectCreative({swiper:e,extendParams:t,on:s}){t({creativeEffect:{limitProgress:1,shadowPerProgress:!1,progressMultiplier:1,perspective:!0,prev:{translate:[0,0,0],rotate:[0,0,0],opacity:1,scale:1},next:{translate:[0,0,0],rotate:[0,0,0],opacity:1,scale:1}}});const r=e=>"string"==typeof e?e:`${e}px`;effectInit({effect:"creative",swiper:e,on:s,setTranslate:()=>{const{slides:t,wrapperEl:s,slidesSizesGrid:a}=e,i=e.params.creativeEffect,{progressMultiplier:o}=i,l=e.params.centeredSlides,n=getRotateFix(e);if(l){const t=a[0]/2-e.params.slidesOffsetBefore||0;s.style.transform=`translateX(calc(50% - ${t}px))`}for(let s=0;s<t.length;s+=1){const a=t[s],c=a.progress,f=Math.min(Math.max(a.progress,-i.limitProgress),i.limitProgress);let m=f;l||(m=Math.min(Math.max(a.originalProgress,-i.limitProgress),i.limitProgress));const p=a.swiperSlideOffset,d=[e.params.cssMode?-p-e.translate:-p,0,0],g=[0,0,0];let h=!1;e.isHorizontal()||(d[1]=d[0],d[0]=0);let w={translate:[0,0,0],rotate:[0,0,0],scale:1,opacity:1};f<0?(w=i.next,h=!0):f>0&&(w=i.prev,h=!0),d.forEach((e,t)=>{d[t]=`calc(${e}px + (${r(w.translate[t])} * ${Math.abs(f*o)}))`}),g.forEach((e,t)=>{let s=w.rotate[t]*Math.abs(f*o);g[t]=s}),a.style.zIndex=-Math.abs(Math.round(c))+t.length;const y=d.join(", "),u=`rotateX(${n(g[0])}deg) rotateY(${n(g[1])}deg) rotateZ(${n(g[2])}deg)`,v=m<0?`scale(${1+(1-w.scale)*m*o})`:`scale(${1-(1-w.scale)*m*o})`,E=m<0?1+(1-w.opacity)*m*o:1-(1-w.opacity)*m*o,M=`translate3d(${y}) ${u} ${v}`;if(h&&w.shadow||!h){let e=a.querySelector(".swiper-slide-shadow");if(!e&&w.shadow&&(e=createShadow("creative",a)),e){const t=i.shadowPerProgress?f*(1/i.limitProgress):f;e.style.opacity=Math.min(Math.max(Math.abs(t),0),1)}}const $=effectTarget(i,a);$.style.transform=M,$.style.opacity=E,w.origin&&($.style.transformOrigin=w.origin)}},setTransition:t=>{const s=e.slides.map(e=>getSlideTransformEl(e));s.forEach(e=>{e.style.transitionDuration=`${t}ms`,e.querySelectorAll(".swiper-slide-shadow").forEach(e=>{e.style.transitionDuration=`${t}ms`})}),effectVirtualTransitionEnd({swiper:e,duration:t,transformElements:s,allSlides:!0})},perspective:()=>e.params.creativeEffect.perspective,overwriteParams:()=>({watchSlidesProgress:!0,virtualTranslate:!e.params.cssMode})})}export{EffectCreative as default};
//# sourceMappingURL=effect-creative.min.mjs.map