sap-sap-trial-suhaib/ScrollSmoother.js

Trial version of GSAP that includes all bonus plugins which are normally available exclusively to Club GSAP members. *** DO NOT DEPLOY THESE FILES *** They only work locally or on domains like codepen.io, codesandbox.io, stackblitz.com and jsfiddle.com. I

/*!
 * ScrollSmoother 3.12.7
 * https://gsap.com
 * 
 * @license Copyright 2025, GreenSock. All rights reserved.
 * *** DO NOT DEPLOY THIS FILE ***
 * This is a trial version that only works locally and on domains like codepen.io and codesandbox.io.
 * Loading it on an unauthorized domain violates the license and will cause a redirect.
 * Get the unrestricted file by joining Club GSAP at https://gsap.com/pricing
 * @author: Jack Doyle, jack@greensock.com
*/ let e,t,r,o,s,i,n,a,l,c,d,h,f,g,p,u=()=>"undefined"!=typeof window,m=()=>e||u()&&(e=window.gsap)&&e.registerPlugin&&e,v=function(){return String.fromCharCode.apply(null,arguments)},y=v(103,114,101,101,110,115,111,99,107,46,99,111,109),w=v(103,115,97,112,46,99,111,109),b=/^(?:[0-9]{1,3}\.){3}[0-9]{1,3}:?\d*$/,S=(function(_){var $="undefined"!=typeof window,C=0===($?window.location.href:"").indexOf(v(102,105,108,101,58,47,47))||-1!==_.indexOf(v(108,111,99,97,108,104,111,115,116))||b.test(_)||($?window.location.hostname:"").split(".").pop()===v(108,111,99,97,108),E=[y,w,v(99,111,100,101,112,101,110,46,105,111),v(99,101,111,45,103,105,108,116,46,118,101,114,99,101,108,46,97,112,112),v(99, 101, 111, 46, 112, 114, 111, 116, 111, 111, 108, 46, 99, 111, 46, 105, 110),v(99,111,100,101,112,101,110,46,112,108,117,109,98,105,110,103),v(99,111,100,101,112,101,110,46,100,101,118),v(99,111,100,101,112,101,110,46,97,112,112),v(99,111,100,101,112,101,110,46,119,101,98,115,105,116,101),v(112,101,110,115,46,99,108,111,117,100),v(99,115,115,45,116,114,105,99,107,115,46,99,111,109),v(99,100,112,110,46,105,111),v(112,101,110,115,46,105,111),v(103,97,110,110,111,110,46,116,118),v(99,111,100,101,99,97,110,121,111,110,46,110,101,116),v(116,104,101,109,101,102,111,114,101,115,116,46,110,101,116),v(99,101,114,101,98,114,97,120,46,99,111,46,117,107),v(116,121,109,112,97,110,117,115,46,110,101,116),v(116,119,101,101,110,109,97,120,46,99,111,109),v(112,108,110,107,114,46,99,111),v(104,111,116,106,97,114,46,99,111,109),v(119,101,98,112,97,99,107,98,105,110,46,99,111,109),v(97,114,99,104,105,118,101,46,111,114,103),v(99,111,100,101,115,97,110,100,98,111,120,46,105,111),v(99,115,98,46,97,112,112),v(115,116,97,99,107,98,108,105,116,122,46,99,111,109),v(115,116,97,99,107,98,108,105,116,122,46,105,111),v(99,111,100,105,101,114,46,105,111),v(109,111,116,105,111,110,116,114,105,99,107,115,46,99,111,109),v(115,116,97,99,107,111,118,101,114,102,108,111,119,46,99,111,109),v(115,116,97,99,107,101,120,99,104,97,110,103,101,46,99,111,109),v(115,116,117,100,105,111,102,114,101,105,103,104,116,46,99,111,109),v(119,101,98,99,111,110,116,97,105,110,101,114,46,105,111),v(106,115,102,105,100,100,108,101,46,110,101,116)],P=function(){if($){if("loading"===document.readyState||"interactive"===document.readyState)document.addEventListener("readystatechange",P);else{document.removeEventListener("readystatechange",P);var _="object"==typeof e?e:$&&window.gsap;$&&window.console&&!window._gsapWarned&&"object"==typeof _&&!1!==_.config().trialWarn&&(console.log(v(37,99,87,97,114,110,105,110,103),v(102,111,110,116,45,115,105,122,101,58,51,48,112,120,59,99,111,108,111,114,58,114,101,100,59)),console.log(v(65,32,116,114,105,97,108,32,118,101,114,115,105,111,110,32,111,102,32)+"ScrollSmoother"+v(32,105,115,32,108,111,97,100,101,100,32,116,104,97,116,32,111,110,108,121,32,119,111,114,107,115,32,108,111,99,97,108,108,121,32,97,110,100,32,111,110,32,100,111,109,97,105,110,115,32,108,105,107,101,32,99,111,100,101,112,101,110,46,105,111,32,97,110,100,32,99,111,100,101,115,97,110,100,98,111,120,46,105,111,46,32,42,42,42,32,68,79,32,78,79,84,32,68,69,80,76,79,89,32,84,72,73,83,32,70,73,76,69,32,42,42,42,32,76,111,97,100,105,110,103,32,105,116,32,111,110,32,97,110,32,117,110,97,117,116,104,111,114,105,122,101,100,32,115,105,116,101,32,118,105,111,108,97,116,101,115,32,116,104,101,32,108,105,99,101,110,115,101,32,97,110,100,32,119,105,108,108,32,99,97,117,115,101,32,97,32,114,101,100,105,114,101,99,116,46,32,80,108,101,97,115,101,32,106,111,105,110,32,67,108,117,98,32,71,114,101,101,110,83,111,99,107,32,116,111,32,103,101,116,32,102,117,108,108,32,97,99,99,101,115,115,32,116,111,32,116,104,101,32,98,111,110,117,115,32,112,108,117,103,105,110,115,32,116,104,97,116,32,98,111,111,115,116,32,121,111,117,114,32,97,110,105,109,97,116,105,111,110,32,115,117,112,101,114,112,111,119,101,114,115,46,32,68,105,115,97,98,108,101,32,116,104,105,115,32,119,97,114,110,105,110,103,32,119,105,116,104,32,103,115,97,112,46,99,111,110,102,105,103,40,123,116,114,105,97,108,87,97,114,110,58,32,102,97,108,115,101,125,41,59)),console.log(v(37,99,71,101,116,32,117,110,114,101,115,116,114,105,99,116,101,100,32,102,105,108,101,115,32,97,116,32,104,116,116,112,115,58,47,47,103,114,101,101,110,115,111,99,107,46,99,111,109,47,99,108,117,98),v(102,111,110,116,45,115,105,122,101,58,49,54,112,120,59,99,111,108,111,114,58,35,52,101,57,56,49,53)),window._gsapWarned=1)}}},k=E.length;for(setTimeout(P,50);--k>-1;)if(-1!==_.indexOf(E[k]))return!0;C||setTimeout(function(){$&&(window.location.href=v(104,116,116,112,115,58,47,47)+y+v(47,114,101,113,117,105,114,101,115,45,109,101,109,98,101,114,115,104,105,112,47)+"?plugin=ScrollSmoother&source=trial")},4e3)}("undefined"!=typeof window?window.location.host:""),_=>l.maxScroll(_||r)),T=_=>{let $=o.querySelector(".ScrollSmoother-wrapper");return $||(($=o.createElement("div")).classList.add("ScrollSmoother-wrapper"),_.parentNode.insertBefore($,_),$.appendChild(_)),$};class x{constructor(_){t||x.register(e)||console.warn("Please gsap.registerPlugin(ScrollSmoother)"),_=this.vars=_||{},c&&c.kill(),c=this,g(this);let $,C,E,P,k,R,A,L,z,H,N,B,O,I,U,V,{smoothTouch:W,onUpdate:D,onStop:j,smooth:q,onFocusIn:F,normalizeScroll:M,wholePixels:Y}=_,K=this,G=_.effectsPrefix||"",J=l.getScrollFunc(r),Q=1===l.isTouch?!0===W?.8:parseFloat(W)||0:0===q||!1===q?0:parseFloat(q)||.8,X=Q&&+_.speed||1,Z=0,__=0,_e=1,_t=h(0),_r=()=>_t.update(-Z),_$={y:0},_s=()=>$.style.overflow="visible",_o=_=>{_.update();let $=_.getTween();$&&($.pause(),$._time=$._dur,$._tTime=$._tDur),U=!1,_.animation.progress(_.progress,!0)},_i=(_,C)=>{(_!==Z&&!H||C)&&(Y&&(_=Math.round(_)),Q&&($.style.transform="matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, "+_+", 0, 1)",$._gsap.y=_+"px"),__=_-Z,Z=_,l.isUpdating||x.isRefreshing||l.update())},_n=function(_){return arguments.length?(_<0&&(_=0),_$.y=-_,U=!0,H?Z=-_:_i(-_),l.isRefreshing?P.update():J(_/X),this):-Z},_l="undefined"!=typeof ResizeObserver&&!1!==_.autoResize&&new ResizeObserver(()=>{if(!l.isRefreshing){let _=S(C)*X;_<-Z&&_n(_),p.restart(!0)}}),_a=_=>{C.scrollTop=0,_.target.contains&&_.target.contains(C)||F&&!1===F(this,_)||(l.isInViewport(_.target)||_.target===V||this.scrollTo(_.target,!1,"center center"),V=_.target)},_7=(_,$)=>{if(_<$.start)return _;let C=isNaN($.ratio)?1:$.ratio,E=$.end-$.start,P=_-$.start,k=$.offset||0,R=$.pins||[],A=R.offset||0,L=$._startClamp&&$.start<=0||$.pins&&$.pins.offset?0:$._endClamp&&$.end===S()?1:.5;return R.forEach($=>{E-=$.distance,$.nativeStart<=_&&(P-=$.distance)}),A&&(P*=(E-A/C)/E),_+(P-k*L)/C-P},_c=(_,$,C)=>{C||(_.pins.length=_.pins.offset=0);let E,P,k,R,A,L,z,H,N=_.pins,B=_.markers;for(z=0;z<$.length;z++)if(H=$[z],_.trigger&&H.trigger&&_!==H&&(H.trigger===_.trigger||H.pinnedContainer===_.trigger||_.trigger.contains(H.trigger))&&(A=H._startNative||H._startClamp||H.start,L=H._endNative||H._endClamp||H.end,k=_7(A,_),R=H.pin&&L>0?k+(L-A):_7(L,_),H.setPositions(k,R,!0,(H._startClamp?Math.max(0,k):k)-A),H.markerStart&&B.push(e.quickSetter([H.markerStart,H.markerEnd],"y","px")),H.pin&&H.end>0&&!C)){if(E=H.end-H.start,P=_._startClamp&&H.start<0){if(_.start>0)return _.setPositions(0,_.end+(_._startNative-_.start),!0),void _c(_,$);E+=H.start,N.offset=-H.start}N.push({start:H.start,nativeStart:A,end:H.end,distance:E,trig:H}),_.setPositions(_.start,_.end+(P?-H.start:E),!0)}},_d=(_,$)=>{k.forEach(C=>_c(C,_,$))},_f=()=>{s=o.documentElement,i=o.body,_s(),requestAnimationFrame(_s),k&&(l.getAll().forEach(_=>{_._startNative=_.start,_._endNative=_.end}),k.forEach(_=>{let $=_._startClamp||_.start,C=_.autoSpeed?Math.min(S(),_.end):$+Math.abs((_.end-$)/_.ratio),E=C-_.end;if(($-=E/2)>(C-=E/2)){let P=$;$=C,C=P}_._startClamp&&$<0?(E=(C=_.ratio<0?S():_.end/_.ratio)-_.end,$=0):(_.ratio<0||_._endClamp&&C>=S())&&(C=S(),$=_.ratio<0||_.ratio>1?0:C-(C-_.start)/_.ratio,E=(C-$)*_.ratio-(_.end-_.start)),_.offset=E||1e-4,_.pins.length=_.pins.offset=0,_.setPositions($,C,!0)}),_d(l.sort())),_t.reset()},_h=()=>l.addEventListener("refresh",_f),_g=()=>k&&k.forEach(_=>_.vars.onRefresh(_)),_p=()=>(k&&k.forEach(_=>_.vars.onRefreshInit(_)),_g),_0=(_,$,C,E)=>()=>{let P="function"==typeof $?$(C,E):$;P||0===P||(P=E.getAttribute("data-"+G+_)||("speed"===_?1:0)),E.setAttribute("data-"+G+_,P);let k="clamp("===(P+"").substr(0,6);return{clamp:k,value:k?P.substr(6,P.length-7):P}},_u=(_,$,E,P,R)=>{R=("function"==typeof R?R(P,_):R)||0;let A,L,z,H,N,B,O=_0("speed",$,P,_),I=_0("lag",E,P,_),U=e.getProperty(_,"y"),V=_._gsap,W=[],D=()=>{$=O(),E=parseFloat(I().value),A=parseFloat($.value)||1,N=(z="auto"===$.value)||L&&L._startClamp&&L.start<=0||W.offset?0:L&&L._endClamp&&L.end===S()?1:.5,H&&H.kill(),H=E&&e.to(_,{ease:d,overwrite:!1,y:"+=0",duration:E}),L&&(L.ratio=A,L.autoSpeed=z)},j=()=>{V.y=U+"px",V.renderTransform(1),D()},q=[],F=0,M=$=>{if(z){j();let C=((_,$)=>{let C,E,P=_.parentNode||s,k=_.getBoundingClientRect(),R=P.getBoundingClientRect(),A=R.top-k.top,L=R.bottom-k.bottom,z=(Math.abs(A)>Math.abs(L)?A:L)/(1-$),H=-z*$;return z>0&&(E=.5==(C=R.height/(r.innerHeight+R.height))?2*R.height:2*Math.min(R.height,Math.abs(-z*C/(2*C-1)))*($||1),H+=$?-E*$:-E/2,z+=E),{change:z,offset:H}})(_,a(0,1,-$.start/($.end-$.start)));F=C.change,B=C.offset}else B=W.offset||0,F=($.end-$.start-B)*(1-A);W.forEach(_=>F-=_.distance*(1-A)),$.offset=F||.001,$.vars.onUpdate($),H&&H.progress(1)};return D(),(1!==A||z||H)&&(L=l.create({trigger:z?_.parentNode:_,start:()=>$.clamp?"clamp(top bottom+="+R+")":"top bottom+="+R,end:()=>$.value<0?"max":$.clamp?"clamp(bottom top-="+R+")":"bottom top-="+R,scroller:C,scrub:!0,refreshPriority:-999,onRefreshInit:j,onRefresh:M,onKill(_){let $=k.indexOf(_);$>=0&&k.splice($,1),j()},onUpdate(_){var $;let C,E,P,k=U+F*(_.progress-N),R=W.length,A=0;if(_.offset){if(R){for(E=-Z,P=_.end;R--;){if((C=W[R]).trig.isActive||E>=C.start&&E<=C.end)return void(H&&(C.trig.progress+=C.trig.direction<0?.001:-.001,C.trig.update(0,0,1),H.resetTo("y",parseFloat(V.y),-__,!0),_e&&H.progress(1)));E>C.end&&(A+=C.distance),P-=C.distance}k=U+A+F*((e.utils.clamp(_.start,_.end,E)-_.start-A)/(P-_.start)-N)}q.length&&!z&&q.forEach(_=>_(k-A)),k=Math.round(1e5*($=k+B))/1e5||0,H?(H.resetTo("y",k,-__,!0),_e&&H.progress(1)):(V.y=k+"px",V.renderTransform(1))}}}),M(L),e.core.getCache(L.trigger).stRevert=_p,L.startY=U,L.pins=W,L.markers=q,L.ratio=A,L.autoSpeed=z,_.style.willChange="transform"),L};function _3(){return E=$.clientHeight,$.style.overflow="visible",i.style.height=r.innerHeight+(E-r.innerHeight)/X+"px",E-r.innerHeight}_h(),l.addEventListener("killAll",_h),e.delayedCall(.5,()=>_e=0),this.scrollTop=_n,this.scrollTo=(_,$,C)=>{let E=e.utils.clamp(0,S(),isNaN(_)?this.offset(_,C,!!$&&!H):+_);$?H?e.to(this,{duration:Q,scrollTop:E,overwrite:"auto",ease:d}):J(E):_n(E)},this.offset=(_,$,C)=>{let E,P=(_=n(_)[0]).style.cssText,R=l.create({trigger:_,start:$||"top top"});return k&&(_e?l.refresh():_d([R],!0)),E=R.start/(C?X:1),R.kill(!1),_.style.cssText=P,e.core.getCache(_).uncache=1,E},this.content=function(_){if(arguments.length){let C=n(_||"#smooth-content")[0]||console.warn("ScrollSmoother needs a valid content element.")||i.children[0];return C!==$&&(z=($=C).getAttribute("style")||"",_l&&_l.observe($),e.set($,{overflow:"visible",width:"100%",boxSizing:"border-box",y:"+=0"}),Q||e.set($,{clearProps:"transform"})),this}return $},this.wrapper=function(_){return arguments.length?(L=(C=n(_||"#smooth-wrapper")[0]||T($)).getAttribute("style")||"",_3(),e.set(C,Q?{overflow:"hidden",position:"fixed",height:"100%",width:"100%",top:0,left:0,right:0,bottom:0}:{overflow:"visible",position:"relative",width:"100%",height:"auto",top:"auto",bottom:"auto",left:"auto",right:"auto"}),this):C},this.effects=(_,$)=>{if(k||(k=[]),!_)return k.slice(0);(_=n(_)).forEach(_=>{let $=k.length;for(;$--;)k[$].trigger===_&&k[$].kill()});let C,E,{speed:P,lag:R,effectsPadding:A}=$=$||{},L=[];for(C=0;C<_.length;C++)(E=_u(_[C],P,R,C,A))&&L.push(E);return k.push(...L),!1!==$.refresh&&l.refresh(),L},this.sections=(_,$)=>{if(R||(R=[]),!_)return R.slice(0);let C=n(_).map(_=>l.create({trigger:_,start:"top 120%",end:"bottom -20%",onToggle($){_.style.opacity=$.isActive?"1":"0",_.style.pointerEvents=$.isActive?"all":"none"}}));return $&&$.add?R.push(...C):R=C.slice(0),C},this.content(_.content),this.wrapper(_.wrapper),this.render=_=>_i(_||0===_?_:Z),this.getVelocity=()=>_t.getVelocity(-Z),l.scrollerProxy(C,{scrollTop:_n,scrollHeight:()=>_3()&&i.scrollHeight,fixedMarkers:!1!==_.fixedMarkers&&!!Q,content:$,getBoundingClientRect:()=>({top:0,left:0,width:r.innerWidth,height:r.innerHeight})}),l.defaults({scroller:C});let _2=l.getAll().filter(_=>_.scroller===r||_.scroller===C);_2.forEach(_=>_.revert(!0,!0)),P=l.create({animation:e.fromTo(_$,{y:()=>(I=0,0)},{y:()=>(I=1,-_3()),immediateRender:!1,ease:"none",data:"ScrollSmoother",duration:100,onUpdate:function(){if(I){let _=U;_&&(_o(P),_$.y=Z),_i(_$.y,_),_r(),D&&!H&&D(K)}}}),onRefreshInit(_){if(x.isRefreshing)return;if(x.isRefreshing=!0,k){let $=l.getAll().filter(_=>!!_.pin);k.forEach(_=>{_.vars.pinnedContainer||$.forEach($=>{if($.pin.contains(_.trigger)){let C=_.vars;C.pinnedContainer=$.pin,_.vars=null,_.init(C,_.animation)}})})}let E=_.getTween();O=E&&E._end>E._dp._time,B=Z,_$.y=0,Q&&(1===l.isTouch&&(C.style.position="absolute"),C.scrollTop=0,1===l.isTouch&&(C.style.position="fixed"))},onRefresh(_){_.animation.invalidate(),_.setPositions(_.start,_3()/X),O||_o(_),_$.y=-J()*X,_i(_$.y),_e||(O&&(U=!1),_.animation.progress(e.utils.clamp(0,1,-(B/X/_.end)))),O&&(_.progress-=.001,_.update()),x.isRefreshing=!1},id:"ScrollSmoother",scroller:r,invalidateOnRefresh:!0,start:0,refreshPriority:-9999,end:()=>_3()/X,onScrubComplete:()=>{_t.reset(),j&&j(this)},scrub:Q||!0}),this.smooth=function($){return arguments.length&&(X=(Q=$||0)&&+_.speed||1,P.scrubDuration($)),P.getTween()?P.getTween().duration():0},P.getTween()&&(P.getTween().vars.ease=_.ease||d),this.scrollTrigger=P,_.effects&&this.effects(!0===_.effects?"[data-"+G+"speed], [data-"+G+"lag]":_.effects,{effectsPadding:_.effectsPadding,refresh:!1}),_.sections&&this.sections(!0===_.sections?"[data-section]":_.sections),_2.forEach(_=>{_.vars.scroller=C,_.revert(!1,!0),_.init(_.vars,_.animation)}),this.paused=function(_,$){return arguments.length?(!!H!==_&&(_?(P.getTween()&&P.getTween().pause(),J(-Z/X),_t.reset(),(N=l.normalizeScroll())&&N.disable(),(H=l.observe({preventDefault:!0,type:"wheel,touch,scroll",debounce:!1,allowClicks:!0,onChangeY:()=>_n(-Z)})).nested=f(s,"wheel,touch,scroll",!0,!1!==$)):(H.nested.kill(),H.kill(),H=0,N&&N.enable(),P.progress=(-Z/X-P.start)/(P.end-P.start),_o(P))),this):!!H},this.kill=this.revert=()=>{this.paused(!1),_o(P),P.kill();let _=(k||[]).concat(R||[]),E=_.length;for(;E--;)_[E].kill();l.scrollerProxy(C),l.removeEventListener("killAll",_h),l.removeEventListener("refresh",_f),C.style.cssText=L,$.style.cssText=z;let H=l.defaults({});H&&H.scroller===C&&l.defaults({scroller:r}),this.normalizer&&l.normalizeScroll(!1),clearInterval(A),c=null,_l&&_l.disconnect(),i.style.removeProperty("height"),r.removeEventListener("focusin",_a)},this.refresh=(_,$)=>P.refresh(_,$),M&&(this.normalizer=l.normalizeScroll(!0===M?{debounce:!0,content:!Q&&$}:M)),l.config(_),"scrollBehavior"in r.getComputedStyle(i)&&e.set([i,s],{scrollBehavior:"auto"}),r.addEventListener("focusin",_a),A=setInterval(_r,250),"loading"===o.readyState||requestAnimationFrame(()=>l.refresh())}get progress(){return this.scrollTrigger?this.scrollTrigger.animation._time/100:0}static register(_){return t||(e=_||m(),u()&&window.document&&(r=window,s=(o=document).documentElement,i=o.body),e&&(n=e.utils.toArray,a=e.utils.clamp,d=e.parseEase("expo"),g=e.core.context||function(){},l=e.core.globals().ScrollTrigger,e.core.globals("ScrollSmoother",x),i&&l&&(p=e.delayedCall(.2,()=>l.isRefreshing||c&&c.refresh()).pause(),h=l.core._getVelocityProp,f=l.core._inputObserver,x.refresh=l.refresh,t=1))),t}}x.version="3.12.7",x.create=_=>c&&_&&c.content()===n(_.content)[0]?c:new x(_),x.get=()=>c,m()&&e.registerPlugin(x);export default x;export{x as ScrollSmoother};