(function(p,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("@webav/av-cliper"),require("@webav/internal-utils")):typeof define=="function"&&define.amd?define(["exports","@webav/av-cliper","@webav/internal-utils"],u):(p=typeof globalThis<"u"?globalThis:p||self,u(p["av-canvas"]={},p.avCliper,p.internalUtils))})(this,function(p,u,y){"use strict";var je=Object.defineProperty;var pe=p=>{throw TypeError(p)};var Ye=(p,u,y)=>u in p?je(p,u,{enumerable:!0,configurable:!0,writable:!0,value:y}):p[u]=y;var K=(p,u,y)=>Ye(p,typeof u!="symbol"?u+"":u,y),de=(p,u,y)=>u.has(p)||pe("Cannot "+y);var i=(p,u,y)=>(de(p,u,"read from private field"),y?y.call(p):u.get(p)),g=(p,u,y)=>u.has(p)?pe("Cannot add the same private member more than once"):u instanceof WeakSet?u.add(p):u.set(p,y),A=(p,u,y,ee)=>(de(p,u,"write to private field"),ee?ee.call(p,y):u.set(p,y),y),j=(p,u,y)=>(de(p,u,"access private method"),y);var R,Y,X,q,M,x,E,_,G,J,H,Q,I,k,se,re,C,$,P,me,O,Z;const ee=["t","b","l","r","lt","lb","rt","rb","rotate"];function B(n){return document.createElement(n)}function be(n){let e=16;const o=new ResizeObserver(s=>{const r=s[0];r!=null&&(e=10/(r.contentRect.width/n.width))});o.observe(n);function t(s){const{w:r,h}=s,a=e,c=a/2,l=r/2,d=h/2,w=a*1.5,f=w/2;return{...s.fixedAspectRatio?{}:{t:new u.Rect(-c,-d-c,a,a,s),b:new u.Rect(-c,d-c,a,a,s),l:new u.Rect(-l-c,-c,a,a,s),r:new u.Rect(l-c,-c,a,a,s)},lt:new u.Rect(-l-c,-d-c,a,a,s),lb:new u.Rect(-l-c,d-c,a,a,s),rt:new u.Rect(l-c,-d-c,a,a,s),rb:new u.Rect(l-c,d-c,a,a,s),rotate:new u.Rect(-f,-d-a*2-f,w,w,s)}}return{rectCtrlsGetter:t,destroy:()=>{o.disconnect()}}}var U=(n=>(n.ActiveSpriteChange="activeSpriteChange",n.AddSprite="addSprite",n))(U||{});class ye{constructor(){g(this,R,[]);g(this,Y,null);g(this,X,new y.EventTool);K(this,"on",i(this,X).on);g(this,q,0)}get activeSprite(){return i(this,Y)}set activeSprite(e){e!==i(this,Y)&&(A(this,Y,e),i(this,X).emit("activeSpriteChange",e))}async addSprite(e){await e.ready,i(this,R).push(e),A(this,R,i(this,R).sort((o,t)=>o.zIndex-t.zIndex)),e.on("propsChange",o=>{o.zIndex!=null&&A(this,R,i(this,R).sort((t,s)=>t.zIndex-s.zIndex))}),i(this,X).emit("addSprite",e)}removeSprite(e){i(this,Y)===e&&(this.activeSprite=null),A(this,R,i(this,R).filter(o=>o!==e)),e.destroy()}getSprites(e={time:!0}){return i(this,R).filter(o=>o.visible&&(e.time?i(this,q)>=o.time.offset&&i(this,q)<=o.time.offset+o.time.duration:!0))}updateRenderTime(e){A(this,q,e);const o=this.activeSprite;o!=null&&(e<o.time.offset||e>o.time.offset+o.time.duration)&&(this.activeSprite=null)}destroy(){i(this,X).destroy(),i(this,R).forEach(e=>e.destroy()),A(this,R,[])}}R=new WeakMap,Y=new WeakMap,X=new WeakMap,q=new WeakMap;function Se(n,e,o,t){const s={w:e.clientWidth/e.width,h:e.clientHeight/e.height},r=new ResizeObserver(()=>{s.w=e.clientWidth/e.width,s.h=e.clientHeight/e.height,o.activeSprite!=null&&ae(o.activeSprite,h,a,s,t)});r.observe(e);const{rectEl:h,ctrlsEl:a}=xe(n),c=o.on(U.ActiveSpriteChange,m=>{if(m==null){h.style.display="none";return}ae(m,h,a,s,t),h.style.display=""});let l=!1;const d=m=>{m.button===0&&(l=!0)},w=()=>{l=!1},f=()=>{!l||o.activeSprite==null||ae(o.activeSprite,h,a,s,t)};return e.addEventListener("mousedown",d),window.addEventListener("mouseup",w),window.addEventListener("mousemove",f),()=>{r.disconnect(),c(),h.remove(),e.removeEventListener("mousedown",d),window.removeEventListener("mouseup",w),window.removeEventListener("mousemove",f)}}function xe(n){const e=B("div");e.style.cssText=`
    position: absolute;
    pointer-events: none;
    border: 1px solid #eee;
    box-sizing: border-box;
    display: none;
  `;const o=Object.fromEntries(ee.map(t=>{const s=B("div");return s.style.cssText=`
        display: none;
        position: absolute;
        border: 1px solid #3ee; border-radius: 50%;
        box-sizing: border-box;
        background-color: #fff;
      `,[t,s]}));return Object.values(o).forEach(t=>e.appendChild(t)),n.appendChild(e),{rectEl:e,ctrlsEl:o}}function ae(n,e,o,t,s){const{x:r,y:h,w:a,h:c,angle:l}=n.rect;Object.assign(e.style,{left:`${r*t.w}px`,top:`${h*t.h}px`,width:`${a*t.w}px`,height:`${c*t.h}px`,rotate:`${l}rad`}),Object.entries(s(n.rect)).forEach(([d,{x:w,y:f,w:m,h:v}])=>{Object.assign(o[d].style,{display:"block",left:"50%",top:"50%",width:`${m*t.w}px`,height:`${v*t.h}px`,transform:`translate(${w*t.w}px, ${f*t.h}px)`})})}function ge(n,e,o){const t={w:n.clientWidth/n.width,h:n.clientHeight/n.height},s=new ResizeObserver(()=>{t.w=n.clientWidth/n.width,t.h=n.clientHeight/n.height});s.observe(n);const r=h=>{if(h.button!==0)return;const{offsetX:a,offsetY:c}=h,l=a/t.w,d=c/t.h;if(e.activeSprite!=null){const[w]=Object.entries(o(e.activeSprite.rect)).find(([,f])=>f.checkHit(l,d))??[];if(w!=null)return}e.activeSprite=e.getSprites().reverse().find(w=>w.visible&&w.rect.checkHit(l,d))??null};return n.addEventListener("mousedown",r),()=>{s.disconnect(),n.removeEventListener("mousedown",r)}}function ve(n,e,o,t){const s={w:n.clientWidth/n.width,h:n.clientHeight/n.height},r=new ResizeObserver(()=>{s.w=n.clientWidth/n.width,s.h=n.clientHeight/n.height});r.observe(n);let h=0,a=0,c=null;const l=ze(n,o);let d=null;const w=v=>{if(v.button!==0||e.activeSprite==null)return;d=e.activeSprite;const{offsetX:z,offsetY:T,clientX:S,clientY:b}=v;Le({rect:d.rect,offsetX:z,offsetY:T,clientX:S,clientY:b,cvsRatio:s,cvsEl:n,rectCtrlsGetter:t})||(c=d.rect.clone(),l.magneticEffect(d.rect.x,d.rect.y,d.rect),h=S,a=b,window.addEventListener("mousemove",f),window.addEventListener("mouseup",m))},f=v=>{if(d==null||c==null)return;const{clientX:z,clientY:T}=v;let S=c.x+(z-h)/s.w,b=c.y+(T-a)/s.h;ue(d.rect,n,l.magneticEffect(S,b,d.rect))};n.addEventListener("mousedown",w);const m=()=>{l.hide(),window.removeEventListener("mousemove",f),window.removeEventListener("mouseup",m)};return()=>{r.disconnect(),l.destroy(),m(),n.removeEventListener("mousedown",w)}}function Me({sprRect:n,startX:e,startY:o,ctrlKey:t,cvsRatio:s,cvsEl:r}){const h=n.clone(),a=l=>{const{clientX:d,clientY:w}=l,f=(d-e)/s.w,m=(w-o)/s.h,v=t.length===1?Ce:Te,{x:z,y:T,w:S,h:b}=h,F=Math.atan2(b,S),{incW:te,incH:ne,incS:N,rotateAngle:le}=v({deltaX:f,deltaY:m,angle:n.angle,ctrlKey:t,diagonalAngle:F}),L=10;let W=S,V=b,ie=h.fixedScaleCenter?te*2:te,oe=h.fixedScaleCenter?ne*2:ne,D=N;const fe=Math.sqrt(b**2+S**2),we=Math.sqrt((L*(b/S))**2+L**2);switch(t){case"l":W=Math.max(S+ie,L),D=Math.min(N,S-L);break;case"r":W=Math.max(S+ie,L),D=Math.max(N,L-S);break;case"b":V=Math.max(b+oe,L),D=Math.min(N,b-L);break;case"t":V=Math.max(b+oe,L),D=Math.max(N,L-b);break;case"lt":case"lb":W=Math.max(S+ie,L),V=W===L?b/S*W:b+oe,D=Math.min(N,fe-we);break;case"rt":case"rb":W=Math.max(S+ie,L),V=W===L?b/S*W:b+oe,D=Math.max(N,we-fe);break}let ce=z,he=T;if(h.fixedScaleCenter)ce=z+S/2-W/2,he=T+b/2-V/2;else{const Pe=D/2*Math.cos(le)+z+S/2,De=D/2*Math.sin(le)+T+b/2;ce=Pe-W/2,he=De-V/2}ue(n,r,{x:ce,y:he,w:W,h:V})},c=()=>{window.removeEventListener("mousemove",a),window.removeEventListener("mouseup",c)};window.addEventListener("mousemove",a),window.addEventListener("mouseup",c)}function Ce({deltaX:n,deltaY:e,angle:o,ctrlKey:t}){let s=0,r=0,h=0,a=o;return t==="l"||t==="r"?(s=n*Math.cos(o)+e*Math.sin(o),r=s*(t==="l"?-1:1)):(t==="t"||t==="b")&&(a=o-Math.PI/2,s=n*Math.cos(a)+e*Math.sin(a),h=s*(t==="b"?-1:1)),{incW:r,incH:h,incS:s,rotateAngle:a}}function Te({deltaX:n,deltaY:e,angle:o,ctrlKey:t,diagonalAngle:s}){const r=(t==="lt"||t==="rb"?1:-1)*s+o,h=n*Math.cos(r)+e*Math.sin(r),a=t==="lt"||t==="lb"?-1:1,c=h*Math.cos(s)*a,l=h*Math.sin(s)*a;return{incW:c,incH:l,incS:h,rotateAngle:r}}function Le({rect:n,cvsRatio:e,offsetX:o,offsetY:t,clientX:s,clientY:r,cvsEl:h,rectCtrlsGetter:a}){const c=o/e.w,l=t/e.h,[d]=Object.entries(a(n)).find(([,w])=>w.checkHit(c,l))??[];return d==null?!1:(d==="rotate"?Ae(n,Re(n.center,e,h)):Me({sprRect:n,ctrlKey:d,startX:s,startY:r,cvsRatio:e,cvsEl:h}),!0)}function Ae(n,e){const o=({clientX:s,clientY:r})=>{const h=s-e.x,a=r-e.y,c=Math.atan2(a,h)+Math.PI/2;n.angle=c},t=()=>{window.removeEventListener("mousemove",o),window.removeEventListener("mouseup",t)};window.addEventListener("mousemove",o),window.addEventListener("mouseup",t)}function Re(n,e,o){const t=n.x*e.w,s=n.y*e.h,{left:r,top:h}=o.getBoundingClientRect();return{x:t+r,y:s+h}}function ue(n,e,o){const t={x:n.x,y:n.y,w:n.w,h:n.h,...o},s=e.width*.05,r=e.height*.05;t.x<-t.w+s?t.x=-t.w+s:t.x>e.width-s&&(t.x=e.width-s),t.y<-t.h+r?t.y=-t.h+r:t.y>e.height-r&&(t.y=e.height-r),n.x=t.x,n.y=t.y,n.w=t.w,n.h=t.h}function ze(n,e){const o="display: none; position: absolute;",t={w:0,h:0,x:0,y:0},s={vertMiddle:{...t,h:100,x:50,ref:{prop:"x",val:({w:c})=>(n.width-c)/2}},horMiddle:{...t,w:100,y:50,ref:{prop:"y",val:({h:c})=>(n.height-c)/2}},top:{...t,w:100,ref:{prop:"y",val:()=>0}},bottom:{...t,w:100,y:100,ref:{prop:"y",val:({h:c})=>n.height-c}},left:{...t,h:100,ref:{prop:"x",val:()=>0}},right:{...t,h:100,x:100,ref:{prop:"x",val:({w:c})=>n.width-c}}},r=B("div");r.style.cssText=`
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    box-sizing: border-box;
  `;const h=Object.fromEntries(Object.entries(s).map(([c,{w:l,h:d,x:w,y:f}])=>{const m=B("div");return m.style.cssText=`
        ${o}
        border-${l>0?"top":"left"}: 1px solid #3ee;
        top: ${f}%; left: ${w}%;
        ${w===100?"margin-left: -1px":""};
        ${f===100?"margin-top: -1px":""};
        width: ${l}%; height: ${d}%;
      `,r.appendChild(m),[c,m]}));e.appendChild(r);const a=6/(900/n.width);return{magneticEffect(c,l,d){const w={x:c,y:l};let f,m={x:!1,y:!1};for(f in s){const{prop:v,val:z}=s[f].ref;if(m[v])continue;const T=z(d);Math.abs(d[v]-T)<=a&&Math.abs(d[v]-(v==="x"?c:l))<=a?(w[v]=T,h[f].style.display="block",m[v]=!0):h[f].style.display="none"}return w},hide(){Object.values(h).forEach(c=>c.style.display="none")},destroy(){r.remove()}}}function ke(n,e,o){const t={w:n.clientWidth/n.width,h:n.clientHeight/n.height},s=new ResizeObserver(()=>{t.w=n.clientWidth/n.width,t.h=n.clientHeight/n.height});s.observe(n);const r=n.style;let h=e.activeSprite;e.on(U.ActiveSpriteChange,m=>{h=m,m==null&&(r.cursor="")});let a=!1;const c=({offsetX:m,offsetY:v})=>{a=!0;const z=m/t.w,T=v/t.h;(h==null?void 0:h.rect.checkHit(z,T))===!0&&r.cursor===""&&(r.cursor="move")},l=()=>{a=!1},d=["ns-resize","nesw-resize","ew-resize","nwse-resize","ns-resize","nesw-resize","ew-resize","nwse-resize"],w={t:0,rt:1,r:2,rb:3,b:4,lb:5,l:6,lt:7},f=m=>{if(h==null||a)return;const{offsetX:v,offsetY:z}=m,T=v/t.w,S=z/t.h,[b]=Object.entries(o(h.rect)).find(([,F])=>F.checkHit(T,S))??[];if(b!=null){if(b==="rotate"){r.cursor="crosshair";return}const F=h.rect.angle,te=F<0?F+2*Math.PI:F,ne=(w[b]+Math.floor((te+Math.PI/8)/(Math.PI/4)))%8;r.cursor=d[ne];return}if(h.rect.checkHit(T,S)){r.cursor="move";return}r.cursor=""};return n.addEventListener("mousemove",f),n.addEventListener("mousedown",c),window.addEventListener("mouseup",l),()=>{s.disconnect(),n.removeEventListener("mousemove",f),n.removeEventListener("mousedown",c),window.removeEventListener("mouseup",l)}}const Oe={sampleRate:48e3,channelCount:2,codec:"mp4a.40.2"};function We(n){const e=B("canvas");return e.style.cssText=`
    width: 100%;
    height: 100%;
    display: block;
  `,e.width=n.width,e.height=n.height,e}class He{constructor(e,o){g(this,k);g(this,M);g(this,x);g(this,E);g(this,_,!1);g(this,G,[]);g(this,J);g(this,H,new y.EventTool);K(this,"on",i(this,H).on);g(this,Q);g(this,I,0);g(this,C,new AudioContext);g(this,$,i(this,C).createMediaStreamDestination());g(this,P,new Set);g(this,O,{start:0,end:0,step:0,audioPlayAt:0});g(this,Z,new WeakMap);K(this,"addSprite",async e=>{i(this,C).state==="suspended"&&i(this,C).resume().catch(u.Log.error);const o=e.getClip();if(o instanceof u.MediaStreamClip&&o.audioTrack!=null){const t=i(this,C).createMediaStreamSource(new MediaStream([o.audioTrack]));t.connect(i(this,$)),i(this,Z).set(e,t)}await i(this,x).addSprite(e)});K(this,"removeSprite",e=>{var o;(o=i(this,Z).get(e))==null||o.disconnect(),i(this,x).removeSprite(e)});A(this,Q,o),A(this,M,We(o));const t=i(this,M).getContext("2d",{alpha:!1});if(t==null)throw Error("canvas context is null");A(this,E,t);const s=B("div");s.style.cssText="width: 100%; height: 100%; position: relative; overflow: hidden;",s.appendChild(i(this,M)),e.appendChild(s),$e(i(this,C)).connect(i(this,$)),A(this,x,new ye);const{rectCtrlsGetter:r,destroy:h}=be(i(this,M));i(this,G).push(h,ge(i(this,M),i(this,x),r),ke(i(this,M),i(this,x),r),ve(i(this,M),i(this,x),s,r),Se(s,i(this,M),i(this,x),r),i(this,x).on(U.AddSprite,w=>{const{rect:f}=w;f.x===0&&f.y===0&&(f.x=(i(this,M).width-f.w)/2,f.y=(i(this,M).height-f.h)/2)}),y.EventTool.forwardEvent(i(this,x),i(this,H),[U.ActiveSpriteChange]));let a=i(this,I),c=performance.now(),l=0;const d=1e3/30;A(this,J,y.workerTimer(()=>{(performance.now()-c)/(d*l)<1||(l+=1,i(this,E).fillStyle=o.bgColor,i(this,E).fillRect(0,0,i(this,M).width,i(this,M).height),j(this,k,me).call(this),a!==i(this,I)&&(a=i(this,I),i(this,H).emit("timeupdate",Math.round(a))))},d))}play(e){const o=i(this,x).getSprites({time:!1}).map(s=>s.time.offset+s.time.duration),t=e.end??(o.length>0?Math.max(...o):1/0);if(e.start>=t||e.start<0)throw Error(`Invalid time parameter, ${JSON.stringify({start:e.start,end:t})}`);j(this,k,se).call(this,e.start),i(this,x).getSprites({time:!1}).forEach(s=>{const{offset:r,duration:h}=s.time,a=i(this,I)-r;s.preFrame(a>0&&a<h?a:0)}),i(this,O).start=e.start,i(this,O).end=t,i(this,O).step=(e.playbackRate??1)*(1e3/30)*1e3,i(this,C).resume(),i(this,O).audioPlayAt=0,i(this,H).emit("playing"),u.Log.info("AVCanvs play by:",i(this,O))}pause(){j(this,k,re).call(this)}previewFrame(e){j(this,k,se).call(this,e),j(this,k,re).call(this)}captureImage(){return i(this,M).toDataURL()}get activeSprite(){return i(this,x).activeSprite}set activeSprite(e){i(this,x).activeSprite=e}destroy(){var e;i(this,_)||(A(this,_,!0),i(this,C).close(),i(this,$).disconnect(),i(this,H).destroy(),i(this,J).call(this),(e=i(this,M).parentElement)==null||e.remove(),i(this,G).forEach(o=>o()),i(this,P).clear(),i(this,x).destroy())}captureStream(){i(this,C).state==="suspended"&&i(this,C).resume().catch(u.Log.error);const e=new MediaStream(i(this,M).captureStream().getTracks().concat(i(this,$).stream.getTracks()));return u.Log.info("AVCanvas.captureStream, tracks:",e.getTracks().map(o=>o.kind)),e}async createCombinator(e={}){u.Log.info("AVCanvas.createCombinator, opts:",e);const o=new u.Combinator({...i(this,Q),...e}),t=i(this,x).getSprites({time:!1});if(t.length===0)throw Error("No sprite added");for(const s of t){const r=new u.OffscreenSprite(s.getClip());r.time={...s.time},s.copyStateTo(r),await o.addSprite(r)}return o}}M=new WeakMap,x=new WeakMap,E=new WeakMap,_=new WeakMap,G=new WeakMap,J=new WeakMap,H=new WeakMap,Q=new WeakMap,I=new WeakMap,k=new WeakSet,se=function(e){A(this,I,e),i(this,x).updateRenderTime(e)},re=function(){const e=i(this,O).step!==0;i(this,O).step=0,e&&(i(this,H).emit("paused"),i(this,C).suspend());for(const o of i(this,P))o.stop(),o.disconnect();i(this,P).clear()},C=new WeakMap,$=new WeakMap,P=new WeakMap,me=function(){var c;const e=i(this,E);let o=i(this,I);const{start:t,end:s,step:r,audioPlayAt:h}=i(this,O);r!==0&&o>=t&&o<s?o+=r:j(this,k,re).call(this),j(this,k,se).call(this,o);const a=[];for(const l of i(this,x).getSprites()){e.save();const{audio:d}=l.render(e,o-l.time.offset);e.restore(),a.push(d)}if(e.resetTransform(),r!==0){const l=Math.max(i(this,C).currentTime,h),d=Ie(a,i(this,C));let w=0;for(const f of d)f.start(l),f.connect(i(this,C).destination),f.connect(i(this,$)),i(this,P).add(f),f.onended=()=>{f.disconnect(),i(this,P).delete(f)},w=Math.max(w,((c=f.buffer)==null?void 0:c.duration)??0);i(this,O).audioPlayAt=l+w}},O=new WeakMap,Z=new WeakMap;function Ie(n,e){const o=[];if(n.length===0)return o;for(const[t,s]of n){if(t==null||t.length<=0)continue;const r=e.createBuffer(2,t.length,Oe.sampleRate);r.copyToChannel(t,0),r.copyToChannel(s??t,1);const h=e.createBufferSource();h.buffer=r,o.push(h)}return o}function $e(n){const e=n.createOscillator(),o=new Float32Array([0,0]),t=new Float32Array([0,0]),s=n.createPeriodicWave(o,t,{disableNormalization:!0});return e.setPeriodicWave(s),e.start(),e}p.AVCanvas=He,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})});
//# sourceMappingURL=av-canvas.umd.cjs.map