mediaquad-sound-component
Version:
This component is built on the [wavesurfer](https://wavesurfer.xyz) library.
92 lines (90 loc) • 42 kB
JavaScript
(function(T,r){typeof exports=="object"&&typeof module<"u"?r(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],r):(T=typeof globalThis<"u"?globalThis:T||self,r(T.ViewerPlugin={},T.vue))})(this,function(T,r){"use strict";function C(i,e,t,n){return new(t||(t=Promise))(function(s,o){function a(d){try{h(n.next(d))}catch(c){o(c)}}function l(d){try{h(n.throw(d))}catch(c){o(c)}}function h(d){var c;d.done?s(d.value):(c=d.value,c instanceof t?c:new t(function(p){p(c)})).then(a,l)}h((n=n.apply(i,e||[])).next())})}typeof SuppressedError=="function"&&SuppressedError;class P{constructor(){this.listeners={}}on(e,t,n){if(this.listeners[e]||(this.listeners[e]=new Set),this.listeners[e].add(t),n==null?void 0:n.once){const s=()=>{this.un(e,s),this.un(e,t)};return this.on(e,s),s}return()=>this.un(e,t)}un(e,t){var n;(n=this.listeners[e])===null||n===void 0||n.delete(t)}once(e,t){return this.on(e,t,{once:!0})}unAll(){this.listeners={}}emit(e,...t){this.listeners[e]&&this.listeners[e].forEach(n=>n(...t))}}const R={decode:function(i,e){return C(this,void 0,void 0,function*(){const t=new AudioContext({sampleRate:e});return t.decodeAudioData(i).finally(()=>t.close())})},createBuffer:function(i,e){return typeof i[0]=="number"&&(i=[i]),function(t){const n=t[0];if(n.some(s=>s>1||s<-1)){const s=n.length;let o=0;for(let a=0;a<s;a++){const l=Math.abs(n[a]);l>o&&(o=l)}for(const a of t)for(let l=0;l<s;l++)a[l]/=o}}(i),{duration:e,length:i[0].length,sampleRate:i[0].length/e,numberOfChannels:i.length,getChannelData:t=>i==null?void 0:i[t],copyFromChannel:AudioBuffer.prototype.copyFromChannel,copyToChannel:AudioBuffer.prototype.copyToChannel}}};function V(i,e){const t=e.xmlns?document.createElementNS(e.xmlns,i):document.createElement(i);for(const[n,s]of Object.entries(e))if(n==="children")for(const[o,a]of Object.entries(e))typeof a=="string"?t.appendChild(document.createTextNode(a)):t.appendChild(V(o,a));else n==="style"?Object.assign(t.style,s):n==="textContent"?t.textContent=s:t.setAttribute(n,s.toString());return t}function O(i,e,t){const n=V(i,e||{});return t==null||t.appendChild(n),n}var q=Object.freeze({__proto__:null,createElement:O,default:O});const F={fetchBlob:function(i,e,t){return C(this,void 0,void 0,function*(){const n=yield fetch(i,t);if(n.status>=400)throw new Error(`Failed to fetch ${i}: ${n.status} (${n.statusText})`);return function(s,o){C(this,void 0,void 0,function*(){if(!s.body||!s.headers)return;const a=s.body.getReader(),l=Number(s.headers.get("Content-Length"))||0;let h=0;const d=p=>C(this,void 0,void 0,function*(){h+=(p==null?void 0:p.length)||0;const u=Math.round(h/l*100);o(u)}),c=()=>C(this,void 0,void 0,function*(){let p;try{p=yield a.read()}catch{return}p.done||(d(p.value),yield c())});c()})}(n.clone(),e),n.blob()})}};class G extends P{constructor(e){super(),this.isExternalMedia=!1,e.media?(this.media=e.media,this.isExternalMedia=!0):this.media=document.createElement("audio"),e.mediaControls&&(this.media.controls=!0),e.autoplay&&(this.media.autoplay=!0),e.playbackRate!=null&&this.onMediaEvent("canplay",()=>{e.playbackRate!=null&&(this.media.playbackRate=e.playbackRate)},{once:!0})}onMediaEvent(e,t,n){return this.media.addEventListener(e,t,n),()=>this.media.removeEventListener(e,t,n)}getSrc(){return this.media.currentSrc||this.media.src||""}revokeSrc(){const e=this.getSrc();e.startsWith("blob:")&&URL.revokeObjectURL(e)}canPlayType(e){return this.media.canPlayType(e)!==""}setSrc(e,t){const n=this.getSrc();if(e&&n===e)return;this.revokeSrc();const s=t instanceof Blob&&(this.canPlayType(t.type)||!e)?URL.createObjectURL(t):e;try{this.media.src=s}catch{this.media.src=e}}destroy(){this.media.pause(),this.isExternalMedia||(this.media.remove(),this.revokeSrc(),this.media.src="",this.media.load())}setMediaElement(e){this.media=e}play(){return C(this,void 0,void 0,function*(){return this.media.play()})}pause(){this.media.pause()}isPlaying(){return!this.media.paused&&!this.media.ended}setTime(e){this.media.currentTime=e}getDuration(){return this.media.duration}getCurrentTime(){return this.media.currentTime}getVolume(){return this.media.volume}setVolume(e){this.media.volume=e}getMuted(){return this.media.muted}setMuted(e){this.media.muted=e}getPlaybackRate(){return this.media.playbackRate}isSeeking(){return this.media.seeking}setPlaybackRate(e,t){t!=null&&(this.media.preservesPitch=t),this.media.playbackRate=e}getMediaElement(){return this.media}setSinkId(e){return this.media.setSinkId(e)}}class N extends P{constructor(e,t){super(),this.timeouts=[],this.isScrollable=!1,this.audioData=null,this.resizeObserver=null,this.lastContainerWidth=0,this.isDragging=!1,this.subscriptions=[],this.unsubscribeOnScroll=[],this.subscriptions=[],this.options=e;const n=this.parentFromOptionsContainer(e.container);this.parent=n;const[s,o]=this.initHtml();n.appendChild(s),this.container=s,this.scrollContainer=o.querySelector(".scroll"),this.wrapper=o.querySelector(".wrapper"),this.canvasWrapper=o.querySelector(".canvases"),this.progressWrapper=o.querySelector(".progress"),this.cursor=o.querySelector(".cursor"),t&&o.appendChild(t),this.initEvents()}parentFromOptionsContainer(e){let t;if(typeof e=="string"?t=document.querySelector(e):e instanceof HTMLElement&&(t=e),!t)throw new Error("Container not found");return t}initEvents(){const e=t=>{const n=this.wrapper.getBoundingClientRect(),s=t.clientX-n.left,o=t.clientY-n.top;return[s/n.width,o/n.height]};if(this.wrapper.addEventListener("click",t=>{const[n,s]=e(t);this.emit("click",n,s)}),this.wrapper.addEventListener("dblclick",t=>{const[n,s]=e(t);this.emit("dblclick",n,s)}),this.options.dragToSeek!==!0&&typeof this.options.dragToSeek!="object"||this.initDrag(),this.scrollContainer.addEventListener("scroll",()=>{const{scrollLeft:t,scrollWidth:n,clientWidth:s}=this.scrollContainer,o=t/n,a=(t+s)/n;this.emit("scroll",o,a,t,t+s)}),typeof ResizeObserver=="function"){const t=this.createDelay(100);this.resizeObserver=new ResizeObserver(()=>{t().then(()=>this.onContainerResize()).catch(()=>{})}),this.resizeObserver.observe(this.scrollContainer)}}onContainerResize(){const e=this.parent.clientWidth;e===this.lastContainerWidth&&this.options.height!=="auto"||(this.lastContainerWidth=e,this.reRender())}initDrag(){this.subscriptions.push(function(e,t,n,s,o=3,a=0,l=100){if(!e)return()=>{};const h=matchMedia("(pointer: coarse)").matches;let d=()=>{};const c=p=>{if(p.button!==a)return;p.preventDefault(),p.stopPropagation();let u=p.clientX,f=p.clientY,m=!1;const k=Date.now(),g=y=>{if(y.preventDefault(),y.stopPropagation(),h&&Date.now()-k<l)return;const E=y.clientX,x=y.clientY,M=E-u,L=x-f;if(m||Math.abs(M)>o||Math.abs(L)>o){const B=e.getBoundingClientRect(),{left:_,top:j}=B;m||(n==null||n(u-_,f-j),m=!0),t(M,L,E-_,x-j),u=E,f=x}},b=y=>{if(m){const E=y.clientX,x=y.clientY,M=e.getBoundingClientRect(),{left:L,top:B}=M;s==null||s(E-L,x-B)}d()},v=y=>{y.relatedTarget&&y.relatedTarget!==document.documentElement||b(y)},S=y=>{m&&(y.stopPropagation(),y.preventDefault())},w=y=>{m&&y.preventDefault()};document.addEventListener("pointermove",g),document.addEventListener("pointerup",b),document.addEventListener("pointerout",v),document.addEventListener("pointercancel",v),document.addEventListener("touchmove",w,{passive:!1}),document.addEventListener("click",S,{capture:!0}),d=()=>{document.removeEventListener("pointermove",g),document.removeEventListener("pointerup",b),document.removeEventListener("pointerout",v),document.removeEventListener("pointercancel",v),document.removeEventListener("touchmove",w),setTimeout(()=>{document.removeEventListener("click",S,{capture:!0})},10)}};return e.addEventListener("pointerdown",c),()=>{d(),e.removeEventListener("pointerdown",c)}}(this.wrapper,(e,t,n)=>{this.emit("drag",Math.max(0,Math.min(1,n/this.wrapper.getBoundingClientRect().width)))},e=>{this.isDragging=!0,this.emit("dragstart",Math.max(0,Math.min(1,e/this.wrapper.getBoundingClientRect().width)))},e=>{this.isDragging=!1,this.emit("dragend",Math.max(0,Math.min(1,e/this.wrapper.getBoundingClientRect().width)))}))}getHeight(e,t){var n;const s=((n=this.audioData)===null||n===void 0?void 0:n.numberOfChannels)||1;if(e==null)return 128;if(!isNaN(Number(e)))return Number(e);if(e==="auto"){const o=this.parent.clientHeight||128;return t!=null&&t.every(a=>!a.overlay)?o/s:o}return 128}initHtml(){const e=document.createElement("div"),t=e.attachShadow({mode:"open"}),n=this.options.cspNonce&&typeof this.options.cspNonce=="string"?this.options.cspNonce.replace(/"/g,""):"";return t.innerHTML=`
<style${n?` nonce="${n}"`:""}>
:host {
user-select: none;
min-width: 1px;
}
:host audio {
display: block;
width: 100%;
}
:host .scroll {
overflow-x: auto;
overflow-y: hidden;
width: 100%;
position: relative;
}
:host .noScrollbar {
scrollbar-color: transparent;
scrollbar-width: none;
}
:host .noScrollbar::-webkit-scrollbar {
display: none;
-webkit-appearance: none;
}
:host .wrapper {
position: relative;
overflow: visible;
z-index: 2;
}
:host .canvases {
min-height: ${this.getHeight(this.options.height,this.options.splitChannels)}px;
}
:host .canvases > div {
position: relative;
}
:host canvas {
display: block;
position: absolute;
top: 0;
image-rendering: pixelated;
}
:host .progress {
pointer-events: none;
position: absolute;
z-index: 2;
top: 0;
left: 0;
width: 0;
height: 100%;
overflow: hidden;
}
:host .progress > div {
position: relative;
}
:host .cursor {
pointer-events: none;
position: absolute;
z-index: 5;
top: 0;
left: 0;
height: 100%;
border-radius: 2px;
}
</style>
<div class="scroll" part="scroll">
<div class="wrapper" part="wrapper">
<div class="canvases" part="canvases"></div>
<div class="progress" part="progress"></div>
<div class="cursor" part="cursor"></div>
</div>
</div>
`,[e,t]}setOptions(e){if(this.options.container!==e.container){const t=this.parentFromOptionsContainer(e.container);t.appendChild(this.container),this.parent=t}e.dragToSeek!==!0&&typeof this.options.dragToSeek!="object"||this.initDrag(),this.options=e,this.reRender()}getWrapper(){return this.wrapper}getWidth(){return this.scrollContainer.clientWidth}getScroll(){return this.scrollContainer.scrollLeft}setScroll(e){this.scrollContainer.scrollLeft=e}setScrollPercentage(e){const{scrollWidth:t}=this.scrollContainer,n=t*e;this.setScroll(n)}destroy(){var e,t;this.subscriptions.forEach(n=>n()),this.container.remove(),(e=this.resizeObserver)===null||e===void 0||e.disconnect(),(t=this.unsubscribeOnScroll)===null||t===void 0||t.forEach(n=>n()),this.unsubscribeOnScroll=[]}createDelay(e=10){let t,n;const s=()=>{t&&clearTimeout(t),n&&n()};return this.timeouts.push(s),()=>new Promise((o,a)=>{s(),n=a,t=setTimeout(()=>{t=void 0,n=void 0,o()},e)})}convertColorValues(e){if(!Array.isArray(e))return e||"";if(e.length<2)return e[0]||"";const t=document.createElement("canvas"),n=t.getContext("2d"),s=t.height*(window.devicePixelRatio||1),o=n.createLinearGradient(0,0,0,s),a=1/(e.length-1);return e.forEach((l,h)=>{const d=h*a;o.addColorStop(d,l)}),o}getPixelRatio(){return Math.max(1,window.devicePixelRatio||1)}renderBarWaveform(e,t,n,s){const o=e[0],a=e[1]||e[0],l=o.length,{width:h,height:d}=n.canvas,c=d/2,p=this.getPixelRatio(),u=t.barWidth?t.barWidth*p:1,f=t.barGap?t.barGap*p:t.barWidth?u/2:0,m=t.barRadius||0,k=h/(u+f)/l,g=m&&"roundRect"in n?"roundRect":"rect";n.beginPath();let b=0,v=0,S=0;for(let w=0;w<=l;w++){const y=Math.round(w*k);if(y>b){const M=Math.round(v*c*s),L=M+Math.round(S*c*s)||1;let B=c-M;t.barAlign==="top"?B=0:t.barAlign==="bottom"&&(B=d-L),n[g](b*(u+f),B,u,L,m),b=y,v=0,S=0}const E=Math.abs(o[w]||0),x=Math.abs(a[w]||0);E>v&&(v=E),x>S&&(S=x)}n.fill(),n.closePath()}renderLineWaveform(e,t,n,s){const o=a=>{const l=e[a]||e[0],h=l.length,{height:d}=n.canvas,c=d/2,p=n.canvas.width/h;n.moveTo(0,c);let u=0,f=0;for(let m=0;m<=h;m++){const k=Math.round(m*p);if(k>u){const b=c+(Math.round(f*c*s)||1)*(a===0?-1:1);n.lineTo(u,b),u=k,f=0}const g=Math.abs(l[m]||0);g>f&&(f=g)}n.lineTo(u,c)};n.beginPath(),o(0),o(1),n.fill(),n.closePath()}renderWaveform(e,t,n){if(n.fillStyle=this.convertColorValues(t.waveColor),t.renderFunction)return void t.renderFunction(e,n);let s=t.barHeight||1;if(t.normalize){const o=Array.from(e[0]).reduce((a,l)=>Math.max(a,Math.abs(l)),0);s=o?1/o:1}t.barWidth||t.barGap||t.barAlign?this.renderBarWaveform(e,t,n,s):this.renderLineWaveform(e,t,n,s)}renderSingleCanvas(e,t,n,s,o,a,l){const h=this.getPixelRatio(),d=document.createElement("canvas");d.width=Math.round(n*h),d.height=Math.round(s*h),d.style.width=`${n}px`,d.style.height=`${s}px`,d.style.left=`${Math.round(o)}px`,a.appendChild(d);const c=d.getContext("2d");if(this.renderWaveform(e,t,c),d.width>0&&d.height>0){const p=d.cloneNode(),u=p.getContext("2d");u.drawImage(d,0,0),u.globalCompositeOperation="source-in",u.fillStyle=this.convertColorValues(t.progressColor),u.fillRect(0,0,d.width,d.height),l.appendChild(p)}}renderMultiCanvas(e,t,n,s,o,a){const l=this.getPixelRatio(),{clientWidth:h}=this.scrollContainer,d=n/l;let c=Math.min(N.MAX_CANVAS_WIDTH,h,d),p={};if(c===0)return;if(t.barWidth||t.barGap){const g=t.barWidth||.5,b=g+(t.barGap||g/2);c%b!=0&&(c=Math.floor(c/b)*b)}const u=g=>{if(g<0||g>=f||p[g])return;p[g]=!0;const b=g*c,v=Math.min(d-b,c);if(v<=0)return;const S=e.map(w=>{const y=Math.floor(b/d*w.length),E=Math.floor((b+v)/d*w.length);return w.slice(y,E)});this.renderSingleCanvas(S,t,v,s,b,o,a)},f=Math.ceil(d/c);if(!this.isScrollable){for(let g=0;g<f;g++)u(g);return}const m=this.scrollContainer.scrollLeft/d,k=Math.floor(m*f);if(u(k-1),u(k),u(k+1),f>1){const g=this.on("scroll",()=>{const{scrollLeft:b}=this.scrollContainer,v=Math.floor(b/d*f);Object.keys(p).length>N.MAX_NODES&&(o.innerHTML="",a.innerHTML="",p={}),u(v-1),u(v),u(v+1)});this.unsubscribeOnScroll.push(g)}}renderChannel(e,t,n,s){var{overlay:o}=t,a=function(c,p){var u={};for(var f in c)Object.prototype.hasOwnProperty.call(c,f)&&p.indexOf(f)<0&&(u[f]=c[f]);if(c!=null&&typeof Object.getOwnPropertySymbols=="function"){var m=0;for(f=Object.getOwnPropertySymbols(c);m<f.length;m++)p.indexOf(f[m])<0&&Object.prototype.propertyIsEnumerable.call(c,f[m])&&(u[f[m]]=c[f[m]])}return u}(t,["overlay"]);const l=document.createElement("div"),h=this.getHeight(a.height,a.splitChannels);l.style.height=`${h}px`,o&&s>0&&(l.style.marginTop=`-${h}px`),this.canvasWrapper.style.minHeight=`${h}px`,this.canvasWrapper.appendChild(l);const d=l.cloneNode();this.progressWrapper.appendChild(d),this.renderMultiCanvas(e,a,n,h,l,d)}render(e){return C(this,void 0,void 0,function*(){var t;this.timeouts.forEach(h=>h()),this.timeouts=[],this.canvasWrapper.innerHTML="",this.progressWrapper.innerHTML="",this.options.width!=null&&(this.scrollContainer.style.width=typeof this.options.width=="number"?`${this.options.width}px`:this.options.width);const n=this.getPixelRatio(),s=this.scrollContainer.clientWidth,o=Math.ceil(e.duration*(this.options.minPxPerSec||0));this.isScrollable=o>s;const a=this.options.fillParent&&!this.isScrollable,l=(a?s:o)*n;if(this.wrapper.style.width=a?"100%":`${o}px`,this.scrollContainer.style.overflowX=this.isScrollable?"auto":"hidden",this.scrollContainer.classList.toggle("noScrollbar",!!this.options.hideScrollbar),this.cursor.style.backgroundColor=`${this.options.cursorColor||this.options.progressColor}`,this.cursor.style.width=`${this.options.cursorWidth}px`,this.audioData=e,this.emit("render"),this.options.splitChannels)for(let h=0;h<e.numberOfChannels;h++){const d=Object.assign(Object.assign({},this.options),(t=this.options.splitChannels)===null||t===void 0?void 0:t[h]);this.renderChannel([e.getChannelData(h)],d,l,h)}else{const h=[e.getChannelData(0)];e.numberOfChannels>1&&h.push(e.getChannelData(1)),this.renderChannel(h,this.options,l,0)}Promise.resolve().then(()=>this.emit("rendered"))})}reRender(){if(this.unsubscribeOnScroll.forEach(n=>n()),this.unsubscribeOnScroll=[],!this.audioData)return;const{scrollWidth:e}=this.scrollContainer,{right:t}=this.progressWrapper.getBoundingClientRect();if(this.render(this.audioData),this.isScrollable&&e!==this.scrollContainer.scrollWidth){const{right:n}=this.progressWrapper.getBoundingClientRect();let s=n-t;s*=2,s=s<0?Math.floor(s):Math.ceil(s),s/=2,this.scrollContainer.scrollLeft+=s}}zoom(e){this.options.minPxPerSec=e,this.reRender()}scrollIntoView(e,t=!1){const{scrollLeft:n,scrollWidth:s,clientWidth:o}=this.scrollContainer,a=e*s,l=n,h=n+o,d=o/2;if(this.isDragging)a+30>h?this.scrollContainer.scrollLeft+=30:a-30<l&&(this.scrollContainer.scrollLeft-=30);else{(a<l||a>h)&&(this.scrollContainer.scrollLeft=a-(this.options.autoCenter?d:0));const c=a-n-d;t&&this.options.autoCenter&&c>0&&(this.scrollContainer.scrollLeft+=Math.min(c,10))}{const c=this.scrollContainer.scrollLeft,p=c/s,u=(c+o)/s;this.emit("scroll",p,u,c,c+o)}}renderProgress(e,t){if(isNaN(e))return;const n=100*e;this.canvasWrapper.style.clipPath=`polygon(${n}% 0, 100% 0, 100% 100%, ${n}% 100%)`,this.progressWrapper.style.width=`${n}%`,this.cursor.style.left=`${n}%`,this.cursor.style.transform=`translateX(-${Math.round(n)===100?this.options.cursorWidth:0}px)`,this.isScrollable&&this.options.autoScroll&&this.scrollIntoView(e,t)}exportImage(e,t,n){return C(this,void 0,void 0,function*(){const s=this.canvasWrapper.querySelectorAll("canvas");if(!s.length)throw new Error("No waveform data");if(n==="dataURL"){const o=Array.from(s).map(a=>a.toDataURL(e,t));return Promise.resolve(o)}return Promise.all(Array.from(s).map(o=>new Promise((a,l)=>{o.toBlob(h=>{h?a(h):l(new Error("Could not export image"))},e,t)})))})}}N.MAX_CANVAS_WIDTH=8e3,N.MAX_NODES=10;class X extends P{constructor(){super(...arguments),this.unsubscribe=()=>{}}start(){this.unsubscribe=this.on("tick",()=>{requestAnimationFrame(()=>{this.emit("tick")})}),this.emit("tick")}stop(){this.unsubscribe()}destroy(){this.unsubscribe()}}class z extends P{constructor(e=new AudioContext){super(),this.bufferNode=null,this.playStartTime=0,this.playedDuration=0,this._muted=!1,this._playbackRate=1,this._duration=void 0,this.buffer=null,this.currentSrc="",this.paused=!0,this.crossOrigin=null,this.seeking=!1,this.autoplay=!1,this.addEventListener=this.on,this.removeEventListener=this.un,this.audioContext=e,this.gainNode=this.audioContext.createGain(),this.gainNode.connect(this.audioContext.destination)}load(){return C(this,void 0,void 0,function*(){})}get src(){return this.currentSrc}set src(e){if(this.currentSrc=e,this._duration=void 0,!e)return this.buffer=null,void this.emit("emptied");fetch(e).then(t=>{if(t.status>=400)throw new Error(`Failed to fetch ${e}: ${t.status} (${t.statusText})`);return t.arrayBuffer()}).then(t=>this.currentSrc!==e?null:this.audioContext.decodeAudioData(t)).then(t=>{this.currentSrc===e&&(this.buffer=t,this.emit("loadedmetadata"),this.emit("canplay"),this.autoplay&&this.play())})}_play(){var e;if(!this.paused)return;this.paused=!1,(e=this.bufferNode)===null||e===void 0||e.disconnect(),this.bufferNode=this.audioContext.createBufferSource(),this.buffer&&(this.bufferNode.buffer=this.buffer),this.bufferNode.playbackRate.value=this._playbackRate,this.bufferNode.connect(this.gainNode);let t=this.playedDuration*this._playbackRate;t>=this.duration&&(t=0,this.playedDuration=0),this.bufferNode.start(this.audioContext.currentTime,t),this.playStartTime=this.audioContext.currentTime,this.bufferNode.onended=()=>{this.currentTime>=this.duration&&(this.pause(),this.emit("ended"))}}_pause(){var e;this.paused=!0,(e=this.bufferNode)===null||e===void 0||e.stop(),this.playedDuration+=this.audioContext.currentTime-this.playStartTime}play(){return C(this,void 0,void 0,function*(){this.paused&&(this._play(),this.emit("play"))})}pause(){this.paused||(this._pause(),this.emit("pause"))}stopAt(e){var t,n;const s=e-this.currentTime;(t=this.bufferNode)===null||t===void 0||t.stop(this.audioContext.currentTime+s),(n=this.bufferNode)===null||n===void 0||n.addEventListener("ended",()=>{this.bufferNode=null,this.pause()},{once:!0})}setSinkId(e){return C(this,void 0,void 0,function*(){return this.audioContext.setSinkId(e)})}get playbackRate(){return this._playbackRate}set playbackRate(e){this._playbackRate=e,this.bufferNode&&(this.bufferNode.playbackRate.value=e)}get currentTime(){return(this.paused?this.playedDuration:this.playedDuration+(this.audioContext.currentTime-this.playStartTime))*this._playbackRate}set currentTime(e){const t=!this.paused;t&&this._pause(),this.playedDuration=e/this._playbackRate,t&&this._play(),this.emit("seeking"),this.emit("timeupdate")}get duration(){var e,t;return(e=this._duration)!==null&&e!==void 0?e:((t=this.buffer)===null||t===void 0?void 0:t.duration)||0}set duration(e){this._duration=e}get volume(){return this.gainNode.gain.value}set volume(e){this.gainNode.gain.value=e,this.emit("volumechange")}get muted(){return this._muted}set muted(e){this._muted!==e&&(this._muted=e,this._muted?this.gainNode.disconnect():this.gainNode.connect(this.audioContext.destination))}canPlayType(e){return/^(audio|video)\//.test(e)}getGainNode(){return this.gainNode}getChannelData(){const e=[];if(!this.buffer)return e;const t=this.buffer.numberOfChannels;for(let n=0;n<t;n++)e.push(this.buffer.getChannelData(n));return e}}const U={waveColor:"#999",progressColor:"#555",cursorWidth:1,minPxPerSec:0,fillParent:!0,interact:!0,dragToSeek:!1,autoScroll:!0,autoCenter:!0,sampleRate:8e3};class D extends G{static create(e){return new D(e)}constructor(e){const t=e.media||(e.backend==="WebAudio"?new z:void 0);super({media:t,mediaControls:e.mediaControls,autoplay:e.autoplay,playbackRate:e.audioRate}),this.plugins=[],this.decodedData=null,this.subscriptions=[],this.mediaSubscriptions=[],this.abortController=null,this.options=Object.assign({},U,e),this.timer=new X;const n=t?void 0:this.getMediaElement();this.renderer=new N(this.options,n),this.initPlayerEvents(),this.initRendererEvents(),this.initTimerEvents(),this.initPlugins();const s=this.options.url||this.getSrc()||"";Promise.resolve().then(()=>{this.emit("init");const{peaks:o,duration:a}=this.options;(s||o&&a)&&this.load(s,o,a).catch(()=>null)})}updateProgress(e=this.getCurrentTime()){return this.renderer.renderProgress(e/this.getDuration(),this.isPlaying()),e}initTimerEvents(){this.subscriptions.push(this.timer.on("tick",()=>{if(!this.isSeeking()){const e=this.updateProgress();this.emit("timeupdate",e),this.emit("audioprocess",e)}}))}initPlayerEvents(){this.isPlaying()&&(this.emit("play"),this.timer.start()),this.mediaSubscriptions.push(this.onMediaEvent("timeupdate",()=>{const e=this.updateProgress();this.emit("timeupdate",e)}),this.onMediaEvent("play",()=>{this.emit("play"),this.timer.start()}),this.onMediaEvent("pause",()=>{this.emit("pause"),this.timer.stop()}),this.onMediaEvent("emptied",()=>{this.timer.stop()}),this.onMediaEvent("ended",()=>{this.emit("timeupdate",this.getDuration()),this.emit("finish")}),this.onMediaEvent("seeking",()=>{this.emit("seeking",this.getCurrentTime())}),this.onMediaEvent("error",e=>{var t;this.emit("error",(t=this.getMediaElement().error)!==null&&t!==void 0?t:new Error("Media error"))}))}initRendererEvents(){this.subscriptions.push(this.renderer.on("click",(e,t)=>{this.options.interact&&(this.seekTo(e),this.emit("interaction",e*this.getDuration()),this.emit("click",e,t))}),this.renderer.on("dblclick",(e,t)=>{this.emit("dblclick",e,t)}),this.renderer.on("scroll",(e,t,n,s)=>{const o=this.getDuration();this.emit("scroll",e*o,t*o,n,s)}),this.renderer.on("render",()=>{this.emit("redraw")}),this.renderer.on("rendered",()=>{this.emit("redrawcomplete")}),this.renderer.on("dragstart",e=>{this.emit("dragstart",e)}),this.renderer.on("dragend",e=>{this.emit("dragend",e)}));{let e;this.subscriptions.push(this.renderer.on("drag",t=>{if(!this.options.interact)return;let n;this.renderer.renderProgress(t),clearTimeout(e),this.isPlaying()?n=0:this.options.dragToSeek===!0?n=200:typeof this.options.dragToSeek=="object"&&this.options.dragToSeek!==void 0&&(n=this.options.dragToSeek.debounceTime),e=setTimeout(()=>{this.seekTo(t)},n),this.emit("interaction",t*this.getDuration()),this.emit("drag",t)}))}}initPlugins(){var e;!((e=this.options.plugins)===null||e===void 0)&&e.length&&this.options.plugins.forEach(t=>{this.registerPlugin(t)})}unsubscribePlayerEvents(){this.mediaSubscriptions.forEach(e=>e()),this.mediaSubscriptions=[]}setOptions(e){this.options=Object.assign({},this.options,e),e.duration&&!e.peaks&&(this.decodedData=R.createBuffer(this.exportPeaks(),e.duration)),e.peaks&&e.duration&&(this.decodedData=R.createBuffer(e.peaks,e.duration)),this.renderer.setOptions(this.options),e.audioRate&&this.setPlaybackRate(e.audioRate),e.mediaControls!=null&&(this.getMediaElement().controls=e.mediaControls)}registerPlugin(e){return e._init(this),this.plugins.push(e),this.subscriptions.push(e.once("destroy",()=>{this.plugins=this.plugins.filter(t=>t!==e)})),e}getWrapper(){return this.renderer.getWrapper()}getWidth(){return this.renderer.getWidth()}getScroll(){return this.renderer.getScroll()}setScroll(e){return this.renderer.setScroll(e)}setScrollTime(e){const t=e/this.getDuration();this.renderer.setScrollPercentage(t)}getActivePlugins(){return this.plugins}loadAudio(e,t,n,s){return C(this,void 0,void 0,function*(){var o;if(this.emit("load",e),!this.options.media&&this.isPlaying()&&this.pause(),this.decodedData=null,!t&&!n){const l=this.options.fetchParams||{};window.AbortController&&!l.signal&&(this.abortController=new AbortController,l.signal=(o=this.abortController)===null||o===void 0?void 0:o.signal);const h=c=>this.emit("loading",c);t=yield F.fetchBlob(e,h,l);const d=this.options.blobMimeType;d&&(t=new Blob([t],{type:d}))}this.setSrc(e,t);const a=yield new Promise(l=>{const h=s||this.getDuration();h?l(h):this.mediaSubscriptions.push(this.onMediaEvent("loadedmetadata",()=>l(this.getDuration()),{once:!0}))});if(!e&&!t){const l=this.getMediaElement();l instanceof z&&(l.duration=a)}if(n)this.decodedData=R.createBuffer(n,a||0);else if(t){const l=yield t.arrayBuffer();this.decodedData=yield R.decode(l,this.options.sampleRate)}this.decodedData&&(this.emit("decode",this.getDuration()),this.renderer.render(this.decodedData)),this.emit("ready",this.getDuration())})}load(e,t,n){return C(this,void 0,void 0,function*(){try{return yield this.loadAudio(e,void 0,t,n)}catch(s){throw this.emit("error",s),s}})}loadBlob(e,t,n){return C(this,void 0,void 0,function*(){try{return yield this.loadAudio("",e,t,n)}catch(s){throw this.emit("error",s),s}})}zoom(e){if(!this.decodedData)throw new Error("No audio loaded");this.renderer.zoom(e),this.emit("zoom",e)}getDecodedData(){return this.decodedData}exportPeaks({channels:e=2,maxLength:t=8e3,precision:n=1e4}={}){if(!this.decodedData)throw new Error("The audio has not been decoded yet");const s=Math.min(e,this.decodedData.numberOfChannels),o=[];for(let a=0;a<s;a++){const l=this.decodedData.getChannelData(a),h=[],d=l.length/t;for(let c=0;c<t;c++){const p=l.slice(Math.floor(c*d),Math.ceil((c+1)*d));let u=0;for(let f=0;f<p.length;f++){const m=p[f];Math.abs(m)>Math.abs(u)&&(u=m)}h.push(Math.round(u*n)/n)}o.push(h)}return o}getDuration(){let e=super.getDuration()||0;return e!==0&&e!==1/0||!this.decodedData||(e=this.decodedData.duration),e}toggleInteraction(e){this.options.interact=e}setTime(e){super.setTime(e),this.updateProgress(e),this.emit("timeupdate",e)}seekTo(e){const t=this.getDuration()*e;this.setTime(t)}playPause(){return C(this,void 0,void 0,function*(){return this.isPlaying()?this.pause():this.play()})}stop(){this.pause(),this.setTime(0)}skip(e){this.setTime(this.getCurrentTime()+e)}empty(){this.load("",[[0]],.001)}setMediaElement(e){this.unsubscribePlayerEvents(),super.setMediaElement(e),this.initPlayerEvents()}exportImage(){return C(this,arguments,void 0,function*(e="image/png",t=1,n="dataURL"){return this.renderer.exportImage(e,t,n)})}destroy(){var e;this.emit("destroy"),(e=this.abortController)===null||e===void 0||e.abort(),this.plugins.forEach(t=>t.destroy()),this.subscriptions.forEach(t=>t()),this.unsubscribePlayerEvents(),this.timer.destroy(),this.renderer.destroy(),super.destroy()}}D.BasePlugin=class extends P{constructor(i){super(),this.subscriptions=[],this.options=i}onInit(){}_init(i){this.wavesurfer=i,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach(i=>i())}},D.dom=q;var Y=function(){function i(){this.buttonColor="#ffffff",this.buttonHoverColor="#ff00ff",this.waveColor="#ff4e00",this.progressColor="#dd5e98",this.cursorColor="#ddd5e9",this.backgroundColor="#ffffff",this.textColor="lightgrey"}return i}(),Z=function(){function i(){this.playBtn=!0,this.nextChapterBtn=!0,this.prevChapterBtn=!0,this.timer=!0}return i}(),J=function(){function i(){this.showCover=!0,this.showTitle=!0,this.showDescription=!0,this.defaultVolume=1,this.autoPlaylist=!1,this.dragToSeek=!0,this.sampleRate=8e3,this.height=20,this.cursorWidth=2,this.barWidth=2,this.barGap=2,this.barRadius=2}return i}();function K(i){var e=i instanceof HTMLElement?i:document.getElementById(i);if(e){var t=e.getBoundingClientRect();return{width:t.width,height:t.height}}return{width:0,height:0}}function Q(i){var e=Math.floor(i/3600),t=Math.floor(i%3600/60),n=Math.floor(i%60),s=e>0?"".concat(e.toString().padStart(2,"0"),":"):"",o="".concat(t.toString().padStart(2,"0"),":"),a=n.toString().padStart(2,"0");return"".concat(s).concat(o).concat(a)}var ee=`
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" enable-background="new 0 0 64 64"><path d="m53.213 10.788c-11.715-11.717-30.711-11.717-42.426 0-11.716 11.715-11.716 30.71 0 42.425 11.715 11.715 30.711 11.715 42.426 0 11.716-11.715 11.716-30.711 0-42.425m-28.213 41.224v-40.023l20 20.011-20 20.012" fill="currentColor"/></svg>
`,te=`
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" enable-background="new 0 0 64 64"><path d="m32 2c-16.568 0-30 13.432-30 30 0 16.569 13.432 30 30 30s30-13.431 30-30c0-16.568-13.432-30-30-30m-4 48h-8v-36h8v36m16 0h-8v-36h8v36" fill="currentColor"/></svg>
`,ne=`
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" id="volume-up">
<path fill="currentColor" d="M3 10v4c0 .55.45 1 1 1h3l3.29 3.29c.63.63 1.71.18 1.71-.71V6.41c0-.89-1.08-1.34-1.71-.71L7 9H4c-.55 0-1 .45-1 1zm13.5 2c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 4.45v.2c0 .38.25.71.6.85C17.18 6.53 19 9.06 19 12s-1.82 5.47-4.4 6.5c-.36.14-.6.47-.6.85v.2c0 .63.63 1.07 1.21.85C18.6 19.11 21 15.84 21 12s-2.4-7.11-5.79-8.4c-.58-.23-1.21.22-1.21.85z"></path>
</svg>
`,ie=`
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" enable-background="new 0 0 64 64">
<path d="M 52 46 L 46.781 46 L 46.781 32 L 29.391 46 L 29.391 32 L 12 46 L 12 18 L 29.392 32 L 29.392 18 L 46.782 32 L 46.782 18 L 52 18 L 52 46 Z"
transform="matrix(0.9999999999999999, 0, 0, 0.9999999999999999, 0, -8.881784197001252e-16)"/>
</svg>
`,re=`
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" enable-background="new 0 0 64 64">
<path d="M 52 46 L 46.781 46 L 46.781 32 L 29.391 46 L 29.391 32 L 12 46 L 12 18 L 29.392 32 L 29.392 18 L 46.782 32 L 46.782 18 L 52 18 L 52 46 Z"
style="transform-box: fill-box; transform-origin: 50% 50%;" transform="matrix(-1, 0, 0, -1, 0, 0.000001)"></path>
</svg>
`;function se(i,e){e===void 0&&(e="");var t="";switch(i){case"play":t=ee;break;case"pause":t=te;break;case"volume":t=ne;break;case"next":t=ie;break;case"prev":t=re;break;default:t=""}return t.replaceAll("currentColor",e)}const oe={name:"Loader-Component",props:{size:{type:String,required:!1,default:"100px"},color:{type:String,required:!1,default:"#FF156D"},progress:{type:Number,required:!1,default:0},className:{type:String,default:"absolute-center"}}},I=(i,e)=>{const t=i.__vccOpts||i;for(const[n,s]of e)t[n]=s;return t},ae={key:0,class:"absolute-center z-20"},le={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 200 200"},ce={id:"a10",cx:".66",fx:".66",cy:".3125",fy:".3125",gradientTransform:"scale(1.5)"},de=["stop-color"],he=["stop-color"],ue=["stop-color"],pe=["stop-color"],fe=["stop-color"],me=["stroke"];function ge(i,e,t,n,s,o){return r.openBlock(),r.createElementBlock("div",{style:r.normalizeStyle({width:`${t.size}`,height:`${t.size}`}),class:r.normalizeClass(["z-10",t.className])},[t.progress?(r.openBlock(),r.createElementBlock("div",ae,r.toDisplayString(t.progress)+"%",1)):r.createCommentVNode("",!0),(r.openBlock(),r.createElementBlock("svg",le,[r.createElementVNode("radialGradient",ce,[r.createElementVNode("stop",{offset:"0","stop-color":t.color},null,8,de),r.createElementVNode("stop",{offset:".3","stop-color":t.color,"stop-opacity":".9"},null,8,he),r.createElementVNode("stop",{offset:".6","stop-color":t.color,"stop-opacity":".6"},null,8,ue),r.createElementVNode("stop",{offset:".8","stop-color":t.color,"stop-opacity":".3"},null,8,pe),r.createElementVNode("stop",{offset:"1","stop-color":t.color,"stop-opacity":"0"},null,8,fe)]),e[0]||(e[0]=r.createElementVNode("circle",{"transform-origin":"center",fill:"none",stroke:"url(#a10)","stroke-width":"16","stroke-linecap":"round","stroke-dasharray":"200 1000","stroke-dashoffset":"0",cx:"100",cy:"100",r:"70"},[r.createElementVNode("animateTransform",{type:"rotate",attributeName:"transform",calcMode:"spline",dur:"2",values:"360;0",keyTimes:"0;1",keySplines:"0 0 1 1",repeatCount:"indefinite"})],-1)),r.createElementVNode("circle",{"transform-origin":"center",fill:"none",opacity:".2",stroke:t.color,"stroke-width":"16","stroke-linecap":"round",cx:"100",cy:"100",r:"70"},null,8,me)]))],6)}const ye=I(oe,[["render",ge]]);var W=r.defineComponent({components:{Loader:ye},props:{playlist:{type:Array,required:!0},colors:{type:Object,default:function(){return new Y}},buttons:{type:Object,default:function(){return new Z}},options:{type:Object,default:function(){return new J}}},setup:function(){return{formatTime:Q,getIcon:se}},data:function(){return{currentIndex:0,containerElem:null,parentContainer:null,wavesurfer:null,ready:!1,currentTime:0,duration:0,loadingProgress:0,volume:0,redrawComplete:!1,paused:void 0,covers:new Array,parentRect:{width:0,height:0}}},computed:{isPlaylist:function(){return this.playlist.length>1},compact:function(){return this.parentRect.width<=200},maxTitleWidth:function(){var i=this.parentRect.width-46-8-58-(this.options.showCover&&!this.compact?150:0)-10;return this.compact?this.parentRect.width-4:i},current:function(){var i=this,e=this.playlist[this.currentIndex].cover;if(!this.covers.includes(e)){var t=new Image;t.onload=function(){i.covers.push(e)},t.src=e}return this.playlist[this.currentIndex]}},methods:{next:function(){var i=this.currentIndex+1;i>this.playlist.length-1&&(i=0),this.currentIndex=i,this.ready=!1,this.load()},prev:function(){var i=this.currentIndex-1;i<0&&(i=this.playlist.length),this.currentIndex=i,this.ready=!1,this.load()},load:function(){var i=this;this.wavesurfer&&this.wavesurfer.destroy(),this.parentRect=K(this.parentContainer),this.paused=void 0,this.redrawComplete=!1,this.currentTime=0,this.duration=0,this.wavesurfer=D.create({container:this.containerElem,waveColor:this.colors.waveColor,progressColor:this.colors.progressColor,cursorColor:this.colors.cursorColor,cursorWidth:this.options.cursorWidth,barWidth:this.options.barWidth,barRadius:this.options.barRadius,barGap:this.options.barGap,dragToSeek:this.options.dragToSeek,backend:"WebAudio",mediaControls:!0,height:this.options.height,normalize:!0}),this.volume=this.options.defaultVolume,this.wavesurfer.setVolume(this.volume),this.wavesurfer.on("audioprocess",function(){i.wavesurfer&&(i.currentTime=i.wavesurfer.getCurrentTime())}),this.wavesurfer.once("decode",function(e){i.duration=e,i.currentTime=0,i.ready=!0}),this.wavesurfer.on("loading",function(e){i.loadingProgress=e}),this.wavesurfer.once("redrawcomplete",function(){i.redrawComplete=!0}),this.wavesurfer.once("redraw",function(){i.redrawComplete=!1}),this.wavesurfer.load(this.current.url)},play:function(){this.wavesurfer&&(this.paused||this.paused===void 0?(this.wavesurfer.play(),this.paused=!1):(this.wavesurfer.pause(),this.paused=!0))}},unmounted:function(){this.wavesurfer&&(this.wavesurfer.isPlaying()&&this.wavesurfer.stop(),this.wavesurfer.destroy())},mounted:function(){this.containerElem=this.$refs.container,this.parentContainer=this.$refs["parent-container"],this.load()}}),$=function(){r.useCssVars(function(i){return{bf7772c8:i.colors.buttonColor,"2ecc5fee":i.colors.buttonHoverColor}})},A=W.setup;W.setup=A?function(i,e){return $(),A(i,e)}:$;const be=["src","alt"],ve={key:1,class:"w-full flex justify-center"},Ce={class:"p-1 flex flex-col w-full"},we={class:"flex items-center gap-x-2"},ke=["innerHTML"],Ee={key:1},Se=["innerHTML"],Te=["innerHTML"],xe=["innerHTML"],Me={key:0,class:"flex gap-x-2 items-end"},Le=["innerHTML"],Be=["innerHTML"],Ne={ref:"container",class:"w-full mt-1"},Pe={class:"flex flex-col gap-x-2 mt-1 pt-1"};function De(i,e,t,n,s,o){const a=r.resolveComponent("Loader");return r.openBlock(),r.createElementBlock("div",{class:"full-size relative",ref:"parent-container",style:r.normalizeStyle(`background-color:${i.colors.backgroundColor}`)},[i.ready?r.createCommentVNode("",!0):(r.openBlock(),r.createBlock(a,{key:0,size:"100px",color:i.colors.progressColor,progress:i.loadingProgress},null,8,["color","progress"])),r.createElementVNode("div",{class:r.normalizeClass(["flex full-size",{invisible:!i.ready,"flex-col":i.compact}])},[i.options.showCover?(r.openBlock(),r.createElementBlock("div",{key:0,class:r.normalizeClass([{"w-[150px]":!i.compact,"w-full":i.compact},"p-1"])},[i.covers.includes(i.current.cover)?(r.openBlock(),r.createElementBlock("img",{key:0,class:"w-full border",src:i.current.cover,alt:i.current.title},null,8,be)):(r.openBlock(),r.createElementBlock("div",ve,[r.createVNode(a,{size:"50px","class-name":"relative opacity-30",color:"lightgary"})]))],2)):r.createCommentVNode("",!0),r.createElementVNode("div",Ce,[r.createElementVNode("div",{class:r.normalizeClass(["flex py-1 items-center w-full",{"flex-col":i.compact,"justify-center":i.compact,"justify-between":!i.compact}])},[r.createElementVNode("div",{class:r.normalizeClass(["flex w-full",{"flex-col":i.compact,"items-center":i.compact,"items-start":!i.compact}])},[r.createElementVNode("div",we,[i.compact&&i.buttons.prevChapterBtn?(r.openBlock(),r.createElementBlock("div",{key:0,class:"btn w-[35px] h-[35px]",onClick:e[0]||(e[0]=(...l)=>i.prev&&i.prev(...l))},[r.createElementVNode("span",{innerHTML:i.getIcon("prev")},null,8,ke)])):r.createCommentVNode("",!0),i.buttons.playBtn?(r.openBlock(),r.createElementBlock("div",Ee,[i.paused===!1?(r.openBlock(),r.createElementBlock("div",{key:0,class:"btn w-[46px] h-[46px]",onClick:e[1]||(e[1]=()=>i.play())},[r.createElementVNode("span",{innerHTML:i.getIcon("pause")},null,8,Se)])):r.createCommentVNode("",!0),i.paused===void 0||i.paused===!0?(r.openBlock(),r.createElementBlock("div",{key:1,class:"btn w-[46px] h-[46px]",onClick:e[2]||(e[2]=()=>i.play())},[r.createElementVNode("span",{innerHTML:i.getIcon("play")},null,8,Te)])):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0),i.compact&&i.buttons.nextChapterBtn?(r.openBlock(),r.createElementBlock("div",{key:2,class:"btn w-[35px] h-[35px]",onClick:e[3]||(e[3]=(...l)=>i.next&&i.next(...l))},[r.createElementVNode("span",{innerHTML:i.getIcon("next")},null,8,xe)])):r.createCommentVNode("",!0)]),i.options.showTitle?(r.openBlock(),r.createElementBlock("div",{key:0,class:r.normalizeClass(["flex flex-col ml-2 gap-x-0",{"text-center":i.compact,"items-center":i.compact}]),style:r.normalizeStyle({color:i.colors.textColor})},[r.createElementVNode("div",{class:"font-semibold truncate text-nowrap",style:r.normalizeStyle({width:`${i.maxTitleWidth}px`})},r.toDisplayString(i.current.title),5),i.current.artist?(r.openBlock(),r.createElementBlock("div",{key:0,class:"text-sm truncate text-nowrap",style:r.normalizeStyle({width:`${i.maxTitleWidth}px`})},r.toDisplayString(i.current.artist),5)):r.createCommentVNode("",!0)],6)):r.createCommentVNode("",!0)],2),i.isPlaylist&&!i.compact?(r.openBlock(),r.createElementBlock("div",Me,[i.buttons.prevChapterBtn?(r.openBlock(),r.createElementBlock("div",{key:0,class:"btn w-[25px] h-[25px]",onClick:e[4]||(e[4]=(...l)=>i.prev&&i.prev(...l))},[r.createElementVNode("span",{innerHTML:i.getIcon("prev")},null,8,Le)])):r.createCommentVNode("",!0),i.buttons.nextChapterBtn?(r.openBlock(),r.createElementBlock("div",{key:1,class:"btn w-[25px] h-[25px]",onClick:e[5]||(e[5]=(...l)=>i.next&&i.next(...l))},[r.createElementVNode("span",{innerHTML:i.getIcon("next")},null,8,Be)])):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0)],2),r.createElementVNode("div",Ne,null,512),r.createElementVNode("div",Pe,[i.ready&&i.buttons.timer?(r.openBlock(),r.createElementBlock("div",{key:0,class:"text-sm",style:r.normalizeStyle(`color:${i.colors.textColor}`)},r.toDisplayString(i.formatTime(i.currentTime))+" / "+r.toDisplayString(i.formatTime(i.duration)),5)):r.createCommentVNode("",!0),i.options.showDescription&&i.current.description?(r.openBlock(),r.createElementBlock("div",{key:1,class:"text-sm py-2",style:r.normalizeStyle(`color:${i.colors.textColor}`)},r.toDisplayString(i.current.description),5)):r.createCommentVNode("",!0)])])],2)],4)}const H=I(W,[["render",De],["__scopeId","data-v-0cac8886"]]);var Re=function(i){i.component("b-upload-files-modal",H)};const We={install:Re};T.Player=H,T.default=We,Object.defineProperties(T,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});