Build 533169stable
Module 404325
4,116 characters · in no known chunkDependencies
Source Raw
function(e,t,n){"use strict";n.d(t,{A:()=>G}),n(508300);var r=n(627968),i=n(64700),s=n(503698),a=n.n(s),o=n(827734),l=n(397927),u=n(765671),c=n(240147),d=n(998304),_=n(156962),f=n(539451);n(518950);var p=n(614108);let h=40,m=.5,E=294,g=45,A=1,I=4,T=6,S=24,y=2,v=4,N=[0,0,0,0,0],C=200;function R(e){let t;if(null==e)return;try{t=window.atob(e)}catch(e){return}let n=[];for(let e=0;e<t.length;e++)n[e]=t.charCodeAt(e)/255;return n}function O(e,t){if(null!=e&&null!=t){if(e.length<t){let n=t-e.length;return e.concat(Array(n).fill(0))}return(0,_.A)(e,t)}}function b(e){let t;return Math.floor(((t=e<=m?h:e>=g?E:(Math.min(e,g)-m)/(g-m)*(E-h)+h)+I)/T)*T-I}function D(e){if(null==e)return;let t=2*A+I;return Math.floor((e+I)/t)}function L(e,t,n,r,i){e.moveTo(t,n+i),e.lineTo(t,n+r-i),e.arc(t+i,n+r-i,i,Math.PI,0,!0),e.lineTo(t+2*i,n+i),e.arc(t+i,n+i,i,0,Math.PI,!0),e.closePath()}function w(e){let{showAll:t,currentTime:n,duration:r,numSegments:i}=e;return t?i:Math.max(0,Math.round(n/r*i))}function M(e){let{context:t,devicePixelRatio:n,canvasHeight:r,segmentValue:i,segmentIndex:s,constrainMin:a}=e,o=a?(S-y)*i+y:S*i;0===o||L(t,s*(2*A+I)*n,(r/2-o/2)*n,o*n,A*n)}function P(e,t){let n=i.useMemo(()=>R(e),[e]),r=i.useMemo(()=>D(t),[t]);return i.useMemo(()=>O(n??[],r)??N,[n,r])}function x(e,t,n){let[r,s]=i.useState(e),[a,o]=i.useState(e),l=i.useRef(a);return i.useLayoutEffect(()=>{l.current=a}),i.useLayoutEffect(()=>{s(l.current),o(e)},[e,t,n]),[r,a]}function k(e,t){let n=(0,l.rdh)(o.A.colors.BACKGROUND_MOD_MUTED).hex(),r=(0,l.rdh)(o.A.colors.INTERACTIVE_TEXT_DEFAULT).hex(),i=(0,l.rdh)(o.A.colors.INTERACTIVE_TEXT_ACTIVE).hex(),s=(0,l.rdh)(o.A.unsafe_rawColors.BRAND_430).hex(),a=(0,l.rdh)(o.A.unsafe_rawColors.WHITE).hex(),u=t?s:n,[c,d]=x(u,t,e),[_,f]=x(t?a:e?i:r,t,e),[p,h]=x(e?u:r,t,e);return{lastBackgroundFillColor:c,backgroundFillColor:d,lastActiveFillColor:_,activeFillColor:f,lastInactiveFillColor:p,inactiveFillColor:h}}function U(e,t,n,r){if(null==r)return[t,!1];let i=Math.min((n-r)/C,1);return 1===i?[t,!1]:[(0,d.De)(e,t,i),!0]}function G(e){let{className:t,waveform:n,currentTime:s,duration:o,played:l,playing:d,onDrag:_,onDragStart:h,onDragEnd:m}=e,{ref:E,width:g}=(0,u.Ay)(),A=i.useMemo(()=>b(o),[o]),I=i.useRef(void 0),T=P(n,g),y=i.useRef(l),N=i.useRef(d),R=i.useRef(null),O=window.devicePixelRatio,{lastBackgroundFillColor:D,backgroundFillColor:L,lastActiveFillColor:x,activeFillColor:G,lastInactiveFillColor:F,inactiveFillColor:V}=k(l,d),B={currentTime:s,duration:o,played:l},H=i.useRef(B);i.useEffect(()=>{H.current=B}),i.useEffect(()=>{let{currentTime:e,duration:t,played:n}=H.current,r=w({showAll:!n,currentTime:e,duration:t,numSegments:T.length});I.current=T.map((e,t)=>new f.A(t<r?e:0))},[T]),i.useEffect(()=>{let e=I.current;if(null==e)return;let t=w({showAll:!l,currentTime:s,duration:o,numSegments:T.length});for(let n=0;n<e.length;n++){let r=e[n];if(n<t){r.animateTo(T[n]);continue}r.reset()}},[T,s,o,l]),i.useEffect(()=>{let e=null;function t(n){let r=E.current,i=r?.getContext("2d"),s=I.current;if(null==r||null==i||null==s)return;let a=!1;(y.current!==l||N.current!==d)&&(y.current=l,N.current=d,R.current=n),null!=R.current&&n>R.current+C&&(R.current=null);let o=r.height/O;i.clearRect(0,0,r.width,r.height),i.beginPath();let[u,c]=U(D,L,n,R.current);a=a||c,i.fillStyle=u;for(let e=0;e<T.length;e++)M({context:i,devicePixelRatio:O,canvasHeight:o,segmentValue:T[e],segmentIndex:e,constrainMin:!0});i.fill();let[_,f]=U(F,V,n,R.current);a=a||f;let[p,h]=U(x,G,n,R.current);a=a||h;for(let e=0;e<s.length;e++){let t=s[e],n=Math.max(t.getCurrentValue(),T[e]-.1);i.beginPath(),i.fillStyle=t.isReset?_:p,M({context:i,devicePixelRatio:O,canvasHeight:o,segmentValue:n,segmentIndex:e,constrainMin:!t.isReset}),a=a||t.isAnimating(),i.fill()}a&&(e=requestAnimationFrame(t))}return e=requestAnimationFrame(t),()=>{null!=e&&cancelAnimationFrame(e)}},[E,O,T,g,s,o,l,d,D,L,x,G,F,V]);let[,j]=(0,c.A)({ref:E,onDrag:_,onDragStart:h,onDragEnd:m});return(0,r.jsx)("canvas",{onMouseDown:j,className:a()(p.J,t),style:{width:A},ref:E,height:(S+2*v)*window.devicePixelRatio,width:(g??0)*window.devicePixelRatio})}}