(function(e,$){typeof exports=="object"&&typeof module<"u"?module.exports=$(require("vue")):typeof define=="function"&&define.amd?define(["vue"],$):(e=typeof globalThis<"u"?globalThis:e||self,e.Vue3CanvasVideoPlayer=$(e.Vue))})(this,function(e){"use strict";const $=s=>{const t=parseInt(s),c=Math.floor(t/3600),a=Math.floor(t%3600/60),i=t%60;return`${c<10?"0"+c:c}:${a<10?"0"+a:a}:${i<10?"0"+i:i}`},N=(s,t)=>Math.round(s*t),Z=(s,t)=>s/t,L=s=>s===void 0?!1:new Intl.NumberFormat().format(s),o=e.reactive({container:{element:null,fullScreen:!1,type:"overlay",mouseDown:!1,mouseMove:!1,mouseHold:!1,resizeObserver:null},video:{element:null,src:"",canvas:null,width:0,height:0,duration:0,currentTime:0,muted:!1,volume:1,loop:!1,playbackRate:1,paused:!0,fps:0},progress:{seekWidth:0,seekTotal:0,bufferWidth:0},preview:{enabled:!1,element:null,left:0,time:"00:00:00"},range:{start:0,end:0,left:0,width:0,enabled:!1},bbox:{data:{},textColor:"#fff",fillColor:"rgba(0, 0, 255, 0.5)",borderSize:1,borderColor:"rgba(255, 0, 0, 0.5)",enabled:!1},message:{time:1e3,visible:!1,text:""},block:{text:"Video file has not been loaded"}});let O=!1;function F(){const s=e.computed(()=>o.range.start>0&&o.range.end>0),t=e.computed(()=>o.video.fps>0),c=e.computed(()=>Object.keys(o.bbox.data).length>0),a=()=>{const{video:{element:n,canvas:r,width:l,height:h,duration:g,fps:w},range:{start:S}}=o,_=r.getContext("2d"),q=(T,G)=>{const K="...",P=_.measureText(K).width+10;let M=T,R=_.measureText(M).width;if(R<=G||R<=P)return M;{let J=M.length;for(;R>=G-P&&J-- >0;)M=M.substr(0,J),R=_.measureText(M).width;return M+K}};r.width=l,r.height=h,n.loop=o.video.loop,s.value&&(n.currentTime=S),n.paused&&(o.video.paused=!0,n.pause());const U=()=>{const{video:{loop:T,src:G},range:{enabled:K,start:P,end:M},bbox:{data:R,textColor:J,fillColor:gt,borderSize:W,borderColor:bt,enabled:vt}}=o;if(!G){_.clearRect(0,0,l,h);return}_.drawImage(n,0,0,l,h);let Q=o.video.currentTime=n.currentTime;if(s.value&&K?(n.currentTime>=M&&(T?n.currentTime=P:(n.currentTime=M,n.pause(),o.video.paused=!0)),o.progress.seekWidth=(Q-P)/(M-P)*100,o.progress.bufferWidth=100):(n.ended&&T&&(Q=0),o.progress.seekWidth=Q/g*100,n.buffered.length>0&&(o.progress.bufferWidth=n.buffered.end(n.buffered.length-1)/g*100)),t.value&&c.value&&vt){const yt=N(Q,w),Y=R[yt];Y!=null&&Y.length&&Y.forEach(({label:se,xywh:D})=>{if(D&&D.length===4){const ee=D[0],te=D[1],oe=D[2]-D[0],le=D[3]-D[1];_.fillStyle=gt,_.fillRect(ee,te,oe,le),se&&(_.font="14px Roboto",_.fillStyle=J,_.fillText(q(se,oe),ee+5,te+15)),W&&(_.lineWidth=W,_.strokeStyle=bt,_.strokeRect(ee-W/2,te-W/2,oe+W,le+W))}})}n.paused&&Math.floor(o.progress.seekWidth)===100&&(o.video.paused=!0),window.requestAnimationFrame(U)};U()},i=n=>{const{video:{element:r,duration:l,fps:h},range:{enabled:g,start:w,end:S}}=o;r.currentTime=s.value&&g?Math.max(Math.min(n,S),w):Math.max(Math.min(n,l),0);const _=s.value&&g?Math.round((r.currentTime-w)/(S-w)*100):Math.round(r.currentTime/l*100);B(`Seek ${$(r.currentTime)} ${t.value?`[${L(N(r.currentTime,h))}]`:""} (${_}%)`)},u=({offsetX:n})=>{const{container:{mouseDown:r},video:{element:l,duration:h},progress:{seekTotal:g},preview:{enabled:w,element:S},range:{enabled:_,start:q,end:U}}=o;if(!l)return;const T=_?n/g*(U-q)+q:n/g*h;T===1/0||isNaN(T)||(r&&i(T),S&&w&&(S.currentTime=T,o.preview.time=$(T),n<65?o.preview.left=65:n>g-65?o.preview.left=g-65:o.preview.left=n))};let x;const y=({detail:n})=>{if(n===1){const{video:{element:r,paused:l},range:{enabled:h,start:g,end:w}}=o;x=setTimeout(()=>{l?(s.value&&h&&r.currentTime===w&&(r.currentTime=g),r.play()):r.pause(),B(l?"Play":"Pause"),o.video.paused=!l},250)}else n===2&&(clearTimeout(x),ne())},k=n=>{const{video:{element:r}}=o,l=Math.max(Math.min(n,1),0);r.volume=o.video.volume=l,B(`Volume ${Math.floor(l*100)}%`)},E=({offsetY:n})=>{const{container:{mouseDown:r}}=o;r&&k((100-n)/100)},f=()=>{const{video:{element:n,muted:r}}=o;n.muted=o.video.muted=!r,B(r?"Unmuted":"Muted")},p=()=>{const{video:{element:n,fps:r},range:{end:l}}=o;if(t.value){const h=N(n.currentTime,r)+1;N(l,r)===h?i(l):i(Z(h,r))}else i(n.currentTime+1)},b=()=>{const{video:{element:n,fps:r},range:{start:l}}=o;if(t.value){const h=N(n.currentTime,r)-1;N(l,r)===h?i(l):i(Z(h,r))}else i(n.currentTime-1)};let V;const C=n=>{const{container:{mouseDown:r}}=o;r?V=setInterval(()=>{n?p():b()},60):clearInterval(V)},I=n=>{const{video:{element:r}}=o;r.playbackRate=o.video.playbackRate=n,B(`Playback Rate x${n.toFixed(1)}`)},d=n=>{const{video:{element:r,duration:l},progress:{seekTotal:h},range:{start:g,end:w}}=o;o.range.enabled!==n&&(o.range.enabled=n,B(n?"Active range":"Inactive range")),n?(r.currentTime=g,o.range.left=0,o.range.width=h,o.progress.seekWidth=0):(r.currentTime=0,o.range.left=Math.floor(g/l*h),o.range.width=Math.ceil(w/l*h-g/l*h)||1)},H=()=>{const{video:{element:n,loop:r}}=o;n.loop=o.video.loop=!r,B(r?"Play once":"Repeat play")},m=()=>{const{bbox:{enabled:n}}=o;o.bbox.enabled=!n,B(n?"Hide bounding box":"Show bounding box")};let A;const B=n=>{const{message:r}=o,{time:l}=r;!l||(r.text=n,r.visible=!0,A&&clearTimeout(A),A=setTimeout(()=>{r.visible=!1},l))},ne=()=>{const{container:{element:n}}=o;document.fullscreenElement?document.exitFullscreen():n.requestFullscreen()},ae=({altKey:n,ctrlKey:r,key:l})=>{const{video:{element:h,paused:g,volume:w,fps:S}}=o;if(n&&r){if(l==="g"&&t.value){const _=window.prompt("Go to frame number",N(h.currentTime,S));g&&h.pause(),h.currentTime=Z(_,S)}l==="ArrowUp"&&k(w+.05),l==="ArrowDown"&&k(w-.05),l==="ArrowLeft"&&b(),l==="ArrowRight"&&p()}},re=()=>{o.container.fullScreen=Boolean(document.fullscreenElement),B(`${o.container.fullScreen?"Full":"Normal"} screen`)},_t=()=>{const{container:{element:n},range:{enabled:r},preview:{enabled:l}}=o;o.progress.seekTotal=n.offsetWidth,s.value&&r&&d(!0),l&&(o.preview.left=0)};let X;const ut=()=>{X&&clearTimeout(X),o.container.mouseMove=!0,!o.container.mouseHold&&(X=setTimeout(()=>{o.container.mouseMove=!1},2e3))};return e.onMounted(()=>{O||(window.addEventListener("keydown",ae),document.addEventListener("fullscreenchange",re),setTimeout(()=>{o.container.resizeObserver=new ResizeObserver(_t),o.container.resizeObserver.observe(o.container.element)},300),O=!0)}),e.onUnmounted(()=>{!O||(o.container.resizeObserver.unobserve(o.container.element),window.removeEventListener("keydown",ae),document.removeEventListener("fullscreenchange",re),O=!1)}),{data:o,initialVideo:a,setVideoSeek:u,toggleVideoPlay:y,toggleVideoMute:f,changeVideoVolume:E,changeVideoFrame:C,setVideoPlaybackRate:I,setVideoRange:d,toggleVideoLoop:H,toggleVideoBbox:m,toggleFullScreen:ne,setMessage:B,handleContainerMouseMove:ut}}const kt="",z=(s,t)=>{const c=s.__vccOpts||s;for(const[a,i]of t)c[a]=i;return c},j=s=>(e.pushScopeId("data-v-f43b31fa"),s=s(),e.popScopeId(),s),ie={class:"cvp-header"},de=["data-active"],ce=j(()=>e.createElementVNode("span",{style:{opacity:"0.5"}}," / ",-1)),fe={key:0},pe=j(()=>e.createElementVNode("span",{style:{opacity:"0.5"}}," / ",-1)),me=["data-active"],he=j(()=>e.createElementVNode("span",{style:{opacity:"0.5"}}," / ",-1)),_e={key:0},ue=j(()=>e.createElementVNode("span",{style:{opacity:"0.5"}}," / ",-1)),ge=z({__name:"Header",setup(s){const{data:t}=F(),c=e.computed(()=>t.range.start>0&&t.range.end>0),a=e.computed(()=>t.video.fps>0),i=e.computed(()=>$(t.video.src&&t.video.currentTime||0)),u=e.computed(()=>$(t.video.src&&t.video.duration||0)),x=e.computed(()=>$(t.video.src&&t.range.end||0)),y=e.computed(()=>L(N(t.video.src&&t.video.currentTime||0,t.video.fps))),k=e.computed(()=>L(N(t.video.src&&t.video.duration||0,t.video.fps))),E=e.computed(()=>L(N(t.video.src&&t.range.end||0,t.video.fps)));return(f,p)=>(e.openBlock(),e.createElementBlock("div",ie,[e.createElementVNode("div",{class:"cvp-information","data-active":!e.unref(t).range.enabled},[e.createElementVNode("span",null,e.toDisplayString(e.unref(i)),1),ce,e.createElementVNode("span",null,e.toDisplayString(e.unref(u)),1),e.unref(a)?(e.openBlock(),e.createElementBlock("span",fe,[e.createElementVNode("span",null," [ "+e.toDisplayString(e.unref(y)),1),pe,e.createElementVNode("span",null,e.toDisplayString(e.unref(k))+" ]",1)])):e.createCommentVNode("",!0)],8,de),e.unref(c)?(e.openBlock(),e.createElementBlock("div",{key:0,class:"cvp-information","data-active":e.unref(t).range.enabled},[e.createElementVNode("span",null,e.toDisplayString(e.unref(i)),1),he,e.createElementVNode("span",null,e.toDisplayString(e.unref(x)),1),e.unref(a)?(e.openBlock(),e.createElementBlock("span",_e,[e.createElementVNode("span",null," [ "+e.toDisplayString(e.unref(y)),1),ue,e.createElementVNode("span",null,e.toDisplayString(e.unref(E))+" ]",1)])):e.createCommentVNode("",!0)],8,me)):e.createCommentVNode("",!0)]))}},[["__scopeId","data-v-f43b31fa"]]),Vt="",be={class:"cvp-main"},ve=["src","muted","autoplay"],ye=z({__name:"Main",props:{src:{type:String,default:!1,required:!0},muted:{type:Boolean,default:!1},autoplay:{type:Boolean,default:!1}},emits:["loadedmetadata","play","pause","timeupdate","volumechange","error"],setup(s,{emit:t}){const c=s,a=e.ref(null),i=e.ref(null),{data:u,initialVideo:x,toggleVideoPlay:y}=F(),k=E=>{Object.assign(u,{video:{...u.video,element:a.value,canvas:i.value,width:a.value.videoWidth,height:a.value.videoHeight,duration:a.value.duration,paused:!(c.muted===!0&&c.autoplay===!0)}}),x(),t("loadedmetadata",E)};return(E,f)=>(e.openBlock(),e.createElementBlock("div",be,[e.createElementVNode("video",{class:"cvp-video",ref_key:"video",ref:a,src:s.src,muted:s.muted,autoplay:s.autoplay,onLoadedmetadata:f[0]||(f[0]=p=>k(p)),onPlay:f[1]||(f[1]=p=>t("play",p)),onPause:f[2]||(f[2]=p=>t("pause",p)),onTimeupdate:f[3]||(f[3]=p=>t("timeupdate",p)),onVolumechange:f[4]||(f[4]=p=>t("volumechange",p)),onError:f[5]||(f[5]=p=>t("error",p))},null,40,ve),e.createElementVNode("canvas",{class:"cvp-canvas",ref_key:"canvas",ref:i,onClick:f[6]||(f[6]=(...p)=>e.unref(y)&&e.unref(y)(...p))},null,512)]))}},[["__scopeId","data-v-352dd94f"]]),xt="",ke={class:"cvp-progress"},Ee={class:"cvp-progress-drag"},Ve=["src"],we={class:"cvp-progress-preview-time"},xe=z({__name:"Progress",setup(s){const t=e.ref(null),c=e.ref(null),{data:a,setVideoSeek:i}=F(),u=e.computed(()=>a.range.start>0&&a.range.end>0),x=e.computed(()=>`${a.video.src&&a.progress.bufferWidth||0}%`),y=e.computed(()=>`${a.video.src&&a.progress.seekWidth||0}%`),k=e.computed(()=>`${a.video.src&&a.range.left||0}px`),E=e.computed(()=>`${a.video.src&&a.range.width||0}px`),f=()=>{setTimeout(()=>{const{video:{width:p,height:b},preview:{enabled:V}}=a;if(!V)return;const C=c.value.getContext("2d"),I=p*.3,d=b*.3;c.value.width=I,c.value.height=d,Object.assign(a,{preview:{...a.preview,element:t.value}});const H=()=>{!t.value||(C.imageSmoothingEnabled=!0,C.drawImage(t.value,0,0,I,d),window.requestAnimationFrame(H))};H()},100)};return(p,b)=>(e.openBlock(),e.createElementBlock("div",ke,[e.createElementVNode("div",Ee,[e.createElementVNode("div",{class:"cvp-progress-area",onMousedown:b[0]||(b[0]=e.withModifiers(V=>{e.unref(a).container.mouseDown=!0,e.unref(i)(V)},["self"])),onMousemove:b[1]||(b[1]=(...V)=>e.unref(i)&&e.unref(i)(...V)),onMouseup:b[2]||(b[2]=V=>e.unref(a).container.mouseDown=!1),onMouseleave:b[3]||(b[3]=V=>e.unref(a).container.mouseDown=!1)},[e.createElementVNode("div",{class:"cvp-progress-buffer",style:e.normalizeStyle({width:e.unref(x)})},null,4),e.createElementVNode("div",{class:"cvp-progress-bar",style:e.normalizeStyle({width:e.unref(y)})},null,4),e.unref(u)?(e.openBlock(),e.createElementBlock("div",{key:0,class:"cvp-progress-range",style:e.normalizeStyle({left:e.unref(k),width:e.unref(E)})},null,4)):e.createCommentVNode("",!0)],32)]),e.unref(a).preview.enabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:"cvp-progress-preview",style:e.normalizeStyle({left:`${e.unref(a).preview.left}px`})},[e.createElementVNode("video",{class:"cvp-progress-preview-video",ref_key:"video",ref:t,src:e.unref(a).video.src,onLoadeddata:f},null,40,Ve),e.createElementVNode("canvas",{class:"cvp-progress-preview-canvas",ref_key:"canvas",ref:c},null,512),e.createElementVNode("div",we,e.toDisplayString(e.unref(a).preview.time),1)],4)):e.createCommentVNode("",!0)]))}},[["__scopeId","data-v-c1f46be8"]]),Nt="",v=s=>(e.pushScopeId("data-v-f2163948"),s=s(),e.popScopeId(),s),Me={class:"cvp-controller"},Ne=["title"],Be={key:0,class:"cvp-controller-icon",viewBox:"-2 -2 28 28","stroke-width":"1",stroke:"#ffffff",fill:"none"},Se=[v(()=>e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1)),v(()=>e.createElementVNode("path",{d:"M7 4v16l13 -8z"},null,-1))],Te={key:1,class:"cvp-controller-icon",viewBox:"0 0 24 24","stroke-width":"1",stroke:"#ffffff",fill:"none"},$e=[v(()=>e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1)),v(()=>e.createElementVNode("rect",{x:"6",y:"5",width:"4",height:"14",rx:"1"},null,-1)),v(()=>e.createElementVNode("rect",{x:"14",y:"5",width:"4",height:"14",rx:"1"},null,-1))],Ce={class:"cvp-controller-volume"},De=["title"],Fe={key:0,class:"cvp-controller-icon",viewBox:"-2 -2 28 28","stroke-width":"1",stroke:"#ffffff",fill:"none"},ze=[v(()=>e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1)),v(()=>e.createElementVNode("path",{d:"M6 15h-2a1 1 0 0 1 -1 -1v-4a1 1 0 0 1 1 -1h2l3.5 -4.5a0.8 .8 0 0 1 1.5 .5v14a0.8 .8 0 0 1 -1.5 .5l-3.5 -4.5"},null,-1)),v(()=>e.createElementVNode("path",{d:"M16 10l4 4m0 -4l-4 4"},null,-1))],He={key:1,class:"cvp-controller-icon",viewBox:"-2 -2 28 28","stroke-width":"1",stroke:"#ffffff",fill:"none"},Pe=[v(()=>e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1)),v(()=>e.createElementVNode("path",{d:"M15 8a5 5 0 0 1 0 8"},null,-1)),v(()=>e.createElementVNode("path",{d:"M17.7 5a9 9 0 0 1 0 14"},null,-1)),v(()=>e.createElementVNode("path",{d:"M6 15h-2a1 1 0 0 1 -1 -1v-4a1 1 0 0 1 1 -1h2l3.5 -4.5a0.8 .8 0 0 1 1.5 .5v14a0.8 .8 0 0 1 -1.5 .5l-3.5 -4.5"},null,-1))],Re={class:"cvp-controller-volume-drag"},We=[v(()=>e.createElementVNode("svg",{class:"cvp-controller-icon",viewBox:"-1 -1 26 26","stroke-width":"1",stroke:"#ffffff",fill:"none"},[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),e.createElementVNode("path",{d:"M20 5v14l-12 -7z"}),e.createElementVNode("line",{x1:"4",y1:"5",x2:"4",y2:"19"})],-1))],Ie=[v(()=>e.createElementVNode("svg",{class:"cvp-controller-icon",viewBox:"-1 -1 26 26","stroke-width":"1",stroke:"#ffffff",fill:"none"},[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),e.createElementVNode("path",{d:"M4 5v14l12 -7z"}),e.createElementVNode("line",{x1:"20",y1:"5",x2:"20",y2:"19"})],-1))],Le=v(()=>e.createElementVNode("div",{style:{flex:"1"}},null,-1)),Oe={class:"cvp-controller-playback-rate"},je={class:"cvp-controller-playback-rate-text",title:"Playback rate"},Ae={class:"cvp-controller-playback-rate-list"},qe={class:"cvp-controller-playback-rate-item"},Ue=["onClick"],Ge=["data-active","title"],Ke={key:0,class:"cvp-controller-icon",viewBox:"-4 -4 32 32","stroke-width":"1",stroke:"#ffffff",fill:"none"},Je=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-f2163948></path><path d="M3 12h7l-3 -3m0 6l3 -3" data-v-f2163948></path><path d="M21 12h-7l3 -3m0 6l-3 -3" data-v-f2163948></path><path d="M9 6v-3h6v3" data-v-f2163948></path><path d="M9 18v3h6v-3" data-v-f2163948></path>',5)],Qe={key:1,class:"cvp-controller-icon",viewBox:"-4 -4 32 32","stroke-width":"1",stroke:"#ffffff",fill:"none"},Ye=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-f2163948></path><path d="M10 12h-7l3 -3m0 6l-3 -3" data-v-f2163948></path><path d="M14 12h7l-3 -3m0 6l3 -3" data-v-f2163948></path><path d="M3 6v-3h18v3" data-v-f2163948></path><path d="M3 18v3h18v-3" data-v-f2163948></path>',5)],Ze=["data-active","title"],Xe=[v(()=>e.createElementVNode("svg",{class:"cvp-controller-icon",viewBox:"-4 -4 32 32","stroke-width":"1.5",stroke:"#ffffff",fill:"none"},[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),e.createElementVNode("path",{d:"M4 12v-3a3 3 0 0 1 3 -3h13m-3 -3l3 3l-3 3"}),e.createElementVNode("path",{d:"M20 12v3a3 3 0 0 1 -3 3h-13m3 3l-3 -3l3 -3"})],-1))],et=["data-active","title"],tt=[e.createStaticVNode('<svg class="cvp-controller-icon" viewBox="-4 -4 32 32" stroke-width="1" stroke="#ffffff" fill="none" data-v-f2163948><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-f2163948></path><circle cx="5" cy="5" r="2" data-v-f2163948></circle><circle cx="19" cy="5" r="2" data-v-f2163948></circle><circle cx="5" cy="19" r="2" data-v-f2163948></circle><circle cx="19" cy="19" r="2" data-v-f2163948></circle><line x1="5" y1="7" x2="5" y2="17" data-v-f2163948></line><line x1="7" y1="5" x2="17" y2="5" data-v-f2163948></line><line x1="7" y1="19" x2="17" y2="19" data-v-f2163948></line><line x1="19" y1="7" x2="19" y2="17" data-v-f2163948></line></svg>',1)],ot=["title"],nt={key:0,class:"cvp-controller-icon",viewBox:"0 0 24 24","stroke-width":"1",stroke:"#ffffff",fill:"none"},at=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-f2163948></path><path d="M15 19v-2a2 2 0 0 1 2 -2h2" data-v-f2163948></path><path d="M15 5v2a2 2 0 0 0 2 2h2" data-v-f2163948></path><path d="M5 15h2a2 2 0 0 1 2 2v2" data-v-f2163948></path><path d="M5 9h2a2 2 0 0 0 2 -2v-2" data-v-f2163948></path>',5)],rt={key:1,class:"cvp-controller-icon",viewBox:"-2 -2 28 28","stroke-width":"1",stroke:"#ffffff",fill:"none"},st=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-f2163948></path><path d="M4 8v-2a2 2 0 0 1 2 -2h2" data-v-f2163948></path><path d="M4 16v2a2 2 0 0 0 2 2h2" data-v-f2163948></path><path d="M16 4h2a2 2 0 0 1 2 2v2" data-v-f2163948></path><path d="M16 20h2a2 2 0 0 0 2 -2v-2" data-v-f2163948></path>',5)],lt=z({__name:"Controller",setup(s){const{data:t,toggleVideoPlay:c,toggleVideoMute:a,changeVideoVolume:i,changeVideoFrame:u,setVideoPlaybackRate:x,setVideoRange:y,toggleVideoLoop:k,toggleVideoBbox:E,toggleFullScreen:f}=F(),p=e.computed(()=>t.range.start>0&&t.range.end>0),b=e.computed(()=>t.video.fps>0),V=e.computed(()=>Object.keys(t.bbox.data).length>0),C=()=>{y(!t.range.enabled)};return(I,d)=>{var H;return e.openBlock(),e.createElementBlock("div",Me,[e.createElementVNode("button",{class:"cvp-controller-button",title:e.unref(t).video.paused?"Play":"Pause",onClick:d[0]||(d[0]=(...m)=>e.unref(c)&&e.unref(c)(...m))},[e.unref(t).video.paused?(e.openBlock(),e.createElementBlock("svg",Be,Se)):(e.openBlock(),e.createElementBlock("svg",Te,$e))],8,Ne),e.createElementVNode("div",Ce,[e.createElementVNode("button",{class:"cvp-controller-button",title:e.unref(t).video.muted?"Unmute":"Mute",onClick:d[1]||(d[1]=(...m)=>e.unref(a)&&e.unref(a)(...m))},[e.unref(t).video.muted?(e.openBlock(),e.createElementBlock("svg",Fe,ze)):(e.openBlock(),e.createElementBlock("svg",He,Pe))],8,De),e.createElementVNode("div",Re,[e.createElementVNode("div",{class:"cvp-controller-volume-area",onMousedown:d[2]||(d[2]=e.withModifiers(m=>{e.unref(t).container.mouseDown=!0,e.unref(i)(m)},["self"])),onMousemove:d[3]||(d[3]=(...m)=>e.unref(i)&&e.unref(i)(...m)),onMouseup:d[4]||(d[4]=m=>e.unref(t).container.mouseDown=!1),onMouseleave:d[5]||(d[5]=m=>e.unref(t).container.mouseDown=!1)},[e.createElementVNode("div",{class:"cvp-controller-volume-bar",style:e.normalizeStyle({height:`${e.unref(t).video.volume*100}%`})},null,4)],32)])]),e.createElementVNode("button",{class:"cvp-controller-button",title:"Backward",onMousedown:d[6]||(d[6]=m=>{e.unref(t).container.mouseDown=!0,e.unref(u)(!1)}),onMouseup:d[7]||(d[7]=m=>{e.unref(t).container.mouseDown=!1,e.unref(u)(!1)})},We,32),e.createElementVNode("button",{class:"cvp-controller-button",title:"Forward",onMousedown:d[8]||(d[8]=m=>{e.unref(t).container.mouseDown=!0,e.unref(u)(!0)}),onMouseup:d[9]||(d[9]=m=>{e.unref(t).container.mouseDown=!1,e.unref(u)(!0)})},Ie,32),Le,e.createElementVNode("div",Oe,[e.createElementVNode("div",je,"x"+e.toDisplayString(((H=e.unref(t).video.playbackRate)==null?void 0:H.toFixed(1))||"1.0"),1),e.createElementVNode("ul",Ae,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList([.1,.5,1,1.5,2,5],m=>(e.openBlock(),e.createElementBlock("li",qe,[e.createElementVNode("button",{class:"cvp-controller-playback-rate-button",onClick:A=>e.unref(x)(m)},e.toDisplayString(m.toFixed(1)),9,Ue)]))),256))])]),e.unref(p)?(e.openBlock(),e.createElementBlock("button",{key:0,class:"cvp-controller-button","data-active":e.unref(t).range.enabled,title:e.unref(t).range.enabled?"Reset range":"Set range",onClick:C},[e.unref(t).range.enabled?(e.openBlock(),e.createElementBlock("svg",Ke,Je)):(e.openBlock(),e.createElementBlock("svg",Qe,Ye))],8,Ge)):e.createCommentVNode("",!0),e.createElementVNode("button",{class:"cvp-controller-button","data-active":e.unref(t).video.loop,title:e.unref(t).video.loop?"Play once":"Repeat play",onClick:d[10]||(d[10]=(...m)=>e.unref(k)&&e.unref(k)(...m))},Xe,8,Ze),e.unref(b)&&e.unref(V)?(e.openBlock(),e.createElementBlock("button",{key:1,class:"cvp-controller-button","data-active":e.unref(t).bbox.enabled,title:e.unref(t).bbox.enabled?"Hide bounding box":"Show bounding box",onClick:d[11]||(d[11]=(...m)=>e.unref(E)&&e.unref(E)(...m))},tt,8,et)):e.createCommentVNode("",!0),e.createElementVNode("button",{class:"cvp-controller-button",title:e.unref(t).container.fullScreen?"Normal screen":"Full screen",onClick:d[12]||(d[12]=(...m)=>e.unref(f)&&e.unref(f)(...m))},[e.unref(t).container.fullScreen?(e.openBlock(),e.createElementBlock("svg",nt,at)):(e.openBlock(),e.createElementBlock("svg",rt,st))],8,ot)])}}},[["__scopeId","data-v-f2163948"]]),Jt="",it=["data-active"],dt=z({__name:"index",setup(s){const{data:t,handleContainerMouseMove:c}=F();return(a,i)=>(e.openBlock(),e.createElementBlock("div",{class:"cvp-footer","data-active":e.unref(t).container.mouseMove,onMouseenter:i[0]||(i[0]=u=>e.unref(t).container.mouseHold=!0),onMouseleave:i[1]||(i[1]=u=>{e.unref(t).container.mouseHold=!1,e.unref(c)()})},[e.createVNode(xe),e.createVNode(lt)],40,it))}},[["__scopeId","data-v-33a4d776"]]),Yt="",ct={class:"cvp-message"},ft=["data-visible","innerHTML"],pt=z({__name:"Message",setup(s){const{data:t}=F();return(c,a)=>(e.openBlock(),e.createElementBlock("div",ct,[e.createElementVNode("div",{class:"cvp-message-text","data-visible":e.unref(t).message.visible,innerHTML:e.unref(t).message.text},null,8,ft)]))}},[["__scopeId","data-v-8fa62035"]]),Xt="",mt=["data-dark-mode","data-type"],ht={key:0,class:"cvp-block"};return z({__name:"Vue3CanvasVideoPlayer",props:{src:{type:String,default:"",required:!0},muted:{type:Boolean,default:!1},autoplay:{type:Boolean,default:!1},loop:{type:Boolean,default:!1},range:{type:Array,validator:s=>!s.length||s.length===2&&s.every(t=>typeof t=="number"),default:()=>[0,0]},fps:{type:Number,default:0},bbox:{type:Object,default:()=>({data:{},textColor:"#fff",fillColor:"rgba(0, 0, 255, 0.5)",borderSize:1,borderColor:"rgba(255, 0, 0, 0.5)"})},type:{type:String,default:"overlay"},messageTime:{type:Number,default:1e3},preview:{type:Boolean,default:!1},darkMode:{type:Boolean,default:!0}},setup(s){const t=s,c=e.ref(null),{data:a,setVideoRange:i,handleContainerMouseMove:u}=F();return e.watch(()=>t,({src:x,muted:y,loop:k,range:E,fps:f,bbox:p,type:b,messageTime:V,preview:C})=>{Object.assign(a.container,{type:b}),Object.assign(a.video,{src:x,muted:y,loop:k,fps:f}),Object.assign(a.preview,{enabled:C}),Object.assign(a.range,{start:E[0],end:E[1]}),Object.assign(a.bbox,{...p}),Object.assign(a.message,{time:V}),a.range.start&&a.range.end&&i(!0),Object.keys(a.bbox.data).length&&(a.bbox.enabled=!0)},{deep:!0}),e.onMounted(()=>{Object.assign(a,{container:{...a.container,element:c.value}}),a.container.type==="overlay"&&a.container.element.addEventListener("mousemove",u)}),e.onBeforeUnmount(()=>{a.container.type==="overlay"&&a.container.element.removeEventListener("mousemove",u)}),(x,y)=>(e.openBlock(),e.createElementBlock("div",{id:"vue3-canvas-video-player",ref_key:"container",ref:c,"data-dark-mode":s.darkMode,"data-type":t.type},[e.createVNode(ge),e.createVNode(ye,{src:t.src,muted:t.muted,autoplay:t.autoplay},null,8,["src","muted","autoplay"]),e.createVNode(dt),e.createVNode(pt),t.src.length?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",ht,e.toDisplayString(e.unref(a).block.text),1))],8,mt))}},[["__scopeId","data-v-bd75ab9b"]])});