universalsmoothscroll
Version:
A cross-browser smooth-scrolling API which supports multiple and interruptable scroll-animations on all DOM's elements, even at the same time!
1 lines • 10.3 kB
JavaScript
;let DEFAULT_STEP_LENGTH_CALCULATOR=(e,r,t)=>{let n=new Map,E="function"==typeof t?t:()=>{};return(t,o,i,$,g,u,S)=>{E(t,o,i,$,g,u,S);let C=(i-o)/r;if(C>=1)return t;C<=0&&(n.set(S,1-t/$),C=.5*uss.getFramesTime(!0)/r);let U=n.get(S),I=(e(C)*(1-U)+U)*($-1);return Math.ceil(t-$+I)}},DEFAULT_BOUNCE_CUSTOMIZER=(e,r,t,n,E)=>{let o=1/E,i=.5*o,$=5e-4*o,g=e=>1-Math.pow(1-e,1.6),u=e=>e>.6?.35*e+.64:1-(1-e)*(1-e),S=10+(E-1)*5+1,C=0,U;if(1!==n)C=10+(n-1)*5;else{let I=(o-$)/10,_=o-2*$;for(U=0;U<_;U+=I)t(e,g(U),C,S),t(r,Math.pow(U*E,2),C,S),C++}for(U=n;U<E;U++){var T;let s=o*U,b=g(s),A=.005*b+.995,l=g(s+i),a=u(l),O=.65*a+.35*A;t(e,b,C,S),t(e,g(s+$),C+1,S),t(e,g(s+.35*i),C+2,S),t(e,l,C+3,S),t(e,g(s+1.65*i),C+4,S),t(r,A,C,S),t(r,A,C+1,S),t(r,O,C+2,S),t(r,a,C+3,S),t(r,O,C+4,S),C+=5}t(e,1,C,S),t(r,1,C,S)};export const CUSTOM_CUBIC_HERMITE_SPLINE=(e,r,t=0,n=500,E,o={debugString:"CUSTOM_CUBIC_HERMITE_SPLINE"})=>{if(!Array.isArray(e)){uss._errorLogger(o.debugString,"xs to be an array",e);return}if(!Array.isArray(r)){uss._errorLogger(o.debugString,"ys to be an array",r);return}if(e.length!==r.length){uss._errorLogger(o.debugString,"xs and ys to have the same length","xs.length = "+e.length+" and ys.length = "+r.length);return}if(!Number.isFinite(n)||n<=0){uss._errorLogger(o.debugString,"the duration to be a positive number",n);return}let i=!1,$=!1,g=null,u=e.length;for(let S=0;S<u;S++){if(!Number.isFinite(e[S])||e[S]<0||e[S]>1){uss._errorLogger(o.debugString,"xs["+S+"] to be a number between 0 and 1 (inclusive)",e[S]);return}if(!Number.isFinite(r[S])||r[S]<0||r[S]>1){uss._errorLogger(o.debugString,"ys["+S+"] to be a number between 0 and 1 (inclusive)",r[S]);return}if(!g||g<e[S])g=e[S];else{uss._errorLogger(o.debugString,"the xs array to be sorted",e[S].toFixed(2)+" (xs["+S+"]) after "+e[S-1].toFixed(2)+" (xs["+(S-1)+"])");return}i||(i=0===e[S]),$||($=1===e[S])}i||(e.unshift(0),r.unshift(0)),$||(e.push(1),r.push(1));let C=1-t,U=e.length-1,I=Math.round(.5*U);function _(t){let n=0,E=U,o=I,i;do{if(t>=e[o]&&t<=e[o+1]){i=(t-e[o])/(e[o+1]-e[o]);break}e[o]>t?(E=o,o=Math.floor((n+o)/2)):(n=o,o=Math.floor((E+o)/2))}while(n!==E);let $=2*i*i*i-3*i*i+1,g=i*i*i-2*i*i+i,u=-2*i*i*i+3*i*i,S=i*i*i-i*i,_=r[o-1]||r[0],T=r[o],s=r[o+1],b=r[o+2]||r[U],A=e[o-1]||e[0],l=e[o],a=e[o+1],O=e[o+2]||e[U];return $*T+g*(a-l)*(C*(s-_)/(a-A))+u*s+S*(a-l)*(C*(b-T)/(O-l))}return DEFAULT_STEP_LENGTH_CALCULATOR(_,n,E)};export const CUSTOM_BEZIER_CURVE=(e,r,t=500,n,E={debugString:"CUSTOM_BEZIER_CURVE"})=>{if(!Array.isArray(e)){uss._errorLogger(E.debugString,"xs to be an array",e);return}if(!Array.isArray(r)){uss._errorLogger(E.debugString,"ys to be an array",r);return}if(e.length!==r.length){uss._errorLogger(E.debugString,"xs and ys to have the same length","xs.length = "+e.length+" and ys.length = "+r.length);return}if(!Number.isFinite(t)||t<=0){uss._errorLogger(E.debugString,"the duration to be a positive number",t);return}let o=!1,i=!1,$=e.length;for(let g=0;g<$;g++){if(!Number.isFinite(e[g])||e[g]<0||e[g]>1){uss._errorLogger(E.debugString,"xs["+g+"] to be a number between 0 and 1 (inclusive)",e[g]);return}if(!Number.isFinite(r[g])||r[g]<0||r[g]>1){uss._errorLogger(E.debugString,"ys["+g+"] to be a number between 0 and 1 (inclusive)",r[g]);return}o||(o=0===e[g]),i||(i=1===e[g])}o||(e.unshift(0),r.unshift(0)),i||(e.push(1),r.push(1));let u=e.length-1,S=C(u);function C(e){let r=1;for(let t=1;t<=e;t++)r*=t;return r}function U(r){let t=0;for(let n=0;n<=u;n++)t+=S/(C(n)*C(u-n))*e[n]*Math.pow(1-r,u-n-1)*Math.pow(r,n-1)*(n-u*r);return t}function I(e,r){let t=0;for(let n=0;n<=u;n++)t+=S/(C(n)*C(u-n))*e[n]*Math.pow(1-r,u-n)*Math.pow(r,n);return t}function _(t){let n,E=t;do n=E,E-=(I(e,E)-t)/U(E);while(Math.abs(E-n)>.001);return I(r,E)}return DEFAULT_STEP_LENGTH_CALCULATOR(_,t,n)};export const CUSTOM_CUBIC_BEZIER=(e=0,r=0,t=1,n=1,E=500,o,i={debugString:"CUSTOM_CUBIC_BEZIER"})=>{if(!Number.isFinite(e)||e<0||e>1){uss._errorLogger(i.debugString,"x1 to be a number between 0 and 1 (inclusive)",e);return}if(!Number.isFinite(r)||r<0||r>1){uss._errorLogger(i.debugString,"y1 to be a number between 0 and 1 (inclusive)",r);return}if(!Number.isFinite(t)||t<0||t>1){uss._errorLogger(i.debugString,"x2 to be a number between 0 and 1 (inclusive)",t);return}if(!Number.isFinite(n)||n<0||n>1){uss._errorLogger(i.debugString,"y2 to be a number between 0 and 1 (inclusive)",n);return}if(!Number.isFinite(E)||E<=0){uss._errorLogger(i.debugString,"the duration to be a positive number",E);return}let $=1+3*(e-t),g=1+3*(r-n),u=3*(t-2*e),S=3*(n-2*r),C=3*e,U=3*r;function I(e){let r,t=e;do r=t,t-=(t*(C+t*(u+t*$))-e)/(C+t*(2*u+3*$*t));while(Math.abs(t-r)>.001);return t*(U+t*(S+t*g))}return DEFAULT_STEP_LENGTH_CALCULATOR(I,E,o)};export const EASE_LINEAR=(e,r)=>CUSTOM_CUBIC_BEZIER(0,0,1,1,e,r,{debugString:"EASE_LINEAR"});export const EASE_IN_SINE=(e,r)=>CUSTOM_CUBIC_BEZIER(.12,0,.39,0,e,r,{debugString:"EASE_IN_SINE"});export const EASE_IN_QUAD=(e,r)=>CUSTOM_CUBIC_BEZIER(.11,0,.5,0,e,r,{debugString:"EASE_IN_QUAD"});export const EASE_IN_CUBIC=(e,r)=>CUSTOM_CUBIC_BEZIER(.32,0,.67,0,e,r,{debugString:"EASE_IN_CUBIC"});export const EASE_IN_QUART=(e,r)=>CUSTOM_CUBIC_BEZIER(.5,0,.75,0,e,r,{debugString:"EASE_IN_QUART"});export const EASE_IN_QUINT=(e,r)=>CUSTOM_CUBIC_BEZIER(.64,0,.78,0,e,r,{debugString:"EASE_IN_QUINT"});export const EASE_IN_EXPO=(e,r)=>CUSTOM_CUBIC_BEZIER(.7,0,.84,0,e,r,{debugString:"EASE_IN_EXPO"});export const EASE_IN_CIRC=(e,r)=>CUSTOM_CUBIC_BEZIER(.55,0,1,.45,e,r,{debugString:"EASE_IN_CIRC"});export const EASE_OUT_SINE=(e,r)=>CUSTOM_CUBIC_BEZIER(.61,1,.88,1,e,r,{debugString:"EASE_OUT_SINE"});export const EASE_OUT_QUAD=(e,r)=>CUSTOM_CUBIC_BEZIER(.5,1,.89,1,e,r,{debugString:"EASE_OUT_QUAD"});export const EASE_OUT_CUBIC=(e,r)=>CUSTOM_CUBIC_BEZIER(.33,1,.68,1,e,r,{debugString:"EASE_OUT_CUBIC"});export const EASE_OUT_QUART=(e,r)=>CUSTOM_CUBIC_BEZIER(.25,1,.5,1,e,r,{debugString:"EASE_OUT_QUART"});export const EASE_OUT_QUINT=(e,r)=>CUSTOM_CUBIC_BEZIER(.22,1,.36,1,e,r,{debugString:"EASE_OUT_QUINT"});export const EASE_OUT_EXPO=(e,r)=>CUSTOM_CUBIC_BEZIER(.16,1,.3,1,e,r,{debugString:"EASE_OUT_EXPO"});export const EASE_OUT_CIRC=(e,r)=>CUSTOM_CUBIC_BEZIER(0,.55,.45,1,e,r,{debugString:"EASE_OUT_CIRC"});export const EASE_IN_OUT_SINE=(e,r)=>CUSTOM_CUBIC_BEZIER(.37,0,.63,1,e,r,{debugString:"EASE_IN_OUT_SINE"});export const EASE_IN_OUT_QUAD=(e,r)=>CUSTOM_CUBIC_BEZIER(.45,0,.55,1,e,r,{debugString:"EASE_IN_OUT_QUAD"});export const EASE_IN_OUT_CUBIC=(e,r)=>CUSTOM_CUBIC_BEZIER(.65,0,.35,1,e,r,{debugString:"EASE_IN_OUT_CUBIC"});export const EASE_IN_OUT_QUART=(e,r)=>CUSTOM_CUBIC_BEZIER(.76,0,.24,1,e,r,{debugString:"EASE_IN_OUT_QUART"});export const EASE_IN_OUT_QUINT=(e,r)=>CUSTOM_CUBIC_BEZIER(.83,0,.17,1,e,r,{debugString:"EASE_IN_OUT_QUINT"});export const EASE_IN_OUT_EXPO=(e,r)=>CUSTOM_CUBIC_BEZIER(.87,0,.13,1,e,r,{debugString:"EASE_IN_OUT_EXPO"});export const EASE_IN_OUT_CIRC=(e,r)=>CUSTOM_CUBIC_BEZIER(.85,0,.15,1,e,r,{debugString:"EASE_IN_OUT_CIRC"});export const EASE_IN_BOUNCE=(e=900,r,t=3)=>{if(!Number.isFinite(t)||t<=0){uss._errorLogger("EASE_IN_BOUNCE","bouncesNumber to be a positive number",t);return}let n=[],E=[],o=(e,r,t,n)=>e[n-t-1]=1-r;return DEFAULT_BOUNCE_CUSTOMIZER(n,E,o,1,t+1),CUSTOM_CUBIC_HERMITE_SPLINE(n,E,0,e,r,{debugString:"EASE_IN_BOUNCE"})};export const EASE_OUT_BOUNCE=(e=900,r,t=3)=>{if(!Number.isFinite(t)||t<=0){uss._errorLogger("EASE_OUT_BOUNCE","bouncesNumber to be a positive number",t);return}let n=[],E=[],o=(e,r,t)=>e[t]=r;return DEFAULT_BOUNCE_CUSTOMIZER(n,E,o,1,t+1),CUSTOM_CUBIC_HERMITE_SPLINE(n,E,0,e,r,{debugString:"EASE_OUT_BOUNCE"})};export const EASE_IN_OUT_BOUNCE=(e=1200,r,t=6)=>{if(!Number.isFinite(t)||t<=1){uss._errorLogger("EASE_IN_OUT_BOUNCE","bouncesNumber to be a number >= 2",t);return}if(2===t)return CUSTOM_CUBIC_HERMITE_SPLINE([0,.04,.14,.24,.3,.3001,.4,.6,.7,.7001,.76,.86,.96,1],[0,.07,.13,.07,1e-4,1e-4,.46,.64,.9999,.9999,.93,.87,.93,1],0,e,r,{debugString:"EASE_IN_OUT_BOUNCE"});let n=[],E=[],o=Math.max(Math.floor(.5*(t-1)),1),i=Math.max(Math.floor(.5*t),2),$=(e,r,t,n)=>e[n-t-1]=1-r,g=(e,r,t)=>e[t-2]=r;DEFAULT_BOUNCE_CUSTOMIZER(n,E,$,o,t),DEFAULT_BOUNCE_CUSTOMIZER(n,E,g,i,t);let u=10+(i-1)*5-3;return n[u-1]=.75*n[u]+.25*n[u+1],n[u]=.25*n[u]+.75*n[u+1],E[u-1]=.47,E[u]=.63,n.pop(),n.pop(),E.pop(),E.pop(),CUSTOM_CUBIC_HERMITE_SPLINE(n,E,0,e,r,{debugString:"EASE_IN_OUT_BOUNCE"})};export const EASE_ELASTIC_X=(e,r,t=()=>50,n=0)=>{if("function"!=typeof e){uss._errorLogger("EASE_ELASTIC_X","the forwardEasing to be a function",e);return}if("function"!=typeof r){uss._errorLogger("EASE_ELASTIC_X","the backwardEasing to be a function",r);return}if("function"!=typeof t){uss._errorLogger("EASE_ELASTIC_X","the elasticPointCalculator to be a function",t);return}if(!Number.isFinite(n)){uss._errorLogger("EASE_ELASTIC_X","the debounceTime to be a number",n);return}let E=null,o,i;function $($,g,u){let S=uss._containersData.get(u)||[];if(E===S[2]){E=null;return}if(o=e,E=null,!S[0])return;clearTimeout(i);let C="function"==typeof S[10]?S[10]:()=>{};S[10]=()=>{i=setTimeout(()=>{let e=u===window?window.scrollX:u.scrollLeft,n=S[4],i=t($,g,e,n,u);Number.isFinite(i)?0===i?C():(i>0&&(o=r),uss.scrollXTo(e-i*n,u,C,!1),E=uss._containersData.get(u)[2]):(uss._warningLogger(i,"is not a valid elastic amount"),C())},n)}}return(e,r,t,n,E,i,g)=>(r===t&&$(r,t,g),o(e,r,t,n,E,i,g))};export const EASE_ELASTIC_Y=(e,r,t=()=>50,n=0)=>{if("function"!=typeof e){uss._errorLogger("EASE_ELASTIC_Y","the forwardEasing to be a function",e);return}if("function"!=typeof r){uss._errorLogger("EASE_ELASTIC_Y","the backwardEasing to be a function",r);return}if("function"!=typeof t){uss._errorLogger("EASE_ELASTIC_Y","the elasticPointCalculator to be a function",t);return}if(!Number.isFinite(n)){uss._errorLogger("EASE_ELASTIC_Y","the debounceTime to be a number",n);return}let E=null,o,i;function $($,g,u){let S=uss._containersData.get(u)||[];if(E===S[3]){E=null;return}if(o=e,E=null,!S[1])return;clearTimeout(i);let C="function"==typeof S[11]?S[11]:()=>{};S[11]=()=>{i=setTimeout(()=>{let e=u===window?window.scrollY:u.scrollTop,n=S[5],i=t($,g,e,n,u);Number.isFinite(i)?0===i?C():(i>0&&(o=r),uss.scrollYTo(e-i*n,u,C,!1),E=uss._containersData.get(u)[3]):(uss._warningLogger(i,"is not a valid elastic amount"),C())},n)}}return(e,r,t,n,E,i,g)=>(r===t&&$(r,t,g),o(e,r,t,n,E,i,g))};