alrdy-animate
Version:
A library to handle animations on scroll with GSAP integration.
2 lines • 14.4 kB
JavaScript
/*! For license information please see gsap-text.67f9bb4363e0891d9e8f.js.LICENSE.txt */
;(this.webpackChunkAlrdyAnimate=this.webpackChunkAlrdyAnimate||[]).push([[478],{646:(t,e,i)=>{function n(t){return n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},n(t)}function r(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,n)}return i}function l(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?r(Object(i),!0).forEach((function(e){o(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):r(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function o(t,e,i){return(e=function(t){var e=function(t){if("object"!=n(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,"string");if("object"!=n(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==n(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function a(t){var e={duration:.5,stagger:.1,ease:"back.out"},i=1.2,n=.3,r="circ.out",o={duration:1,stagger:.08,ease:"power2.inOut"},a={duration:.4,stagger:.02,ease:"ease-out"};function s(e,i){return function(n,r,o,a,s,u){return function(e,i,n,r,o,a,s){var u={duration:n,ease:a,delay:o,onStart:function(){e.hasAttribute("aa-scrub")||t.set(e,{visibility:"visible"})}};return"lines&words"===i?{onSplit:function(e){var i=t.timeline();return e.lines.forEach((function(t,n){var o=e.words.filter((function(e){return t.contains(e)}));i.from(o,l(l(l({},u),s),{},{stagger:r}),n*r*3)})),i}}:"lines&chars"===i?{onSplit:function(e){var i=t.timeline();return e.lines.forEach((function(t,n){var o=e.chars.filter((function(e){return t.contains(e)}));i.from(o,l(l(l({},u),s),{},{stagger:r}),n*r*6)})),i}}:{onSplit:function(e){var n=t.timeline(),o=e[i.split("-")[0].split("|")[0]];return e._groups?e._groups.forEach((function(t,e){n.from(t,l(l(l({},u),s),{},{stagger:0}),e*r)})):n.from(o,l(l(l({},u),s),{},{stagger:r})),n}}}(n,r,null!=o?o:i.duration,null!=a?a:i.stagger,s,null!=u?u:i.ease,e)}}function u(e){var i={left:{initialClip:"inset(0% 0% 0% 100%)",revealClip:"inset(0% 0% 0% 0%)",hideClip:"inset(0% 100% 0% 0%)",textInit:{x:"0.6em",y:0},textFinal:{x:0,y:0}},right:{initialClip:"inset(0% 100% 0% 0%)",revealClip:"inset(0% 0% 0% 0%)",hideClip:"inset(0% 0% 0% 100%)",textInit:{x:"-0.6em",y:0},textFinal:{x:0,y:0}},up:{initialClip:"inset(100% 0% 0% 0%)",revealClip:"inset(0% 0% 0% 0%)",hideClip:"inset(0% 0% 100% 0%)",textInit:{x:0,y:"0.6em"},textFinal:{x:0,y:0}},down:{initialClip:"inset(0% 0% 100% 0%)",revealClip:"inset(0% 0% 0% 0%)",hideClip:"inset(100% 0% 0% 0%)",textInit:{x:0,y:"-0.6em"},textFinal:{x:0,y:0}}};return function(n,r,o,a,s,u){return{onSplit:function(r){var c=t.timeline({delay:s}),p=n.getAttribute("aa-color")||"#000000",d=i[e],h=d.initialClip,f=d.revealClip,m=d.hideClip,g=d.textInit,y=d.textFinal;return r.lines.forEach((function(e,i){var n=document.createElement("div");n.className="aa-block-bg",n.style.backgroundColor=p;var r=e.innerHTML,s=document.createElement("div");s.className="aa-block-text",s.innerHTML=r,e.innerHTML="",e.appendChild(n),e.appendChild(s),t.set(n,{clipPath:h}),t.set(s,l({opacity:0},g));var d=.4*o,b=.6*o,v=.4*o,x=t.timeline();x.to(n,{clipPath:f,duration:d,ease:u}).to(n,{clipPath:m,duration:b,ease:u}).to(s,l(l({opacity:1},y),{},{duration:v,ease:u}),"<"),c.add(x,i*(null!=a?a:0))})),c}}}}return{text:{"text-slide-up":s({y:"110%",opacity:0},e),"text-slide-down":s({y:"-110%",opacity:0},e),"text-slide-left":s({x:"100vw",opacity:0},e),"text-tilt-up":s({y:"110%",opacity:0,rotation:10,transformOrigin:"bottom left"},e),"text-tilt-down":s({y:"-110%",opacity:0,rotation:-10,transformOrigin:"top left"},e),"text-scale-up":s({y:"120%",opacity:0,scale:.9,transformOrigin:"left center"},e),"text-fade-30":s({opacity:.3},o),"text-fade-10":s({opacity:.1},o),"text-fade":s({opacity:0},o),"text-blur":s({opacity:0,filter:"blur(10px)"},a),"text-blur-left":s({opacity:0,filter:"blur(10px)",x:30},a),"text-blur-right":s({opacity:0,filter:"blur(10px)",x:-30},a),"text-blur-up":s({opacity:0,filter:"blur(10px)",y:"110%"},a),"text-blur-down":s({opacity:0,filter:"blur(10px)",y:"-110%"},a),"text-block-left":u("left"),"text-block-right":u("right"),"text-block-up":u("up"),"text-block-down":u("down"),"text-rotate-soft":function(e,l,o,a,s,u){return{onSplit:function(l){var c=t.timeline();if(!l.lines||0===l.lines.length)return c;var p=5*parseFloat(window.getComputedStyle(e).fontSize);return l.lines.forEach((function(t){var e=document.createElement("div");e.classList.add("line-perspective-wrapper"),t.parentNode.insertBefore(e,t),e.appendChild(t)})),c.set(".line-perspective-wrapper",{transformStyle:"preserve-3d",perspective:p}).set(l.lines,{transformOrigin:"50% 0%"}),c.from(l.lines,{autoAlpha:0,rotateX:-90,y:"100%",scaleX:.75,duration:null!=o?o:i,stagger:null!=a?a:n,ease:null!=u?u:r,delay:s,onStart:function(){e.hasAttribute("aa-scrub")||t.set(e,{visibility:"visible"})}}),c}}}}}}i.r(e),i.d(e,{createTextAnimations:()=>a})},321:(t,e,i)=>{function n(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var i=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=i){var n,r,l,o,a=[],s=!0,u=!1;try{if(l=(i=i.call(t)).next,0===e){if(Object(i)!==i)return;s=!1}else for(;!(s=(n=l.call(i)).done)&&(a.push(n.value),a.length!==e);s=!0);}catch(t){u=!0,r=t}finally{try{if(!s&&null!=i.return&&(o=i.return(),Object(o)!==o))return}finally{if(u)throw r}}return a}}(t,e)||function(t,e){if(t){if("string"==typeof t)return r(t,e);var i={}.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?r(t,e):void 0}}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,n=Array(e);i<e;i++)n[i]=t[i];return n}function l(t,e){var i,r=arguments.length>2&&void 0!==arguments[2]&&arguments[2],l=arguments.length>3?arguments[3]:void 0,o=arguments.length>4?arguments[4]:void 0,a=n((null==e?void 0:e.split("|"))||[],2),s=a[0],u=a[1],c={"lines&words":{type:"words,lines"},"lines&chars":{type:"chars,lines"},chars:{type:"chars,lines"},words:{type:"words,lines"},lines:{type:"lines"}},p=(null===(i=Object.entries(c).find((function(t){var e=n(t,1)[0];return null==s?void 0:s.startsWith(e)})))||void 0===i?void 0:i[1])||c.lines;p.aria=r?"hidden":"auto";var d=["-clip","-lines","-words","-chars"].find((function(t){return o.includes(t)}));if(d){var h="-clip"===d?"lines":d.substring(1);p.mask=h}return p.autoSplit=!0,p.linesClass="aa-line",l&&(p.onSplit=function(t){if(u){for(var e=t[s.split("-")[0]],i=e.length-1;i>0;i--){var n=Math.floor(Math.random()*(i+1)),r=[e[n],e[i]];e[i]=r[0],e[n]=r[1]}if(!isNaN(parseInt(u))){var o=parseInt(u),a=Math.ceil(e.length/o);t._groups=Array.from({length:o},(function(t,i){return e.slice(i*a,(i+1)*a)}))}}var c=l(t);return t.timeline=c,c}),{splitInstance:new SplitText(t,p)}}i.r(e),i.d(e,{splitText:()=>l})},373:(t,e,i)=>{i.r(e),i.d(e,{SplitText:()=>x,default:()=>x});let n,r,l,o="undefined"!=typeof Intl?new Intl.Segmenter:0,a=t=>"string"==typeof t?a(document.querySelectorAll(t)):"length"in t?Array.from(t):[t],s=t=>a(t).filter((t=>t instanceof HTMLElement)),u=[],c=function(){},p=/\s+/g,d=new RegExp("\\p{RI}\\p{RI}|\\p{Emoji}(\\p{EMod}|\\u{FE0F}\\u{20E3}?|[\\u{E0020}-\\u{E007E}]+\\u{E007F})?(\\u{200D}\\p{Emoji}(\\p{EMod}|\\u{FE0F}\\u{20E3}?|[\\u{E0020}-\\u{E007E}]+\\u{E007F})?)*|.","gu"),h={left:0,top:0,width:0,height:0},f=(t,e)=>{if(e){let i,n,r,l,o=new Set(t.join("").match(e)||u),a=t.length;if(o.size)for(;--a>-1;)for(r of(n=t[a],o))if(r.startsWith(n)&&r.length>n.length){for(i=0,l=n;r.startsWith(l+=t[a+ ++i])&&l.length<r.length;);if(i&&l.length===r.length){t[a]=r,t.splice(a+1,i);break}}}return t},m=t=>"inline"===window.getComputedStyle(t).display&&(t.style.display="inline-block"),g=(t,e,i)=>e.insertBefore("string"==typeof t?document.createTextNode(t):t,i),y=(t,e,i)=>{let n=e[t+"sClass"]||"",{tag:r="div",aria:l="auto",propIndex:o=!1}=e,a="line"===t?"block":"inline-block",s=n.indexOf("++")>-1,u=e=>{let u=document.createElement(r),c=i.length+1;return n&&(u.className=n+(s?" "+n+c:"")),o&&u.style.setProperty("--"+t,c+""),"none"!==l&&u.setAttribute("aria-hidden","true"),"span"!==r&&(u.style.position="relative",u.style.display=a),u.textContent=e,i.push(u),u};return s&&(n=n.replace("++","")),u.collection=i,u},b=(t,e,i,n,r,l,a,s,c,d)=>{var h;let y,v,x,w,C,S,E,O,A,T,j,k,N,I,P,F,M,R,W=Array.from(t.childNodes),_=0,{wordDelimiter:L,reduceWhiteSpace:B=!0,prepareText:H}=e,z=t.getBoundingClientRect(),D=z,X=!B&&"pre"===window.getComputedStyle(t).whiteSpace.substring(0,3),$=0,q=i.collection;for("object"==typeof L?(x=L.delimiter||L,v=L.replaceWith||""):v=""===L?"":L||" ",y=" "!==v;_<W.length;_++)if(w=W[_],3===w.nodeType){for(P=w.textContent||"",B?P=P.replace(p," "):X&&(P=P.replace(/\n/g,v+"\n")),H&&(P=H(P,t)),w.textContent=P,C=v||x?P.split(x||v):P.match(s)||u,M=C[C.length-1],O=y?" "===M.slice(-1):!M,M||C.pop(),D=z,E=y?" "===C[0].charAt(0):!C[0],E&&g(" ",t,w),C[0]||C.shift(),f(C,c),l&&d||(w.textContent=""),A=1;A<=C.length;A++)if(F=C[A-1],!B&&X&&"\n"===F.charAt(0)&&(null==(h=w.previousSibling)||h.remove(),g(document.createElement("br"),t,w),F=F.slice(1)),B||""!==F)if(" "===F)t.insertBefore(document.createTextNode(" "),w);else{if(y&&" "===F.charAt(0)&&g(" ",t,w),$&&1===A&&!E&&q.indexOf($.parentNode)>-1?(S=q[q.length-1],S.appendChild(document.createTextNode(n?"":F))):(S=i(n?"":F),g(S,t,w),$&&1===A&&!E&&S.insertBefore($,S.firstChild)),n)for(j=o?f([...o.segment(F)].map((t=>t.segment)),c):F.match(s)||u,R=0;R<j.length;R++)S.appendChild(" "===j[R]?document.createTextNode(" "):n(j[R]));if(l&&d){if(P=w.textContent=P.substring(F.length+1,P.length),T=S.getBoundingClientRect(),T.top>D.top&&T.left<=D.left){for(k=t.cloneNode(),N=t.childNodes[0];N&&N!==S;)I=N,N=N.nextSibling,k.appendChild(I);t.parentNode.insertBefore(k,t),r&&m(k)}D=T}(A<C.length||O)&&g(A>=C.length?" ":y&&" "===F.slice(-1)?" "+v:v,t,w)}else g(v,t,w);t.removeChild(w),$=0}else 1===w.nodeType&&(a&&a.indexOf(w)>-1?(q.indexOf(w.previousSibling)>-1&&q[q.length-1].appendChild(w),$=w):(b(w,e,i,n,r,l,a,s,c,!0),$=0),r&&m(w))};const v=class t{constructor(t,e){this.isSplit=!1,l||x.register(window.gsap),this.elements=s(t),this.chars=[],this.words=[],this.lines=[],this.masks=[],this.vars=e,this._split=()=>this.isSplit&&this.split(this.vars);let i,n=[],r=()=>{let t,e=n.length;for(;e--;){t=n[e];let i=t.element.offsetWidth;if(i!==t.width)return t.width=i,void this._split()}};this._data={orig:n,obs:"undefined"!=typeof ResizeObserver&&new ResizeObserver((()=>{clearTimeout(i),i=setTimeout(r,200)}))},c(this),this.split(e)}split(t){this.isSplit&&this.revert(),this.vars=t=t||this.vars||{};let e,{type:i="chars,words,lines",aria:n="auto",deepSlice:l=!0,smartWrap:o,onSplit:u,autoSplit:c=!1,specialChars:p,mask:f}=this.vars,m=i.indexOf("lines")>-1,g=i.indexOf("chars")>-1,v=i.indexOf("words")>-1,x=g&&!v&&!m,w=p&&("push"in p?new RegExp("(?:"+p.join("|")+")","gu"):p),C=w?new RegExp(w.source+"|"+d.source,"gu"):d,S=!!t.ignore&&s(t.ignore),{orig:E,animTime:O,obs:A}=this._data;return(g||v||m)&&(this.elements.forEach(((e,i)=>{E[i]={element:e,html:e.innerHTML,ariaL:e.getAttribute("aria-label"),ariaH:e.getAttribute("aria-hidden")},"auto"===n?e.setAttribute("aria-label",(e.textContent||"").trim()):"hidden"===n&&e.setAttribute("aria-hidden","true");let r,s,u,c,p=[],d=[],f=[],O=g?y("char",t,p):null,A=y("word",t,d);if(b(e,t,A,O,x,l&&(m||x),S,C,w,!1),m){let i,n=a(e.childNodes),l=((t,e,i,n)=>{let r=y("line",i,n),l=window.getComputedStyle(t).textAlign||"left";return(i,n)=>{let o=r("");for(o.style.textAlign=l,t.insertBefore(o,e[i]);i<n;i++)o.appendChild(e[i]);o.normalize()}})(e,n,t,f),o=[],s=0,u=n.map((t=>1===t.nodeType?t.getBoundingClientRect():h)),c=h;for(r=0;r<n.length;r++)i=n[r],1===i.nodeType&&("BR"===i.nodeName?(o.push(i),l(s,r+1),s=r+1,c=u[s]):(r&&u[r].top>c.top&&u[r].left<=c.left&&(l(s,r),s=r),c=u[r]));s<r&&l(s,r),o.forEach((t=>{var e;return null==(e=t.parentNode)?void 0:e.removeChild(t)}))}if(!v){for(r=0;r<d.length;r++)if(s=d[r],g||!s.nextSibling||3!==s.nextSibling.nodeType)if(o&&!m){for(u=document.createElement("span"),u.style.whiteSpace="nowrap";s.firstChild;)u.appendChild(s.firstChild);s.replaceWith(u)}else s.replaceWith(...s.childNodes);else c=s.nextSibling,c&&3===c.nodeType&&(c.textContent=(s.textContent||"")+(c.textContent||""),s.remove());d.length=0,e.normalize()}this.lines.push(...f),this.words.push(...d),this.chars.push(...p)})),f&&this[f]&&this.masks.push(...this[f].map((t=>{let e=t.cloneNode();return t.replaceWith(e),e.appendChild(t),t.className&&(e.className=t.className.replace(/(\b\w+\b)/g,"$1-mask")),e.style.overflow="clip",e})))),this.isSplit=!0,r&&(c?r.addEventListener("loadingdone",this._split):"loading"===r.status&&console.warn("SplitText called before fonts loaded")),(e=u&&u(this))&&e.totalTime&&(this._data.anim=O?e.totalTime(O):e),m&&c&&this.elements.forEach(((t,e)=>{E[e].width=t.offsetWidth,A&&A.observe(t)})),this}revert(){var t,e;let{orig:i,anim:n,obs:l}=this._data;return l&&l.disconnect(),i.forEach((({element:t,html:e,ariaL:i,ariaH:n})=>{t.innerHTML=e,i?t.setAttribute("aria-label",i):t.removeAttribute("aria-label"),n?t.setAttribute("aria-hidden",n):t.removeAttribute("aria-hidden")})),this.chars.length=this.words.length=this.lines.length=i.length=this.masks.length=0,this.isSplit=!1,null==r||r.removeEventListener("loadingdone",this._split),n&&(this._data.animTime=n.totalTime(),n.revert()),null==(e=(t=this.vars).onRevert)||e.call(t,this),this}static create(e,i){return new t(e,i)}static register(t){n=n||t||window.gsap,n&&(a=n.utils.toArray,c=n.core.context||c),!l&&window.innerWidth>0&&(r=document.fonts,l=!0)}};v.version="3.13.0";let x=v}}]);