@infinityfx/lively/dist/core/track.js

Feature complete, lightweight react animation library.

import{StyleCache as t}from"./cache.js";import{lengthToOffset as e,limitSmallestQuantity as s}from"./utils.js";class i{constructor(e,s,i){this.playing=0,this.active=[],this.queue=[],this.paused=!1,this.scale=[1,1],this.corrected={borderRadius:"",boxShadow:""},this.element=e,this.deform=s,this.cache=new t(e,i)}push(t){t.onfinish=this.next.bind(this),this.playing&&"none"===t.composite?(this.queue.push(t),t.animation.pause()):(this.active.push(t),"none"===t.composite&&this.playing++,this.paused&&t.animation.pause())}next(){this.cache.update(),--this.playing>0||(this.active=this.active.filter((t=>"running"===t.animation.playState)),this.active.push(...this.queue.splice(0,1)),this.playing=this.active.filter((t=>"none"===t.composite)).length,this.pause(!1),this.playing||this.correct())}clear(t){this.active.forEach((e=>{e.onfinish=null;try{t?e.commit||"combine"===e.composite||e.animation.cancel():e.animation.finish()}catch(t){e.animation.cancel()}})),t||(this.active=[],this.queue=[],this.playing=0),this.deform||(this.element.style.borderRadius="",this.element.style.boxShadow="",this.corrected.borderRadius=this.cache.data.borderRadius=this.cache.computed.borderRadius,this.corrected.boxShadow=this.cache.data.boxShadow=this.cache.computed.boxShadow,this.scale=[1,1])}pause(t){for(const e of this.active)e.animation[t?"pause":"play"]();this.paused=t}step(t){for(const e of this.active)e.step(t);!this.paused&&this.active.length&&this.correct()}transition(t,e){this.clear(!0);const s=this.cache.difference(t?.cache.data,e);this.cache.update(),t?.clear(),t?.cache.update(),s.forEach((t=>t.play(this,{commit:!1})))}apply(t,s){const i="strokeLength"===t;this.element.style[i?"strokeDashoffset":t]=i?e(s):s}decomposeScale(){const[t,e]=this.cache.computed.scale.split(" ");let i=parseFloat(t),a=e?parseFloat(e):i;return isNaN(i)&&(i=1),isNaN(a)&&(a=1),/%$/.test(t)&&(i/=100),/%$/.test(e)&&(a/=100),[s(i,1e-4),s(a,1e-4)]}correct(){if(this.deform)return;const t=this.cache.computed,e=t.borderRadius.split(/\s*\/\s*/);e.length<2&&(e[1]=e[0]);const s=t.boxShadow.split(/(?<=px),\s?/),[i,a,o]=s[0].split(/(?<=\))\s|\s(?=inset)/),h=t.borderRadius!==this.corrected.borderRadius?[1,1]:this.scale,c=t.boxShadow!==this.corrected.boxShadow?[1,1]:this.scale,[r,n]=this.scale=this.decomposeScale();if(this.element.style.borderRadius=e.map(((t,e)=>t.split(" ").map((t=>parseFloat(t)*h[e]/this.scale[e]+(t.match(/[^\d\.]+$/)?.[0]||"px"))).join(" "))).join("/"),this.corrected.borderRadius=t.borderRadius,a){const e=a.split(" ").map(parseFloat),s=+(r<n),h=s?n:r,l=Math.max(...c),p=new Array(3).fill([e[0]*c[0]/r,e[1]*c[1]/n,e[2]*l/h,e[3]*l/h]);p[1][0]-=s?1/r:0,p[1][1]-=s?0:1/n,p[2][0]+=s?1/r:0,p[2][1]+=s?0:1/n,this.element.style.boxShadow=p.map((t=>`${i} ${t.map((t=>`${t}px`)).join(" ")}${o?" inset":""}`)).join(", "),this.corrected.boxShadow=t.boxShadow}for(let t=0;t<this.element.children.length;t++){const e=this.element.children[t],s=e.offsetLeft,i=e.offsetTop,a=e.offsetWidth,o=e.offsetHeight,[h,c]=getComputedStyle(e).translate.split(" ").map(parseFloat);e.style.transform=`translate(${-h||0}px, ${-c||0}px) scale(${1/r}, ${1/n}) translate(${s*(1-r)+a/2*(1-r)+(h||0)}px, ${i*(1-n)+o/2*(1-n)+(c||0)}px)`}}}export{i as default};
//# sourceMappingURL=track.js.map