wavesurfer.js 7.12.7 → 7.12.9

package/dist/plugins/envelope.cjs

@@ -1 +1 @@
-"use strict";class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.set(e.pointerId,e),r.size>1)return;let a=e.clientX,u=e.clientY,c=!1;const d=Date.now(),p=t.getBoundingClientRect(),{left:v,top:m}=p,g=t=>{if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-d<o)return;const e=t.clientX,s=t.clientY,h=e-a,p=s-u;(c||Math.abs(h)>i||Math.abs(p)>i)&&(t.preventDefault(),t.stopPropagation(),c||(n.set({type:"start",x:a-v,y:u-m}),c=!0),n.set({type:"move",x:e-v,y:s-m,deltaX:h,deltaY:p}),a=e,u=s)},f=t=>{if(r.delete(t.pointerId),c){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-v,y:i-m})}h()},y=t=>{r.delete(t.pointerId),t.relatedTarget&&t.relatedTarget!==document.documentElement||f(t)},P=t=>{c&&(t.stopPropagation(),t.preventDefault())},w=t=>{t.defaultPrevented||r.size>1||c&&t.preventDefault()};document.addEventListener("pointermove",g),document.addEventListener("pointerup",f),document.addEventListener("pointerout",y),document.addEventListener("pointercancel",y),document.addEventListener("touchmove",w,{passive:!1}),document.addEventListener("click",P,{capture:!0}),h=()=>{document.removeEventListener("pointermove",g),document.removeEventListener("pointerup",f),document.removeEventListener("pointerout",y),document.removeEventListener("pointercancel",y),document.removeEventListener("touchmove",w),setTimeout((()=>{document.removeEventListener("click",P,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}module.exports=h;
+"use strict";class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.has(e.pointerId))return;if(r.set(e.pointerId,e),r.size>1)return;const a=e.pointerId;let u=e.clientX,c=e.clientY,d=!1;const p=Date.now(),v=t.getBoundingClientRect(),{left:m,top:g}=v,f=t=>{if(t.pointerId!==a)return;if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-p<o)return;const e=t.clientX,s=t.clientY,h=e-u,v=s-c;(d||Math.abs(h)>i||Math.abs(v)>i)&&(t.preventDefault(),t.stopPropagation(),d||(n.set({type:"start",x:u-m,y:c-g}),d=!0),n.set({type:"move",x:e-m,y:s-g,deltaX:h,deltaY:v}),u=e,c=s)},y=t=>{if(r.delete(t.pointerId)){if(t.pointerId===a&&d){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-m,y:i-g})}0===r.size&&h()}},P=t=>{t.relatedTarget&&t.relatedTarget!==document.documentElement||y(t)},w=t=>{d&&(t.stopPropagation(),t.preventDefault())},b=t=>{t.defaultPrevented||r.size>1||d&&t.preventDefault()};document.addEventListener("pointermove",f),document.addEventListener("pointerup",y),document.addEventListener("pointerout",P),document.addEventListener("pointercancel",P),document.addEventListener("touchmove",b,{passive:!1}),document.addEventListener("click",w,{capture:!0}),h=()=>{document.removeEventListener("pointermove",f),document.removeEventListener("pointerup",y),document.removeEventListener("pointerout",P),document.removeEventListener("pointercancel",P),document.removeEventListener("touchmove",b),setTimeout((()=>{document.removeEventListener("click",w,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}module.exports=h;

package/dist/plugins/envelope.esm.js

@@ -1 +1 @@
-class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.set(e.pointerId,e),r.size>1)return;let a=e.clientX,u=e.clientY,c=!1;const d=Date.now(),p=t.getBoundingClientRect(),{left:v,top:m}=p,g=t=>{if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-d<o)return;const e=t.clientX,s=t.clientY,h=e-a,p=s-u;(c||Math.abs(h)>i||Math.abs(p)>i)&&(t.preventDefault(),t.stopPropagation(),c||(n.set({type:"start",x:a-v,y:u-m}),c=!0),n.set({type:"move",x:e-v,y:s-m,deltaX:h,deltaY:p}),a=e,u=s)},f=t=>{if(r.delete(t.pointerId),c){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-v,y:i-m})}h()},y=t=>{r.delete(t.pointerId),t.relatedTarget&&t.relatedTarget!==document.documentElement||f(t)},P=t=>{c&&(t.stopPropagation(),t.preventDefault())},w=t=>{t.defaultPrevented||r.size>1||c&&t.preventDefault()};document.addEventListener("pointermove",g),document.addEventListener("pointerup",f),document.addEventListener("pointerout",y),document.addEventListener("pointercancel",y),document.addEventListener("touchmove",w,{passive:!1}),document.addEventListener("click",P,{capture:!0}),h=()=>{document.removeEventListener("pointermove",g),document.removeEventListener("pointerup",f),document.removeEventListener("pointerout",y),document.removeEventListener("pointercancel",y),document.removeEventListener("touchmove",w),setTimeout((()=>{document.removeEventListener("click",P,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}export{h as default};
+class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.has(e.pointerId))return;if(r.set(e.pointerId,e),r.size>1)return;const a=e.pointerId;let u=e.clientX,c=e.clientY,d=!1;const p=Date.now(),v=t.getBoundingClientRect(),{left:m,top:g}=v,f=t=>{if(t.pointerId!==a)return;if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-p<o)return;const e=t.clientX,s=t.clientY,h=e-u,v=s-c;(d||Math.abs(h)>i||Math.abs(v)>i)&&(t.preventDefault(),t.stopPropagation(),d||(n.set({type:"start",x:u-m,y:c-g}),d=!0),n.set({type:"move",x:e-m,y:s-g,deltaX:h,deltaY:v}),u=e,c=s)},y=t=>{if(r.delete(t.pointerId)){if(t.pointerId===a&&d){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-m,y:i-g})}0===r.size&&h()}},P=t=>{t.relatedTarget&&t.relatedTarget!==document.documentElement||y(t)},w=t=>{d&&(t.stopPropagation(),t.preventDefault())},b=t=>{t.defaultPrevented||r.size>1||d&&t.preventDefault()};document.addEventListener("pointermove",f),document.addEventListener("pointerup",y),document.addEventListener("pointerout",P),document.addEventListener("pointercancel",P),document.addEventListener("touchmove",b,{passive:!1}),document.addEventListener("click",w,{capture:!0}),h=()=>{document.removeEventListener("pointermove",f),document.removeEventListener("pointerup",y),document.removeEventListener("pointerout",P),document.removeEventListener("pointercancel",P),document.removeEventListener("touchmove",b),setTimeout((()=>{document.removeEventListener("click",w,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}export{h as default};

package/dist/plugins/envelope.js

@@ -1 +1 @@
-class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.set(e.pointerId,e),r.size>1)return;let a=e.clientX,u=e.clientY,c=!1;const d=Date.now(),p=t.getBoundingClientRect(),{left:v,top:m}=p,g=t=>{if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-d<o)return;const e=t.clientX,s=t.clientY,h=e-a,p=s-u;(c||Math.abs(h)>i||Math.abs(p)>i)&&(t.preventDefault(),t.stopPropagation(),c||(n.set({type:"start",x:a-v,y:u-m}),c=!0),n.set({type:"move",x:e-v,y:s-m,deltaX:h,deltaY:p}),a=e,u=s)},f=t=>{if(r.delete(t.pointerId),c){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-v,y:i-m})}h()},y=t=>{r.delete(t.pointerId),t.relatedTarget&&t.relatedTarget!==document.documentElement||f(t)},P=t=>{c&&(t.stopPropagation(),t.preventDefault())},w=t=>{t.defaultPrevented||r.size>1||c&&t.preventDefault()};document.addEventListener("pointermove",g),document.addEventListener("pointerup",f),document.addEventListener("pointerout",y),document.addEventListener("pointercancel",y),document.addEventListener("touchmove",w,{passive:!1}),document.addEventListener("click",P,{capture:!0}),h=()=>{document.removeEventListener("pointermove",g),document.removeEventListener("pointerup",f),document.removeEventListener("pointerout",y),document.removeEventListener("pointercancel",y),document.removeEventListener("touchmove",w),setTimeout((()=>{document.removeEventListener("click",P,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}export{h as default};
+class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.has(e.pointerId))return;if(r.set(e.pointerId,e),r.size>1)return;const a=e.pointerId;let u=e.clientX,c=e.clientY,d=!1;const p=Date.now(),v=t.getBoundingClientRect(),{left:m,top:g}=v,f=t=>{if(t.pointerId!==a)return;if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-p<o)return;const e=t.clientX,s=t.clientY,h=e-u,v=s-c;(d||Math.abs(h)>i||Math.abs(v)>i)&&(t.preventDefault(),t.stopPropagation(),d||(n.set({type:"start",x:u-m,y:c-g}),d=!0),n.set({type:"move",x:e-m,y:s-g,deltaX:h,deltaY:v}),u=e,c=s)},y=t=>{if(r.delete(t.pointerId)){if(t.pointerId===a&&d){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-m,y:i-g})}0===r.size&&h()}},P=t=>{t.relatedTarget&&t.relatedTarget!==document.documentElement||y(t)},w=t=>{d&&(t.stopPropagation(),t.preventDefault())},b=t=>{t.defaultPrevented||r.size>1||d&&t.preventDefault()};document.addEventListener("pointermove",f),document.addEventListener("pointerup",y),document.addEventListener("pointerout",P),document.addEventListener("pointercancel",P),document.addEventListener("touchmove",b,{passive:!1}),document.addEventListener("click",w,{capture:!0}),h=()=>{document.removeEventListener("pointermove",f),document.removeEventListener("pointerup",y),document.removeEventListener("pointerout",P),document.removeEventListener("pointercancel",P),document.removeEventListener("touchmove",b),setTimeout((()=>{document.removeEventListener("click",w,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}export{h as default};

package/dist/plugins/envelope.min.js

@@ -1 +1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):((t="undefined"!=typeof globalThis?globalThis:t||self).WaveSurfer=t.WaveSurfer||{},t.WaveSurfer.Envelope=e())}(this,(function(){"use strict";class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const a=e=>{if(e.button!==s)return;if(r.set(e.pointerId,e),r.size>1)return;let a=e.clientX,u=e.clientY,c=!1;const d=Date.now(),p=t.getBoundingClientRect(),{left:v,top:m}=p,f=t=>{if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-d<o)return;const e=t.clientX,s=t.clientY,h=e-a,p=s-u;(c||Math.abs(h)>i||Math.abs(p)>i)&&(t.preventDefault(),t.stopPropagation(),c||(n.set({type:"start",x:a-v,y:u-m}),c=!0),n.set({type:"move",x:e-v,y:s-m,deltaX:h,deltaY:p}),a=e,u=s)},g=t=>{if(r.delete(t.pointerId),c){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-v,y:i-m})}h()},y=t=>{r.delete(t.pointerId),t.relatedTarget&&t.relatedTarget!==document.documentElement||g(t)},P=t=>{c&&(t.stopPropagation(),t.preventDefault())},b=t=>{t.defaultPrevented||r.size>1||c&&t.preventDefault()};document.addEventListener("pointermove",f),document.addEventListener("pointerup",g),document.addEventListener("pointerout",y),document.addEventListener("pointercancel",y),document.addEventListener("touchmove",b,{passive:!1}),document.addEventListener("click",P,{capture:!0}),h=()=>{document.removeEventListener("pointermove",f),document.removeEventListener("pointerup",g),document.removeEventListener("pointerout",y),document.removeEventListener("pointercancel",y),document.removeEventListener("touchmove",b),setTimeout((()=>{document.removeEventListener("click",P,{capture:!0})}),10)}};t.addEventListener("pointerdown",a);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",a),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const a=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):a()},this.touchMoveListener=a,this.touchEndListener=a,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,a=s.createSVGPoint();a.x=t*o,a.y=n-e*n;const u=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(a,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:a,circle:u}),this.makeDraggable(u,((t,e)=>{const s=a.x+t,r=a.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>a.x)),d=Array.from(c).findLast((t=>t.x<a.x));l&&s>=l.x||d&&s<=d.x||(a.x=s,a.y=r,u.setAttribute("cx",s.toString()),u.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}return h}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):((t="undefined"!=typeof globalThis?globalThis:t||self).WaveSurfer=t.WaveSurfer||{},t.WaveSurfer.Envelope=e())}(this,(function(){"use strict";class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),null==i?void 0:i.once){const i=(...s)=>{this.un(t,i),e(...s)};return this.listeners[t].add(i),()=>this.un(t,i)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function i(t,e){const s=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,o]of Object.entries(e))if("children"===t&&o)for(const[t,e]of Object.entries(o))e instanceof Node?s.appendChild(e):"string"==typeof e?s.appendChild(document.createTextNode(e)):s.appendChild(i(t,e));else"style"===t?Object.assign(s.style,o):"textContent"===t?s.textContent=o:s.setAttribute(t,o.toString());return s}function s(t,e,s){const o=i(t,e||{});return null==s||s.appendChild(o),o}function o(t,e){let i;const s=()=>{i&&(i(),i=void 0),i=t()},o=e.map((t=>t.subscribe(s)));return s(),()=>{i&&(i(),i=void 0),o.forEach((t=>t()))}}function n(t,e={}){const{threshold:i=3,mouseButton:s=0,touchDelay:o=100}=e,n=function(t){let e=t;const i=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,i.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(i.add(t),()=>i.delete(t))}}(null),r=new Map,l=matchMedia("(pointer: coarse)").matches;let h=()=>{};const u=e=>{if(e.button!==s)return;if(r.has(e.pointerId))return;if(r.set(e.pointerId,e),r.size>1)return;const u=e.pointerId;let a=e.clientX,c=e.clientY,d=!1;const p=Date.now(),v=t.getBoundingClientRect(),{left:m,top:f}=v,g=t=>{if(t.pointerId!==u)return;if(t.defaultPrevented||r.size>1)return;if(l&&Date.now()-p<o)return;const e=t.clientX,s=t.clientY,h=e-a,v=s-c;(d||Math.abs(h)>i||Math.abs(v)>i)&&(t.preventDefault(),t.stopPropagation(),d||(n.set({type:"start",x:a-m,y:c-f}),d=!0),n.set({type:"move",x:e-m,y:s-f,deltaX:h,deltaY:v}),a=e,c=s)},y=t=>{if(r.delete(t.pointerId)){if(t.pointerId===u&&d){const e=t.clientX,i=t.clientY;n.set({type:"end",x:e-m,y:i-f})}0===r.size&&h()}},P=t=>{t.relatedTarget&&t.relatedTarget!==document.documentElement||y(t)},b=t=>{d&&(t.stopPropagation(),t.preventDefault())},w=t=>{t.defaultPrevented||r.size>1||d&&t.preventDefault()};document.addEventListener("pointermove",g),document.addEventListener("pointerup",y),document.addEventListener("pointerout",P),document.addEventListener("pointercancel",P),document.addEventListener("touchmove",w,{passive:!1}),document.addEventListener("click",b,{capture:!0}),h=()=>{document.removeEventListener("pointermove",g),document.removeEventListener("pointerup",y),document.removeEventListener("pointerout",P),document.removeEventListener("pointercancel",P),document.removeEventListener("touchmove",w),setTimeout((()=>{document.removeEventListener("click",b,{capture:!0})}),10)}};t.addEventListener("pointerdown",u);return{signal:n,cleanup:()=>{h(),t.removeEventListener("pointerdown",u),r.clear(),function(t){const e=t._cleanup;"function"==typeof e&&e()}(n)}}}const r={points:[],lineWidth:4,lineColor:"rgba(0, 0, 255, 0.5)",dragPointSize:10,dragPointFill:"rgba(255, 255, 255, 0.8)",dragPointStroke:"rgba(255, 255, 255, 0.8)"};class l extends t{constructor(t,e){super(),this.subscriptions=[],this.subscriptions=[],this.options=t,this.polyPoints=new Map;const i=e.clientWidth,r=e.clientHeight,l=s("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:`0 0 ${i} ${r}`,preserveAspectRatio:"none",style:{position:"absolute",left:"0",top:"0",zIndex:"4"},part:"envelope"},e);this.svg=l;const h=s("polyline",{xmlns:"http://www.w3.org/2000/svg",points:`0,${r} ${i},${r}`,stroke:t.lineColor,"stroke-width":t.lineWidth,fill:"none",part:"polyline",style:t.dragLine?{cursor:"row-resize",pointerEvents:"stroke"}:{}},l);if(t.dragLine){const t=n(h),e=o((()=>{const e=t.signal.value;if(!e||"move"!==e.type||void 0===e.deltaY)return;const i=e.deltaY,{height:s}=l.viewBox.baseVal,{points:o}=h;for(let t=1;t<o.numberOfItems-1;t++){const e=o.getItem(t);e.y=Math.min(s,Math.max(0,e.y+i))}const n=l.querySelectorAll("ellipse");Array.from(n).forEach((t=>{const e=Math.min(s,Math.max(0,Number(t.getAttribute("cy"))+i));t.setAttribute("cy",e.toString())})),this.emit("line-move",i/s)}),[t.signal]);this.subscriptions.push((()=>{e(),t.cleanup()}))}this.dblClickListener=t=>{const e=l.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.emit("point-create",i/e.width,s/e.height)},l.addEventListener("dblclick",this.dblClickListener);const u=()=>{void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0)};this.touchStartListener=t=>{1===t.touches.length?this.pressTimer=window.setTimeout((()=>{t.preventDefault();const e=l.getBoundingClientRect(),i=t.touches[0].clientX-e.left,s=t.touches[0].clientY-e.top;this.emit("point-create",i/e.width,s/e.height)}),500):u()},this.touchMoveListener=u,this.touchEndListener=u,l.addEventListener("touchstart",this.touchStartListener),l.addEventListener("touchmove",this.touchMoveListener),l.addEventListener("touchend",this.touchEndListener)}makeDraggable(t,e){const i=n(t,{threshold:1}),s=o((()=>{const s=i.signal.value;s&&("start"===s.type?t.style.cursor="grabbing":"move"===s.type&&void 0!==s.deltaX&&void 0!==s.deltaY?e(s.deltaX,s.deltaY):"end"===s.type&&(t.style.cursor="grab"))}),[i.signal]);this.subscriptions.push((()=>{s(),i.cleanup()}))}createCircle(t,e){const i=this.options.dragPointSize/2;return s("ellipse",{xmlns:"http://www.w3.org/2000/svg",cx:t,cy:e,rx:i,ry:i,fill:this.options.dragPointFill,stroke:this.options.dragPointStroke,"stroke-width":"2",style:{cursor:"grab",pointerEvents:"all"},part:"envelope-circle"},this.svg)}removePolyPoint(t){const e=this.polyPoints.get(t);if(!e)return;const{polyPoint:i,circle:s}=e,{points:o}=this.svg.querySelector("polyline"),n=Array.from(o).findIndex((t=>t.x===i.x&&t.y===i.y));o.removeItem(n),s.remove(),this.polyPoints.delete(t)}addPolyPoint(t,e,i){const{svg:s}=this,{width:o,height:n}=s.viewBox.baseVal,r=t*o,l=n-e*n,h=this.options.dragPointSize/2,u=s.createSVGPoint();u.x=t*o,u.y=n-e*n;const a=this.createCircle(r,l),{points:c}=s.querySelector("polyline"),d=Array.from(c).findIndex((t=>t.x>=r));c.insertItemBefore(u,Math.max(d,1)),this.polyPoints.set(i,{polyPoint:u,circle:a}),this.makeDraggable(a,((t,e)=>{const s=u.x+t,r=u.y+e;if(s<-h||r<-h||s>o+h||r>n+h)return void this.emit("point-dragout",i);const l=Array.from(c).find((t=>t.x>u.x)),d=Array.from(c).findLast((t=>t.x<u.x));l&&s>=l.x||d&&s<=d.x||(u.x=s,u.y=r,a.setAttribute("cx",s.toString()),a.setAttribute("cy",r.toString()),this.emit("point-move",i,s/o,r/n))}))}update(){const{svg:t}=this,{clientWidth:e,clientHeight:i}=t;if(!e||!i)return;const s=t.viewBox.baseVal.width/e,o=t.viewBox.baseVal.height/i;t.querySelectorAll("ellipse").forEach((t=>{const e=this.options.dragPointSize/2,i=e*s,n=e*o;t.setAttribute("rx",i.toString()),t.setAttribute("ry",n.toString())}))}destroy(){void 0!==this.pressTimer&&(clearTimeout(this.pressTimer),this.pressTimer=void 0),this.dblClickListener&&(this.svg.removeEventListener("dblclick",this.dblClickListener),this.dblClickListener=void 0),this.touchStartListener&&(this.svg.removeEventListener("touchstart",this.touchStartListener),this.touchStartListener=void 0),this.touchMoveListener&&(this.svg.removeEventListener("touchmove",this.touchMoveListener),this.touchMoveListener=void 0),this.touchEndListener&&(this.svg.removeEventListener("touchend",this.touchEndListener),this.touchEndListener=void 0),this.subscriptions.forEach((t=>t())),this.polyPoints.clear(),this.svg.remove()}}class h extends e{constructor(t){super(t),this.polyline=null,this.throttleTimeout=null,this.volume=1,this.points=t.points||[],this.options=Object.assign({},r,t),this.options.lineColor=this.options.lineColor||r.lineColor,this.options.dragPointFill=this.options.dragPointFill||r.dragPointFill,this.options.dragPointStroke=this.options.dragPointStroke||r.dragPointStroke,this.options.dragPointSize=this.options.dragPointSize||r.dragPointSize}static create(t){return new h(t)}addPoint(t){var e;t.id||(t.id=Math.random().toString(36).slice(2));const i=this.points.findLastIndex((e=>e.time<t.time));this.points.splice(i+1,0,t),this.emitPoints();const s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDuration();s&&this.addPolyPoint(t,s)}removePoint(t){var e;const i=this.points.indexOf(t);i>-1&&(this.points.splice(i,1),null===(e=this.polyline)||void 0===e||e.removePolyPoint(t),this.emitPoints())}getPoints(){return this.points}setPoints(t){this.points.slice().forEach((t=>this.removePoint(t))),t.forEach((t=>this.addPoint(t)))}destroy(){var t;this.throttleTimeout&&(clearTimeout(this.throttleTimeout),this.throttleTimeout=null),null===(t=this.polyline)||void 0===t||t.destroy(),super.destroy()}getCurrentVolume(){return this.volume}setVolume(t){var e;this.volume=t,null===(e=this.wavesurfer)||void 0===e||e.setVolume(t)}onInit(){var t;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const{options:e}=this;e.volume=null!==(t=e.volume)&&void 0!==t?t:this.wavesurfer.getVolume(),this.setVolume(e.volume),this.subscriptions.push(this.wavesurfer.on("decode",(t=>{this.initPolyline(),this.points.forEach((e=>{this.addPolyPoint(e,t)}))})),this.wavesurfer.on("redraw",(()=>{var t;null===(t=this.polyline)||void 0===t||t.update()})),this.wavesurfer.on("timeupdate",(t=>{this.onTimeUpdate(t)})))}emitPoints(){this.throttleTimeout&&clearTimeout(this.throttleTimeout),this.throttleTimeout=setTimeout((()=>{this.emit("points-change",this.points)}),200)}initPolyline(){if(this.polyline&&this.polyline.destroy(),!this.wavesurfer)return;const t=this.wavesurfer.getWrapper();this.polyline=new l(this.options,t),this.subscriptions.push(this.polyline.on("point-move",((t,e,i)=>{var s;const o=(null===(s=this.wavesurfer)||void 0===s?void 0:s.getDuration())||0;t.time=e*o,t.volume=1-i,this.emitPoints()})),this.polyline.on("point-dragout",(t=>{this.removePoint(t)})),this.polyline.on("point-create",((t,e)=>{var i;this.addPoint({time:t*((null===(i=this.wavesurfer)||void 0===i?void 0:i.getDuration())||0),volume:1-e})})),this.polyline.on("line-move",(t=>{var e;this.points.forEach((e=>{e.volume=Math.min(1,Math.max(0,e.volume-t))})),this.emitPoints(),this.onTimeUpdate((null===(e=this.wavesurfer)||void 0===e?void 0:e.getCurrentTime())||0)})))}addPolyPoint(t,e){var i;null===(i=this.polyline)||void 0===i||i.addPolyPoint(t.time/e,t.volume,t)}onTimeUpdate(t){if(!this.wavesurfer)return;let e=this.points.find((e=>e.time>t));e||(e={time:this.wavesurfer.getDuration()||0,volume:0});let i=this.points.findLast((e=>e.time<=t));i||(i={time:0,volume:0});const s=e.time-i.time,o=e.volume-i.volume,n=i.volume+(t-i.time)*(o/s),r=Math.min(1,Math.max(0,n)),l=Math.round(100*r)/100;l!==this.getCurrentVolume()&&(this.setVolume(l),this.emit("volume-change",l))}}return h}));

package/dist/plugins/hover.cjs

@@ -1 +1 @@
-"use strict";class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}const o={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class a extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.options=Object.assign({},o,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new a(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState(),o=r(s,"pointermove"),a=r(s,"pointerleave");this.subscriptions.push(n((()=>{const t=o.value;if(!t||!this.wavesurfer)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const a=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(a*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[o,i.duration])),this.subscriptions.push(n((()=>{a.value&&(this.wrapper.style.opacity="0",this.lastPointerPosition=null,this.wrapper.style.transform="")}),[a]));const l=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",l)),this.subscriptions.push(this.wavesurfer.on("scroll",l))}destroy(){super.destroy(),this.wrapper.remove()}}module.exports=a;
+"use strict";class t{constructor(){this.listeners={}}on(t,s,e){if(this.listeners[t]||(this.listeners[t]=new Set),null==e?void 0:e.once){const e=(...i)=>{this.un(t,e),s(...i)};return this.listeners[t].add(e),()=>this.un(t,e)}return this.listeners[t].add(s),()=>this.un(t,s)}un(t,s){var e;null===(e=this.listeners[t])||void 0===e||e.delete(s)}once(t,s){return this.on(t,s,{once:!0})}unAll(){this.listeners={}}emit(t,...s){this.listeners[t]&&this.listeners[t].forEach((t=>t(...s)))}}class s extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function e(t,s){const i=s.xmlns?document.createElementNS(s.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(s))if("children"===t&&n)for(const[t,s]of Object.entries(n))s instanceof Node?i.appendChild(s):"string"==typeof s?i.appendChild(document.createTextNode(s)):i.appendChild(e(t,s));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,s,i){const n=e(t,s||{});return null==i||i.appendChild(n),n}function n(t,s){let e;const i=()=>{e&&(e(),e=void 0),e=t()},n=s.map((t=>t.subscribe(i)));return i(),()=>{e&&(e(),e=void 0),n.forEach((t=>t()))}}function r(t,s){const e=function(t){let s=t;const e=new Set;return{get value(){return s},set(t){Object.is(s,t)||(s=t,e.forEach((t=>t(s))))},update(t){this.set(t(s))},subscribe:t=>(e.add(t),()=>e.delete(t))}}(null),i=t=>{e.set(t)};return t.addEventListener(s,i),e._cleanup=()=>{t.removeEventListener(s,i)},e}function o(t){const s=t._cleanup;"function"==typeof s&&s()}const a={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class l extends s{constructor(t){super(t||{}),this.lastPointerPosition=null,this.isPointerOverWaveform=!1,this.streamCleanups=[],this.options=Object.assign({},a,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new l(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,s=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${s}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const e=this.wavesurfer.getWrapper();e.appendChild(this.wrapper);const i=this.wavesurfer.getState();this.streamCleanups.forEach((t=>t())),this.streamCleanups=[];const a=r(e,"pointermove"),l=r(e,"pointerleave");this.streamCleanups.push((()=>o(a)),(()=>o(l))),this.subscriptions.push(n((()=>{a.value&&(this.isPointerOverWaveform=!0)}),[a])),this.subscriptions.push(n((()=>{const t=a.value;if(!t||!this.wavesurfer||!this.isPointerOverWaveform)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const s=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=s,i=t.clientX-s.left,n=Math.min(1,Math.max(0,i/e)),r=Math.min(e-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const o=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(o*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>e;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[a,i.duration])),this.subscriptions.push(n((()=>{l.value&&(this.wrapper.style.opacity="0",this.isPointerOverWaveform=!1,this.lastPointerPosition=null,this.wrapper.addEventListener("transitionend",(()=>{this.isPointerOverWaveform||(this.wrapper.style.transform="")}),{once:!0}))}),[l]));const h=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=t,e=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,e/s)),n=Math.min(s-this.options.lineWidth-1,e);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>s;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",h)),this.subscriptions.push(this.wavesurfer.on("scroll",h))}destroy(){this.streamCleanups.forEach((t=>t())),this.streamCleanups=[],super.destroy(),this.wrapper.remove()}}module.exports=l;

package/dist/plugins/hover.d.ts

@@ -42,6 +42,8 @@ declare class HoverPlugin extends BasePlugin<HoverPluginEvents, HoverPluginOptio
     private wrapper;
     private label;
     private lastPointerPosition;
+    private isPointerOverWaveform;
+    private streamCleanups;
     constructor(options?: HoverPluginOptions);
     static create(options?: HoverPluginOptions): HoverPlugin;
     private addUnits;

package/dist/plugins/hover.esm.js

@@ -1 +1 @@
-class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}const o={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class a extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.options=Object.assign({},o,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new a(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState(),o=r(s,"pointermove"),a=r(s,"pointerleave");this.subscriptions.push(n((()=>{const t=o.value;if(!t||!this.wavesurfer)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const a=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(a*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[o,i.duration])),this.subscriptions.push(n((()=>{a.value&&(this.wrapper.style.opacity="0",this.lastPointerPosition=null,this.wrapper.style.transform="")}),[a]));const l=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",l)),this.subscriptions.push(this.wavesurfer.on("scroll",l))}destroy(){super.destroy(),this.wrapper.remove()}}export{a as default};
+class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}function o(t){const e=t._cleanup;"function"==typeof e&&e()}const a={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class l extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.isPointerOverWaveform=!1,this.streamCleanups=[],this.options=Object.assign({},a,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new l(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState();this.streamCleanups.forEach((t=>t())),this.streamCleanups=[];const a=r(s,"pointermove"),l=r(s,"pointerleave");this.streamCleanups.push((()=>o(a)),(()=>o(l))),this.subscriptions.push(n((()=>{a.value&&(this.isPointerOverWaveform=!0)}),[a])),this.subscriptions.push(n((()=>{const t=a.value;if(!t||!this.wavesurfer||!this.isPointerOverWaveform)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const o=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(o*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[a,i.duration])),this.subscriptions.push(n((()=>{l.value&&(this.wrapper.style.opacity="0",this.isPointerOverWaveform=!1,this.lastPointerPosition=null,this.wrapper.addEventListener("transitionend",(()=>{this.isPointerOverWaveform||(this.wrapper.style.transform="")}),{once:!0}))}),[l]));const h=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",h)),this.subscriptions.push(this.wavesurfer.on("scroll",h))}destroy(){this.streamCleanups.forEach((t=>t())),this.streamCleanups=[],super.destroy(),this.wrapper.remove()}}export{l as default};

package/dist/plugins/hover.js

@@ -1 +1 @@
-class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}const o={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class a extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.options=Object.assign({},o,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new a(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState(),o=r(s,"pointermove"),a=r(s,"pointerleave");this.subscriptions.push(n((()=>{const t=o.value;if(!t||!this.wavesurfer)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const a=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(a*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[o,i.duration])),this.subscriptions.push(n((()=>{a.value&&(this.wrapper.style.opacity="0",this.lastPointerPosition=null,this.wrapper.style.transform="")}),[a]));const l=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",l)),this.subscriptions.push(this.wavesurfer.on("scroll",l))}destroy(){super.destroy(),this.wrapper.remove()}}export{a as default};
+class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}function o(t){const e=t._cleanup;"function"==typeof e&&e()}const a={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class l extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.isPointerOverWaveform=!1,this.streamCleanups=[],this.options=Object.assign({},a,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new l(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState();this.streamCleanups.forEach((t=>t())),this.streamCleanups=[];const a=r(s,"pointermove"),l=r(s,"pointerleave");this.streamCleanups.push((()=>o(a)),(()=>o(l))),this.subscriptions.push(n((()=>{a.value&&(this.isPointerOverWaveform=!0)}),[a])),this.subscriptions.push(n((()=>{const t=a.value;if(!t||!this.wavesurfer||!this.isPointerOverWaveform)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const o=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(o*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[a,i.duration])),this.subscriptions.push(n((()=>{l.value&&(this.wrapper.style.opacity="0",this.isPointerOverWaveform=!1,this.lastPointerPosition=null,this.wrapper.addEventListener("transitionend",(()=>{this.isPointerOverWaveform||(this.wrapper.style.transform="")}),{once:!0}))}),[l]));const h=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",h)),this.subscriptions.push(this.wavesurfer.on("scroll",h))}destroy(){this.streamCleanups.forEach((t=>t())),this.streamCleanups=[],super.destroy(),this.wrapper.remove()}}export{l as default};

package/dist/plugins/hover.min.js

@@ -1 +1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):((t="undefined"!=typeof globalThis?globalThis:t||self).WaveSurfer=t.WaveSurfer||{},t.WaveSurfer.Hover=e())}(this,(function(){"use strict";class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}const o={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class a extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.options=Object.assign({},o,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new a(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState(),o=r(s,"pointermove"),a=r(s,"pointerleave");this.subscriptions.push(n((()=>{const t=o.value;if(!t||!this.wavesurfer)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const a=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(a*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[o,i.duration])),this.subscriptions.push(n((()=>{a.value&&(this.wrapper.style.opacity="0",this.lastPointerPosition=null,this.wrapper.style.transform="")}),[a]));const l=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",l)),this.subscriptions.push(this.wavesurfer.on("scroll",l))}destroy(){super.destroy(),this.wrapper.remove()}}return a}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):((t="undefined"!=typeof globalThis?globalThis:t||self).WaveSurfer=t.WaveSurfer||{},t.WaveSurfer.Hover=e())}(this,(function(){"use strict";class t{constructor(){this.listeners={}}on(t,e,s){if(this.listeners[t]||(this.listeners[t]=new Set),null==s?void 0:s.once){const s=(...i)=>{this.un(t,s),e(...i)};return this.listeners[t].add(s),()=>this.un(t,s)}return this.listeners[t].add(e),()=>this.un(t,e)}un(t,e){var s;null===(s=this.listeners[t])||void 0===s||s.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=t}onInit(){}_init(t){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}function s(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,n]of Object.entries(e))if("children"===t&&n)for(const[t,e]of Object.entries(n))e instanceof Node?i.appendChild(e):"string"==typeof e?i.appendChild(document.createTextNode(e)):i.appendChild(s(t,e));else"style"===t?Object.assign(i.style,n):"textContent"===t?i.textContent=n:i.setAttribute(t,n.toString());return i}function i(t,e,i){const n=s(t,e||{});return null==i||i.appendChild(n),n}function n(t,e){let s;const i=()=>{s&&(s(),s=void 0),s=t()},n=e.map((t=>t.subscribe(i)));return i(),()=>{s&&(s(),s=void 0),n.forEach((t=>t()))}}function r(t,e){const s=function(t){let e=t;const s=new Set;return{get value(){return e},set(t){Object.is(e,t)||(e=t,s.forEach((t=>t(e))))},update(t){this.set(t(e))},subscribe:t=>(s.add(t),()=>s.delete(t))}}(null),i=t=>{s.set(t)};return t.addEventListener(e,i),s._cleanup=()=>{t.removeEventListener(e,i)},s}function o(t){const e=t._cleanup;"function"==typeof e&&e()}const a={lineWidth:1,labelSize:11,labelPreferLeft:!1,formatTimeCallback:t=>`${Math.floor(t/60)}:${`0${Math.floor(t)%60}`.slice(-2)}`};class l extends e{constructor(t){super(t||{}),this.lastPointerPosition=null,this.isPointerOverWaveform=!1,this.streamCleanups=[],this.options=Object.assign({},a,t),this.wrapper=i("div",{part:"hover"}),this.label=i("span",{part:"hover-label"},this.wrapper)}static create(t){return new l(t)}addUnits(t){return`${t}${"number"==typeof t?"px":""}`}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const t=this.wavesurfer.options,e=this.options.lineColor||t.cursorColor||t.progressColor;Object.assign(this.wrapper.style,{position:"absolute",zIndex:10,left:0,top:0,height:"100%",pointerEvents:"none",borderLeft:`${this.addUnits(this.options.lineWidth)} solid ${e}`,opacity:"0",transition:"opacity .1s ease-in"}),Object.assign(this.label.style,{display:"block",backgroundColor:this.options.labelBackground,color:this.options.labelColor,fontSize:`${this.addUnits(this.options.labelSize)}`,transition:"transform .1s ease-in",padding:"2px 3px"});const s=this.wavesurfer.getWrapper();s.appendChild(this.wrapper);const i=this.wavesurfer.getState();this.streamCleanups.forEach((t=>t())),this.streamCleanups=[];const a=r(s,"pointermove"),l=r(s,"pointerleave");this.streamCleanups.push((()=>o(a)),(()=>o(l))),this.subscriptions.push(n((()=>{a.value&&(this.isPointerOverWaveform=!0)}),[a])),this.subscriptions.push(n((()=>{const t=a.value;if(!t||!this.wavesurfer||!this.isPointerOverWaveform)return;this.lastPointerPosition={clientX:t.clientX,clientY:t.clientY};const e=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:s}=e,i=t.clientX-e.left,n=Math.min(1,Math.max(0,i/s)),r=Math.min(s-this.options.lineWidth-1,i);this.wrapper.style.transform=`translateX(${r}px)`,this.wrapper.style.opacity="1";const o=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(o*n);const l=this.label.offsetWidth,h=this.options.labelPreferLeft?r-l>0:r+l>s;this.label.style.transform=h?`translateX(-${l+this.options.lineWidth}px)`:"",this.emit("hover",n)}),[a,i.duration])),this.subscriptions.push(n((()=>{l.value&&(this.wrapper.style.opacity="0",this.isPointerOverWaveform=!1,this.lastPointerPosition=null,this.wrapper.addEventListener("transitionend",(()=>{this.isPointerOverWaveform||(this.wrapper.style.transform="")}),{once:!0}))}),[l]));const h=()=>{if(this.lastPointerPosition&&this.wavesurfer){const t=this.wavesurfer.getWrapper().getBoundingClientRect(),{width:e}=t,s=this.lastPointerPosition.clientX-t.left,i=Math.min(1,Math.max(0,s/e)),n=Math.min(e-this.options.lineWidth-1,s);this.wrapper.style.transform=`translateX(${n}px)`;const r=this.wavesurfer.getDuration();this.label.textContent=this.options.formatTimeCallback(r*i);const o=this.label.offsetWidth,a=this.options.labelPreferLeft?n-o>0:n+o>e;this.label.style.transform=a?`translateX(-${o+this.options.lineWidth}px)`:""}};this.subscriptions.push(this.wavesurfer.on("zoom",h)),this.subscriptions.push(this.wavesurfer.on("scroll",h))}destroy(){this.streamCleanups.forEach((t=>t())),this.streamCleanups=[],super.destroy(),this.wrapper.remove()}}return l}));