wavesurfer.js 7.12.3 → 7.12.4

package/dist/plugins/record.js

@@ -1,319 +1 @@
-/**
- * Record audio from the microphone with a real-time waveform preview
- */
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import BasePlugin from '../base-plugin.js';
-import Timer from '../timer.js';
-const DEFAULT_BITS_PER_SECOND = 128000;
-const DEFAULT_SCROLLING_WAVEFORM_WINDOW = 5;
-const FPS = 100;
-const MIME_TYPES = ['audio/webm', 'audio/wav', 'audio/mpeg', 'audio/mp4', 'audio/mp3'];
-const findSupportedMimeType = () => MIME_TYPES.find((mimeType) => MediaRecorder.isTypeSupported(mimeType));
-class RecordPlugin extends BasePlugin {
-    /** Create an instance of the Record plugin */
-    constructor(options) {
-        var _a, _b, _c, _d, _e, _f;
-        super(Object.assign(Object.assign({}, options), { audioBitsPerSecond: (_a = options.audioBitsPerSecond) !== null && _a !== void 0 ? _a : DEFAULT_BITS_PER_SECOND, scrollingWaveform: (_b = options.scrollingWaveform) !== null && _b !== void 0 ? _b : false, scrollingWaveformWindow: (_c = options.scrollingWaveformWindow) !== null && _c !== void 0 ? _c : DEFAULT_SCROLLING_WAVEFORM_WINDOW, continuousWaveform: (_d = options.continuousWaveform) !== null && _d !== void 0 ? _d : false, renderRecordedAudio: (_e = options.renderRecordedAudio) !== null && _e !== void 0 ? _e : true, mediaRecorderTimeslice: (_f = options.mediaRecorderTimeslice) !== null && _f !== void 0 ? _f : undefined }));
-        this.stream = null;
-        this.mediaRecorder = null;
-        this.dataWindow = null;
-        this.isWaveformPaused = false;
-        this.lastStartTime = 0;
-        this.lastDuration = 0;
-        this.duration = 0;
-        this.micStream = null;
-        this.recordedBlobUrl = null;
-        this.timer = new Timer();
-        this.subscriptions.push(this.timer.on('tick', () => {
-            const currentTime = performance.now() - this.lastStartTime;
-            this.duration = this.isPaused() ? this.duration : this.lastDuration + currentTime;
-            this.emit('record-progress', this.duration);
-        }));
-    }
-    /** Create an instance of the Record plugin */
-    static create(options) {
-        return new RecordPlugin(options || {});
-    }
-    renderMicStream(stream) {
-        var _a;
-        const audioContext = new AudioContext();
-        const source = audioContext.createMediaStreamSource(stream);
-        const analyser = audioContext.createAnalyser();
-        source.connect(analyser);
-        // Use smaller FFT size for more responsive peak detection
-        if (this.options.continuousWaveform || this.options.scrollingWaveform) {
-            analyser.fftSize = 32;
-        }
-        const bufferLength = analyser.frequencyBinCount;
-        const dataArray = new Float32Array(bufferLength);
-        let sampleIdx = 0;
-        if (this.wavesurfer) {
-            (_a = this.originalOptions) !== null && _a !== void 0 ? _a : (this.originalOptions = Object.assign({}, this.wavesurfer.options));
-            this.wavesurfer.options.interact = false;
-            if (this.options.scrollingWaveform) {
-                this.wavesurfer.options.cursorWidth = 0;
-                // Use fixed max peak in scrolling mode to prevent "dancing" waveform
-                this.wavesurfer.options.normalize = true;
-                this.wavesurfer.options.maxPeak = 1;
-            }
-        }
-        const drawWaveform = () => {
-            var _a, _b, _c, _d;
-            if (this.isWaveformPaused)
-                return;
-            analyser.getFloatTimeDomainData(dataArray);
-            if (this.options.scrollingWaveform) {
-                // Scrolling waveform - use peak values for smooth rendering
-                const windowSize = Math.floor((this.options.scrollingWaveformWindow || 0) * FPS);
-                // Calculate peak value from the current buffer
-                let maxValue = 0;
-                for (let i = 0; i < bufferLength; i++) {
-                    const value = Math.abs(dataArray[i]);
-                    if (value > maxValue) {
-                        maxValue = value;
-                    }
-                }
-                if (!this.dataWindow) {
-                    this.dataWindow = new Float32Array(windowSize);
-                }
-                const tempArray = new Float32Array(windowSize);
-                if (this.dataWindow && this.dataWindow.length > 0) {
-                    // Shift old data to the left, dropping the oldest sample
-                    const keepLength = windowSize - 1;
-                    const oldData = this.dataWindow.slice(-keepLength);
-                    tempArray.set(oldData, 0);
-                }
-                // Add new peak value at the end
-                tempArray[windowSize - 1] = maxValue;
-                this.dataWindow = tempArray;
-            }
-            else if (this.options.continuousWaveform) {
-                // Continuous waveform
-                if (!this.dataWindow) {
-                    const size = this.options.continuousWaveformDuration
-                        ? Math.round(this.options.continuousWaveformDuration * FPS)
-                        : ((_b = (_a = this.wavesurfer) === null || _a === void 0 ? void 0 : _a.getWidth()) !== null && _b !== void 0 ? _b : 0) * window.devicePixelRatio;
-                    this.dataWindow = new Float32Array(size);
-                }
-                let maxValue = 0;
-                for (let i = 0; i < bufferLength; i++) {
-                    const value = Math.abs(dataArray[i]);
-                    if (value > maxValue) {
-                        maxValue = value;
-                    }
-                }
-                if (sampleIdx + 1 > this.dataWindow.length) {
-                    const tempArray = new Float32Array(this.dataWindow.length * 2);
-                    tempArray.set(this.dataWindow, 0);
-                    this.dataWindow = tempArray;
-                }
-                this.dataWindow[sampleIdx] = maxValue;
-                sampleIdx++;
-            }
-            else {
-                this.dataWindow = dataArray;
-            }
-            // Render the waveform
-            if (this.wavesurfer) {
-                const totalDuration = ((_d = (_c = this.dataWindow) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) / FPS;
-                this.wavesurfer
-                    .load('', [this.dataWindow], this.options.scrollingWaveform ? this.options.scrollingWaveformWindow : totalDuration)
-                    .then(() => {
-                    if (this.wavesurfer && this.options.continuousWaveform) {
-                        this.wavesurfer.setTime(this.getDuration() / 1000);
-                        if (!this.wavesurfer.options.minPxPerSec) {
-                            this.wavesurfer.setOptions({
-                                minPxPerSec: this.wavesurfer.getWidth() / this.wavesurfer.getDuration(),
-                            });
-                        }
-                    }
-                })
-                    .catch((err) => {
-                    console.error('Error rendering real-time recording data:', err);
-                });
-            }
-        };
-        const intervalId = setInterval(drawWaveform, 1000 / FPS);
-        const cleanup = () => {
-            clearInterval(intervalId);
-            source === null || source === void 0 ? void 0 : source.disconnect();
-            audioContext === null || audioContext === void 0 ? void 0 : audioContext.close();
-        };
-        return {
-            onDestroy: cleanup,
-            onEnd: () => {
-                this.isWaveformPaused = true;
-                this.stopMic();
-            },
-        };
-    }
-    /** Request access to the microphone and start monitoring incoming audio */
-    startMic(options) {
-        return __awaiter(this, void 0, void 0, function* () {
-            // Stop previous mic stream if exists to clean up AudioContext
-            if (this.micStream) {
-                this.stopMic();
-            }
-            let stream;
-            try {
-                stream = yield navigator.mediaDevices.getUserMedia({
-                    audio: options !== null && options !== void 0 ? options : true,
-                });
-            }
-            catch (err) {
-                throw new Error('Error accessing the microphone: ' + err.message);
-            }
-            const micStream = this.renderMicStream(stream);
-            this.micStream = micStream;
-            this.unsubscribeDestroy = this.once('destroy', micStream.onDestroy);
-            this.unsubscribeRecordEnd = this.once('record-end', micStream.onEnd);
-            this.stream = stream;
-            return stream;
-        });
-    }
-    /** Stop monitoring incoming audio */
-    stopMic() {
-        var _a, _b, _c;
-        (_a = this.micStream) === null || _a === void 0 ? void 0 : _a.onDestroy();
-        (_b = this.unsubscribeDestroy) === null || _b === void 0 ? void 0 : _b.call(this);
-        (_c = this.unsubscribeRecordEnd) === null || _c === void 0 ? void 0 : _c.call(this);
-        this.micStream = null;
-        this.unsubscribeDestroy = undefined;
-        this.unsubscribeRecordEnd = undefined;
-        if (!this.stream)
-            return;
-        this.stream.getTracks().forEach((track) => track.stop());
-        this.stream = null;
-        this.mediaRecorder = null;
-    }
-    /** Start recording audio from the microphone */
-    startRecording(options) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const stream = this.stream || (yield this.startMic(options));
-            this.dataWindow = null;
-            const mediaRecorder = this.mediaRecorder ||
-                new MediaRecorder(stream, {
-                    mimeType: this.options.mimeType || findSupportedMimeType(),
-                    audioBitsPerSecond: this.options.audioBitsPerSecond,
-                });
-            this.mediaRecorder = mediaRecorder;
-            this.stopRecording();
-            const recordedChunks = [];
-            mediaRecorder.ondataavailable = (event) => {
-                if (event.data.size > 0) {
-                    recordedChunks.push(event.data);
-                }
-                this.emit('record-data-available', event.data);
-            };
-            const emitWithBlob = (ev) => {
-                var _a;
-                const blob = new Blob(recordedChunks, { type: mediaRecorder.mimeType });
-                this.emit(ev, blob);
-                if (this.options.renderRecordedAudio) {
-                    this.applyOriginalOptionsIfNeeded();
-                    // Revoke previous blob URL before creating a new one
-                    if (this.recordedBlobUrl) {
-                        URL.revokeObjectURL(this.recordedBlobUrl);
-                    }
-                    this.recordedBlobUrl = URL.createObjectURL(blob);
-                    (_a = this.wavesurfer) === null || _a === void 0 ? void 0 : _a.load(this.recordedBlobUrl);
-                }
-            };
-            mediaRecorder.onpause = () => emitWithBlob('record-pause');
-            mediaRecorder.onstop = () => emitWithBlob('record-end');
-            mediaRecorder.start(this.options.mediaRecorderTimeslice);
-            this.lastStartTime = performance.now();
-            this.lastDuration = 0;
-            this.duration = 0;
-            this.isWaveformPaused = false;
-            this.timer.start();
-            this.emit('record-start');
-        });
-    }
-    /** Get the duration of the recording */
-    getDuration() {
-        return this.duration;
-    }
-    /** Check if the audio is being recorded */
-    isRecording() {
-        var _a;
-        return ((_a = this.mediaRecorder) === null || _a === void 0 ? void 0 : _a.state) === 'recording';
-    }
-    isPaused() {
-        var _a;
-        return ((_a = this.mediaRecorder) === null || _a === void 0 ? void 0 : _a.state) === 'paused';
-    }
-    isActive() {
-        var _a;
-        return ((_a = this.mediaRecorder) === null || _a === void 0 ? void 0 : _a.state) !== 'inactive';
-    }
-    /** Stop the recording */
-    stopRecording() {
-        var _a;
-        if (this.isActive()) {
-            (_a = this.mediaRecorder) === null || _a === void 0 ? void 0 : _a.stop();
-            this.timer.stop();
-        }
-    }
-    /** Pause the recording */
-    pauseRecording() {
-        var _a, _b;
-        if (this.isRecording()) {
-            this.isWaveformPaused = true;
-            (_a = this.mediaRecorder) === null || _a === void 0 ? void 0 : _a.requestData();
-            (_b = this.mediaRecorder) === null || _b === void 0 ? void 0 : _b.pause();
-            this.timer.stop();
-            this.lastDuration = this.duration;
-        }
-    }
-    /** Resume the recording */
-    resumeRecording() {
-        var _a;
-        if (this.isPaused()) {
-            this.isWaveformPaused = false;
-            (_a = this.mediaRecorder) === null || _a === void 0 ? void 0 : _a.resume();
-            this.timer.start();
-            this.lastStartTime = performance.now();
-            this.emit('record-resume');
-        }
-    }
-    /** Get a list of available audio devices
-     * You can use this to get the device ID of the microphone to use with the startMic and startRecording methods
-     * Will return an empty array if the browser doesn't support the MediaDevices API or if the user has not granted access to the microphone
-     * You can ask for permission to the microphone by calling startMic
-     */
-    static getAvailableAudioDevices() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return navigator.mediaDevices
-                .enumerateDevices()
-                .then((devices) => devices.filter((device) => device.kind === 'audioinput'));
-        });
-    }
-    /** Destroy the plugin */
-    destroy() {
-        this.applyOriginalOptionsIfNeeded();
-        super.destroy();
-        this.stopRecording();
-        this.stopMic();
-        // Revoke blob URL to free memory
-        if (this.recordedBlobUrl) {
-            URL.revokeObjectURL(this.recordedBlobUrl);
-            this.recordedBlobUrl = null;
-        }
-    }
-    applyOriginalOptionsIfNeeded() {
-        if (this.wavesurfer && this.originalOptions) {
-            this.wavesurfer.setOptions(this.originalOptions);
-            delete this.originalOptions;
-        }
-    }
-}
-export default RecordPlugin;
+function i(i,t,e,s){return new(e||(e=Promise))((function(r,o){function n(i){try{d(s.next(i))}catch(i){o(i)}}function a(i){try{d(s.throw(i))}catch(i){o(i)}}function d(i){var t;i.done?r(i.value):(t=i.value,t instanceof e?t:new e((function(i){i(t)}))).then(n,a)}d((s=s.apply(i,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;class t{constructor(){this.listeners={}}on(i,t,e){if(this.listeners[i]||(this.listeners[i]=new Set),null==e?void 0:e.once){const e=(...s)=>{this.un(i,e),t(...s)};return this.listeners[i].add(e),()=>this.un(i,e)}return this.listeners[i].add(t),()=>this.un(i,t)}un(i,t){var e;null===(e=this.listeners[i])||void 0===e||e.delete(t)}once(i,t){return this.on(i,t,{once:!0})}unAll(){this.listeners={}}emit(i,...t){this.listeners[i]&&this.listeners[i].forEach((i=>i(...t)))}}class e extends t{constructor(i){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=i}onInit(){}_init(i){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=i,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((i=>i())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}class s extends t{constructor(){super(...arguments),this.animationFrameId=null,this.isRunning=!1}start(){if(this.isRunning)return;this.isRunning=!0;const i=()=>{this.isRunning&&(this.emit("tick"),this.animationFrameId=requestAnimationFrame(i))};i()}stop(){this.isRunning=!1,null!==this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}destroy(){this.stop()}}const r=100,o=["audio/webm","audio/wav","audio/mpeg","audio/mp4","audio/mp3"];class n extends e{constructor(i){var t,e,r,o,n,a;super(Object.assign(Object.assign({},i),{audioBitsPerSecond:null!==(t=i.audioBitsPerSecond)&&void 0!==t?t:128e3,scrollingWaveform:null!==(e=i.scrollingWaveform)&&void 0!==e&&e,scrollingWaveformWindow:null!==(r=i.scrollingWaveformWindow)&&void 0!==r?r:5,continuousWaveform:null!==(o=i.continuousWaveform)&&void 0!==o&&o,renderRecordedAudio:null===(n=i.renderRecordedAudio)||void 0===n||n,mediaRecorderTimeslice:null!==(a=i.mediaRecorderTimeslice)&&void 0!==a?a:void 0})),this.stream=null,this.mediaRecorder=null,this.dataWindow=null,this.isWaveformPaused=!1,this.lastStartTime=0,this.lastDuration=0,this.duration=0,this.micStream=null,this.recordedBlobUrl=null,this.timer=new s,this.subscriptions.push(this.timer.on("tick",(()=>{const i=performance.now()-this.lastStartTime;this.duration=this.isPaused()?this.duration:this.lastDuration+i,this.emit("record-progress",this.duration)})))}static create(i){return new n(i||{})}renderMicStream(i){var t;const e=new AudioContext,s=e.createMediaStreamSource(i),o=e.createAnalyser();s.connect(o),(this.options.continuousWaveform||this.options.scrollingWaveform)&&(o.fftSize=32);const n=o.frequencyBinCount,a=new Float32Array(n);let d=0;this.wavesurfer&&(null!==(t=this.originalOptions)&&void 0!==t||(this.originalOptions=Object.assign({},this.wavesurfer.options)),this.wavesurfer.options.interact=!1,this.options.scrollingWaveform&&(this.wavesurfer.options.cursorWidth=0,this.wavesurfer.options.normalize=!0,this.wavesurfer.options.maxPeak=1));const h=setInterval((()=>{var i,t,e,s;if(!this.isWaveformPaused){if(o.getFloatTimeDomainData(a),this.options.scrollingWaveform){const i=Math.floor((this.options.scrollingWaveformWindow||0)*r);let t=0;for(let i=0;i<n;i++){const e=Math.abs(a[i]);e>t&&(t=e)}this.dataWindow||(this.dataWindow=new Float32Array(i));const e=new Float32Array(i);if(this.dataWindow&&this.dataWindow.length>0){const t=i-1,s=this.dataWindow.slice(-t);e.set(s,0)}e[i-1]=t,this.dataWindow=e}else if(this.options.continuousWaveform){if(!this.dataWindow){const e=this.options.continuousWaveformDuration?Math.round(this.options.continuousWaveformDuration*r):(null!==(t=null===(i=this.wavesurfer)||void 0===i?void 0:i.getWidth())&&void 0!==t?t:0)*window.devicePixelRatio;this.dataWindow=new Float32Array(e)}let e=0;for(let i=0;i<n;i++){const t=Math.abs(a[i]);t>e&&(e=t)}if(d+1>this.dataWindow.length){const i=new Float32Array(2*this.dataWindow.length);i.set(this.dataWindow,0),this.dataWindow=i}this.dataWindow[d]=e,d++}else this.dataWindow=a;if(this.wavesurfer){const i=(null!==(s=null===(e=this.dataWindow)||void 0===e?void 0:e.length)&&void 0!==s?s:0)/r;this.wavesurfer.load("",[this.dataWindow],this.options.scrollingWaveform?this.options.scrollingWaveformWindow:i).then((()=>{this.wavesurfer&&this.options.continuousWaveform&&(this.wavesurfer.setTime(this.getDuration()/1e3),this.wavesurfer.options.minPxPerSec||this.wavesurfer.setOptions({minPxPerSec:this.wavesurfer.getWidth()/this.wavesurfer.getDuration()}))})).catch((i=>{console.error("Error rendering real-time recording data:",i)}))}}}),10);return{onDestroy:()=>{clearInterval(h),null==s||s.disconnect(),null==e||e.close()},onEnd:()=>{this.isWaveformPaused=!0,this.stopMic()}}}startMic(t){return i(this,void 0,void 0,(function*(){let i;this.micStream&&this.stopMic();try{i=yield navigator.mediaDevices.getUserMedia({audio:null==t||t})}catch(i){throw new Error("Error accessing the microphone: "+i.message)}const e=this.renderMicStream(i);return this.micStream=e,this.unsubscribeDestroy=this.once("destroy",e.onDestroy),this.unsubscribeRecordEnd=this.once("record-end",e.onEnd),this.stream=i,i}))}stopMic(){var i,t,e;null===(i=this.micStream)||void 0===i||i.onDestroy(),null===(t=this.unsubscribeDestroy)||void 0===t||t.call(this),null===(e=this.unsubscribeRecordEnd)||void 0===e||e.call(this),this.micStream=null,this.unsubscribeDestroy=void 0,this.unsubscribeRecordEnd=void 0,this.stream&&(this.stream.getTracks().forEach((i=>i.stop())),this.stream=null,this.mediaRecorder=null)}startRecording(t){return i(this,void 0,void 0,(function*(){const i=this.stream||(yield this.startMic(t));this.dataWindow=null;const e=this.mediaRecorder||new MediaRecorder(i,{mimeType:this.options.mimeType||o.find((i=>MediaRecorder.isTypeSupported(i))),audioBitsPerSecond:this.options.audioBitsPerSecond});this.mediaRecorder=e,this.stopRecording();const s=[];e.ondataavailable=i=>{i.data.size>0&&s.push(i.data),this.emit("record-data-available",i.data)};const r=i=>{var t;const r=new Blob(s,{type:e.mimeType});this.emit(i,r),this.options.renderRecordedAudio&&(this.applyOriginalOptionsIfNeeded(),this.recordedBlobUrl&&URL.revokeObjectURL(this.recordedBlobUrl),this.recordedBlobUrl=URL.createObjectURL(r),null===(t=this.wavesurfer)||void 0===t||t.load(this.recordedBlobUrl))};e.onpause=()=>r("record-pause"),e.onstop=()=>r("record-end"),e.start(this.options.mediaRecorderTimeslice),this.lastStartTime=performance.now(),this.lastDuration=0,this.duration=0,this.isWaveformPaused=!1,this.timer.start(),this.emit("record-start")}))}getDuration(){return this.duration}isRecording(){var i;return"recording"===(null===(i=this.mediaRecorder)||void 0===i?void 0:i.state)}isPaused(){var i;return"paused"===(null===(i=this.mediaRecorder)||void 0===i?void 0:i.state)}isActive(){var i;return"inactive"!==(null===(i=this.mediaRecorder)||void 0===i?void 0:i.state)}stopRecording(){var i;this.isActive()&&(null===(i=this.mediaRecorder)||void 0===i||i.stop(),this.timer.stop())}pauseRecording(){var i,t;this.isRecording()&&(this.isWaveformPaused=!0,null===(i=this.mediaRecorder)||void 0===i||i.requestData(),null===(t=this.mediaRecorder)||void 0===t||t.pause(),this.timer.stop(),this.lastDuration=this.duration)}resumeRecording(){var i;this.isPaused()&&(this.isWaveformPaused=!1,null===(i=this.mediaRecorder)||void 0===i||i.resume(),this.timer.start(),this.lastStartTime=performance.now(),this.emit("record-resume"))}static getAvailableAudioDevices(){return i(this,void 0,void 0,(function*(){return navigator.mediaDevices.enumerateDevices().then((i=>i.filter((i=>"audioinput"===i.kind))))}))}destroy(){this.applyOriginalOptionsIfNeeded(),super.destroy(),this.stopRecording(),this.stopMic(),this.recordedBlobUrl&&(URL.revokeObjectURL(this.recordedBlobUrl),this.recordedBlobUrl=null)}applyOriginalOptionsIfNeeded(){this.wavesurfer&&this.originalOptions&&(this.wavesurfer.setOptions(this.originalOptions),delete this.originalOptions)}}export{n as default};

package/dist/plugins/record.min.js

@@ -0,0 +1 @@
+!function(i,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):((i="undefined"!=typeof globalThis?globalThis:i||self).WaveSurfer=i.WaveSurfer||{},i.WaveSurfer.Record=t())}(this,(function(){"use strict";function i(i,t,e,s){return new(e||(e=Promise))((function(o,r){function n(i){try{d(s.next(i))}catch(i){r(i)}}function a(i){try{d(s.throw(i))}catch(i){r(i)}}function d(i){var t;i.done?o(i.value):(t=i.value,t instanceof e?t:new e((function(i){i(t)}))).then(n,a)}d((s=s.apply(i,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;class t{constructor(){this.listeners={}}on(i,t,e){if(this.listeners[i]||(this.listeners[i]=new Set),null==e?void 0:e.once){const e=(...s)=>{this.un(i,e),t(...s)};return this.listeners[i].add(e),()=>this.un(i,e)}return this.listeners[i].add(t),()=>this.un(i,t)}un(i,t){var e;null===(e=this.listeners[i])||void 0===e||e.delete(t)}once(i,t){return this.on(i,t,{once:!0})}unAll(){this.listeners={}}emit(i,...t){this.listeners[i]&&this.listeners[i].forEach((i=>i(...t)))}}class e extends t{constructor(i){super(),this.subscriptions=[],this.isDestroyed=!1,this.options=i}onInit(){}_init(i){this.isDestroyed&&(this.subscriptions=[],this.isDestroyed=!1),this.wavesurfer=i,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((i=>i())),this.subscriptions=[],this.isDestroyed=!0,this.wavesurfer=void 0}}class s extends t{constructor(){super(...arguments),this.animationFrameId=null,this.isRunning=!1}start(){if(this.isRunning)return;this.isRunning=!0;const i=()=>{this.isRunning&&(this.emit("tick"),this.animationFrameId=requestAnimationFrame(i))};i()}stop(){this.isRunning=!1,null!==this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}destroy(){this.stop()}}const o=100,r=["audio/webm","audio/wav","audio/mpeg","audio/mp4","audio/mp3"];class n extends e{constructor(i){var t,e,o,r,n,a;super(Object.assign(Object.assign({},i),{audioBitsPerSecond:null!==(t=i.audioBitsPerSecond)&&void 0!==t?t:128e3,scrollingWaveform:null!==(e=i.scrollingWaveform)&&void 0!==e&&e,scrollingWaveformWindow:null!==(o=i.scrollingWaveformWindow)&&void 0!==o?o:5,continuousWaveform:null!==(r=i.continuousWaveform)&&void 0!==r&&r,renderRecordedAudio:null===(n=i.renderRecordedAudio)||void 0===n||n,mediaRecorderTimeslice:null!==(a=i.mediaRecorderTimeslice)&&void 0!==a?a:void 0})),this.stream=null,this.mediaRecorder=null,this.dataWindow=null,this.isWaveformPaused=!1,this.lastStartTime=0,this.lastDuration=0,this.duration=0,this.micStream=null,this.recordedBlobUrl=null,this.timer=new s,this.subscriptions.push(this.timer.on("tick",(()=>{const i=performance.now()-this.lastStartTime;this.duration=this.isPaused()?this.duration:this.lastDuration+i,this.emit("record-progress",this.duration)})))}static create(i){return new n(i||{})}renderMicStream(i){var t;const e=new AudioContext,s=e.createMediaStreamSource(i),r=e.createAnalyser();s.connect(r),(this.options.continuousWaveform||this.options.scrollingWaveform)&&(r.fftSize=32);const n=r.frequencyBinCount,a=new Float32Array(n);let d=0;this.wavesurfer&&(null!==(t=this.originalOptions)&&void 0!==t||(this.originalOptions=Object.assign({},this.wavesurfer.options)),this.wavesurfer.options.interact=!1,this.options.scrollingWaveform&&(this.wavesurfer.options.cursorWidth=0,this.wavesurfer.options.normalize=!0,this.wavesurfer.options.maxPeak=1));const h=setInterval((()=>{var i,t,e,s;if(!this.isWaveformPaused){if(r.getFloatTimeDomainData(a),this.options.scrollingWaveform){const i=Math.floor((this.options.scrollingWaveformWindow||0)*o);let t=0;for(let i=0;i<n;i++){const e=Math.abs(a[i]);e>t&&(t=e)}this.dataWindow||(this.dataWindow=new Float32Array(i));const e=new Float32Array(i);if(this.dataWindow&&this.dataWindow.length>0){const t=i-1,s=this.dataWindow.slice(-t);e.set(s,0)}e[i-1]=t,this.dataWindow=e}else if(this.options.continuousWaveform){if(!this.dataWindow){const e=this.options.continuousWaveformDuration?Math.round(this.options.continuousWaveformDuration*o):(null!==(t=null===(i=this.wavesurfer)||void 0===i?void 0:i.getWidth())&&void 0!==t?t:0)*window.devicePixelRatio;this.dataWindow=new Float32Array(e)}let e=0;for(let i=0;i<n;i++){const t=Math.abs(a[i]);t>e&&(e=t)}if(d+1>this.dataWindow.length){const i=new Float32Array(2*this.dataWindow.length);i.set(this.dataWindow,0),this.dataWindow=i}this.dataWindow[d]=e,d++}else this.dataWindow=a;if(this.wavesurfer){const i=(null!==(s=null===(e=this.dataWindow)||void 0===e?void 0:e.length)&&void 0!==s?s:0)/o;this.wavesurfer.load("",[this.dataWindow],this.options.scrollingWaveform?this.options.scrollingWaveformWindow:i).then((()=>{this.wavesurfer&&this.options.continuousWaveform&&(this.wavesurfer.setTime(this.getDuration()/1e3),this.wavesurfer.options.minPxPerSec||this.wavesurfer.setOptions({minPxPerSec:this.wavesurfer.getWidth()/this.wavesurfer.getDuration()}))})).catch((i=>{console.error("Error rendering real-time recording data:",i)}))}}}),10);return{onDestroy:()=>{clearInterval(h),null==s||s.disconnect(),null==e||e.close()},onEnd:()=>{this.isWaveformPaused=!0,this.stopMic()}}}startMic(t){return i(this,void 0,void 0,(function*(){let i;this.micStream&&this.stopMic();try{i=yield navigator.mediaDevices.getUserMedia({audio:null==t||t})}catch(i){throw new Error("Error accessing the microphone: "+i.message)}const e=this.renderMicStream(i);return this.micStream=e,this.unsubscribeDestroy=this.once("destroy",e.onDestroy),this.unsubscribeRecordEnd=this.once("record-end",e.onEnd),this.stream=i,i}))}stopMic(){var i,t,e;null===(i=this.micStream)||void 0===i||i.onDestroy(),null===(t=this.unsubscribeDestroy)||void 0===t||t.call(this),null===(e=this.unsubscribeRecordEnd)||void 0===e||e.call(this),this.micStream=null,this.unsubscribeDestroy=void 0,this.unsubscribeRecordEnd=void 0,this.stream&&(this.stream.getTracks().forEach((i=>i.stop())),this.stream=null,this.mediaRecorder=null)}startRecording(t){return i(this,void 0,void 0,(function*(){const i=this.stream||(yield this.startMic(t));this.dataWindow=null;const e=this.mediaRecorder||new MediaRecorder(i,{mimeType:this.options.mimeType||r.find((i=>MediaRecorder.isTypeSupported(i))),audioBitsPerSecond:this.options.audioBitsPerSecond});this.mediaRecorder=e,this.stopRecording();const s=[];e.ondataavailable=i=>{i.data.size>0&&s.push(i.data),this.emit("record-data-available",i.data)};const o=i=>{var t;const o=new Blob(s,{type:e.mimeType});this.emit(i,o),this.options.renderRecordedAudio&&(this.applyOriginalOptionsIfNeeded(),this.recordedBlobUrl&&URL.revokeObjectURL(this.recordedBlobUrl),this.recordedBlobUrl=URL.createObjectURL(o),null===(t=this.wavesurfer)||void 0===t||t.load(this.recordedBlobUrl))};e.onpause=()=>o("record-pause"),e.onstop=()=>o("record-end"),e.start(this.options.mediaRecorderTimeslice),this.lastStartTime=performance.now(),this.lastDuration=0,this.duration=0,this.isWaveformPaused=!1,this.timer.start(),this.emit("record-start")}))}getDuration(){return this.duration}isRecording(){var i;return"recording"===(null===(i=this.mediaRecorder)||void 0===i?void 0:i.state)}isPaused(){var i;return"paused"===(null===(i=this.mediaRecorder)||void 0===i?void 0:i.state)}isActive(){var i;return"inactive"!==(null===(i=this.mediaRecorder)||void 0===i?void 0:i.state)}stopRecording(){var i;this.isActive()&&(null===(i=this.mediaRecorder)||void 0===i||i.stop(),this.timer.stop())}pauseRecording(){var i,t;this.isRecording()&&(this.isWaveformPaused=!0,null===(i=this.mediaRecorder)||void 0===i||i.requestData(),null===(t=this.mediaRecorder)||void 0===t||t.pause(),this.timer.stop(),this.lastDuration=this.duration)}resumeRecording(){var i;this.isPaused()&&(this.isWaveformPaused=!1,null===(i=this.mediaRecorder)||void 0===i||i.resume(),this.timer.start(),this.lastStartTime=performance.now(),this.emit("record-resume"))}static getAvailableAudioDevices(){return i(this,void 0,void 0,(function*(){return navigator.mediaDevices.enumerateDevices().then((i=>i.filter((i=>"audioinput"===i.kind))))}))}destroy(){this.applyOriginalOptionsIfNeeded(),super.destroy(),this.stopRecording(),this.stopMic(),this.recordedBlobUrl&&(URL.revokeObjectURL(this.recordedBlobUrl),this.recordedBlobUrl=null)}applyOriginalOptionsIfNeeded(){this.wavesurfer&&this.originalOptions&&(this.wavesurfer.setOptions(this.originalOptions),delete this.originalOptions)}}return n}));

package/dist/plugins/regions.cjs

@@ -0,0 +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=(...n)=>{this.un(t,i),e(...n)};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 n=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,s]of Object.entries(e))if("children"===t&&s)for(const[t,e]of Object.entries(s))e instanceof Node?n.appendChild(e):"string"==typeof e?n.appendChild(document.createTextNode(e)):n.appendChild(i(t,e));else"style"===t?Object.assign(n.style,s):"textContent"===t?n.textContent=s:n.setAttribute(t,s.toString());return n}function n(t,e,n){const s=i(t,e||{});return null==n||n.appendChild(s),s}function s(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))}}function r(t,e){let i;const n=()=>{i&&(i(),i=void 0),i=t()},s=e.map((t=>t.subscribe(n)));return n(),()=>{i&&(i(),i=void 0),s.forEach((t=>t()))}}function o(t,e){const i=s(null),n=t=>{i.set(t)};return t.addEventListener(e,n),i._cleanup=()=>{t.removeEventListener(e,n)},i}function l(t){const e=t._cleanup;"function"==typeof e&&e()}function h(t,e={}){const{threshold:i=3,mouseButton:n=0,touchDelay:r=100}=e,o=s(null),h=new Map,a=matchMedia("(pointer: coarse)").matches;let d=()=>{};const c=e=>{if(e.button!==n)return;if(h.set(e.pointerId,e),h.size>1)return;let s=e.clientX,l=e.clientY,c=!1;const u=Date.now(),v=t.getBoundingClientRect(),{left:p,top:g}=v,m=t=>{if(t.defaultPrevented||h.size>1)return;if(a&&Date.now()-u<r)return;const e=t.clientX,n=t.clientY,d=e-s,v=n-l;(c||Math.abs(d)>i||Math.abs(v)>i)&&(t.preventDefault(),t.stopPropagation(),c||(o.set({type:"start",x:s-p,y:l-g}),c=!0),o.set({type:"move",x:e-p,y:n-g,deltaX:d,deltaY:v}),s=e,l=n)},f=t=>{if(h.delete(t.pointerId),c){const e=t.clientX,i=t.clientY;o.set({type:"end",x:e-p,y:i-g})}d()},b=t=>{h.delete(t.pointerId),t.relatedTarget&&t.relatedTarget!==document.documentElement||f(t)},E=t=>{c&&(t.stopPropagation(),t.preventDefault())},C=t=>{t.defaultPrevented||h.size>1||c&&t.preventDefault()};document.addEventListener("pointermove",m),document.addEventListener("pointerup",f),document.addEventListener("pointerout",b),document.addEventListener("pointercancel",b),document.addEventListener("touchmove",C,{passive:!1}),document.addEventListener("click",E,{capture:!0}),d=()=>{document.removeEventListener("pointermove",m),document.removeEventListener("pointerup",f),document.removeEventListener("pointerout",b),document.removeEventListener("pointercancel",b),document.removeEventListener("touchmove",C),setTimeout((()=>{document.removeEventListener("click",E,{capture:!0})}),10)}};t.addEventListener("pointerdown",c);return{signal:o,cleanup:()=>{d(),t.removeEventListener("pointerdown",c),h.clear(),l(o)}}}class a extends t{constructor(t,e,i=0){var n,s,r,o,l,h,a,d,c,u;super(),this.totalDuration=e,this.numberOfChannels=i,this.element=null,this.minLength=0,this.maxLength=1/0,this.contentEditable=!1,this.subscriptions=[],this.updatingSide=void 0,this.isRemoved=!1,this.subscriptions=[],this.id=t.id||`region-${Math.random().toString(32).slice(2)}`,this.start=this.clampPosition(t.start),this.end=this.clampPosition(null!==(n=t.end)&&void 0!==n?n:t.start),this.drag=null===(s=t.drag)||void 0===s||s,this.resize=null===(r=t.resize)||void 0===r||r,this.resizeStart=null===(o=t.resizeStart)||void 0===o||o,this.resizeEnd=null===(l=t.resizeEnd)||void 0===l||l,this.color=null!==(h=t.color)&&void 0!==h?h:"rgba(0, 0, 0, 0.1)",this.minLength=null!==(a=t.minLength)&&void 0!==a?a:this.minLength,this.maxLength=null!==(d=t.maxLength)&&void 0!==d?d:this.maxLength,this.channelIdx=null!==(c=t.channelIdx)&&void 0!==c?c:-1,this.contentEditable=null!==(u=t.contentEditable)&&void 0!==u?u:this.contentEditable,this.element=this.initElement(),this.setContent(t.content),this.setPart(),this.renderPosition(),this.initMouseEvents()}clampPosition(t){return Math.max(0,Math.min(this.totalDuration,t))}setPart(){var t;const e=this.start===this.end;null===(t=this.element)||void 0===t||t.setAttribute("part",`${e?"marker":"region"} ${this.id}`)}addResizeHandles(t){const e={position:"absolute",zIndex:"2",width:"6px",height:"100%",top:"0",cursor:"ew-resize",wordBreak:"keep-all"},i=n("div",{part:"region-handle region-handle-left",style:Object.assign(Object.assign({},e),{left:"0",borderLeft:"2px solid rgba(0, 0, 0, 0.5)",borderRadius:"2px 0 0 2px"})},t),s=n("div",{part:"region-handle region-handle-right",style:Object.assign(Object.assign({},e),{right:"0",borderRight:"2px solid rgba(0, 0, 0, 0.5)",borderRadius:"0 2px 2px 0"})},t),o=h(i,{threshold:1}),l=h(s,{threshold:1}),a=r((()=>{const t=o.signal.value;t&&("move"===t.type&&void 0!==t.deltaX?this.onResize(t.deltaX,"start"):"end"===t.type&&this.onEndResizing("start"))}),[o.signal]),d=r((()=>{const t=l.signal.value;t&&("move"===t.type&&void 0!==t.deltaX?this.onResize(t.deltaX,"end"):"end"===t.type&&this.onEndResizing("end"))}),[l.signal]);this.subscriptions.push((()=>{a(),d(),o.cleanup(),l.cleanup()}))}removeResizeHandles(t){const e=t.querySelector('[part*="region-handle-left"]'),i=t.querySelector('[part*="region-handle-right"]');e&&t.removeChild(e),i&&t.removeChild(i)}initElement(){if(this.isRemoved)return null;const t=this.start===this.end;let e=0,i=100;this.channelIdx>=0&&this.numberOfChannels>0&&this.channelIdx<this.numberOfChannels&&(i=100/this.numberOfChannels,e=i*this.channelIdx);const s=n("div",{style:{position:"absolute",top:`${e}%`,height:`${i}%`,backgroundColor:t?"none":this.color,borderLeft:t?"2px solid "+this.color:"none",borderRadius:"2px",boxSizing:"border-box",transition:"background-color 0.2s ease",cursor:this.drag?"grab":"default",pointerEvents:"all"}});return!t&&this.resize&&this.addResizeHandles(s),s}renderPosition(){if(!this.element)return;const t=this.start/this.totalDuration,e=(this.totalDuration-this.end)/this.totalDuration;this.element.style.left=100*t+"%",this.element.style.right=100*e+"%"}toggleCursor(t){var e;this.drag&&(null===(e=this.element)||void 0===e?void 0:e.style)&&(this.element.style.cursor=t?"grabbing":"grab")}initMouseEvents(){const{element:t}=this;if(!t)return;const e=o(t,"click"),i=o(t,"mouseenter"),n=o(t,"mouseleave"),s=o(t,"dblclick"),a=o(t,"pointerdown"),d=o(t,"pointerup"),c=e.subscribe((t=>t&&this.emit("click",t))),u=i.subscribe((t=>t&&this.emit("over",t))),v=n.subscribe((t=>t&&this.emit("leave",t))),p=s.subscribe((t=>t&&this.emit("dblclick",t))),g=a.subscribe((t=>t&&this.toggleCursor(!0))),m=d.subscribe((t=>t&&this.toggleCursor(!1)));this.subscriptions.push((()=>{c(),u(),v(),p(),g(),m(),l(e),l(i),l(n),l(s),l(a),l(d)}));const f=h(t),b=r((()=>{const t=f.signal.value;t&&("start"===t.type?this.toggleCursor(!0):"move"===t.type&&void 0!==t.deltaX?this.onMove(t.deltaX):"end"===t.type&&(this.toggleCursor(!1),this.drag&&this.emit("update-end")))}),[f.signal]);this.subscriptions.push((()=>{b(),f.cleanup()})),this.contentEditable&&this.content&&(this.contentClickListener=t=>this.onContentClick(t),this.contentBlurListener=()=>this.onContentBlur(),this.content.addEventListener("click",this.contentClickListener),this.content.addEventListener("blur",this.contentBlurListener))}_onUpdate(t,e,i){var n;if(!(null===(n=this.element)||void 0===n?void 0:n.parentElement))return;const{width:s}=this.element.parentElement.getBoundingClientRect(),r=t/s*this.totalDuration;let o=e&&"start"!==e?this.start:this.start+r,l=e&&"end"!==e?this.end:this.end+r;const h=void 0!==i;h&&this.updatingSide&&this.updatingSide!==e&&("start"===this.updatingSide?o=i:l=i),o=Math.max(0,o),l=Math.min(this.totalDuration,l);const a=l-o;this.updatingSide=e;const d=a>=this.minLength&&a<=this.maxLength;o<=l&&(d||h)&&(this.start=o,this.end=l,this.renderPosition(),this.emit("update",e))}onMove(t){this.drag&&this._onUpdate(t)}onResize(t,e){this.resize&&(this.resizeStart||"start"!==e)&&(this.resizeEnd||"end"!==e)&&this._onUpdate(t,e)}onEndResizing(t){this.resize&&(this.emit("update-end",t),this.updatingSide=void 0)}onContentClick(t){t.stopPropagation();t.target.focus(),this.emit("click",t)}onContentBlur(){this.emit("update-end")}_setTotalDuration(t){this.totalDuration=t,this.renderPosition()}play(t){this.emit("play",t&&this.end!==this.start?this.end:void 0)}getContent(t=!1){var e;return t?this.content||void 0:this.element instanceof HTMLElement?(null===(e=this.content)||void 0===e?void 0:e.innerHTML)||void 0:""}setContent(t){var e;if(this.element)if(this.content&&this.contentEditable&&(this.contentClickListener&&this.content.removeEventListener("click",this.contentClickListener),this.contentBlurListener&&this.content.removeEventListener("blur",this.contentBlurListener)),null===(e=this.content)||void 0===e||e.remove(),t){if("string"==typeof t){const e=this.start===this.end;this.content=n("div",{style:{padding:`0.2em ${e?.2:.4}em`,display:"inline-block"},textContent:t})}else this.content=t;this.contentEditable&&(this.content.contentEditable="true",this.contentClickListener=t=>this.onContentClick(t),this.contentBlurListener=()=>this.onContentBlur(),this.content.addEventListener("click",this.contentClickListener),this.content.addEventListener("blur",this.contentBlurListener)),this.content.setAttribute("part","region-content"),this.element.appendChild(this.content),this.emit("content-changed")}else this.content=void 0}setOptions(t){var e,i;if(this.element){if(t.color&&(this.color=t.color,this.element.style.backgroundColor=this.color),void 0!==t.drag&&(this.drag=t.drag,this.element.style.cursor=this.drag?"grab":"default"),void 0!==t.start||void 0!==t.end){const n=this.start===this.end;this.start=this.clampPosition(null!==(e=t.start)&&void 0!==e?e:this.start),this.end=this.clampPosition(null!==(i=t.end)&&void 0!==i?i:n?this.start:this.end),this.renderPosition(),this.setPart(),this.emit("render")}if(t.content&&this.setContent(t.content),t.id&&(this.id=t.id,this.setPart()),void 0!==t.resize&&t.resize!==this.resize){const e=this.start===this.end;this.resize=t.resize,this.resize&&!e?this.addResizeHandles(this.element):this.removeResizeHandles(this.element)}void 0!==t.resizeStart&&(this.resizeStart=t.resizeStart),void 0!==t.resizeEnd&&(this.resizeEnd=t.resizeEnd)}}remove(){this.isRemoved=!0,this.emit("remove"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.content&&this.contentEditable&&(this.contentClickListener&&(this.content.removeEventListener("click",this.contentClickListener),this.contentClickListener=void 0),this.contentBlurListener&&(this.content.removeEventListener("blur",this.contentBlurListener),this.contentBlurListener=void 0)),this.element&&(this.element.remove(),this.element=null),this.unAll()}}class d extends e{constructor(t){super(t),this.regions=[],this.regionsContainer=this.initRegionsContainer()}static create(t){return new d(t)}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");this.wavesurfer.getWrapper().appendChild(this.regionsContainer),this.subscriptions.push(this.wavesurfer.on("ready",(t=>{this.regions.forEach((e=>e._setTotalDuration(t)))})));let t=[];this.subscriptions.push(this.wavesurfer.on("timeupdate",(e=>{const i=this.regions.filter((t=>t.start<=e&&(t.end===t.start?t.start+.05:t.end)>=e));i.forEach((e=>{t.includes(e)||this.emit("region-in",e)})),t.forEach((t=>{i.includes(t)||this.emit("region-out",t)})),t=i})))}initRegionsContainer(){return n("div",{part:"regions-container",style:{position:"absolute",top:"0",left:"0",width:"100%",height:"100%",zIndex:"5",pointerEvents:"none"}})}getRegions(){return this.regions}avoidOverlapping(t){t.content&&!t.isRemoved&&setTimeout((()=>{const e=t.content,i=e.getBoundingClientRect(),n=this.regions.indexOf(t),s=this.regions.slice(0,n).filter((t=>!t.isRemoved)).map((e=>{if(e===t||!e.content)return 0;const n=e.content.getBoundingClientRect();return i.left<n.left+n.width&&n.left<i.left+i.width?n.height+2:0})).reduce(((t,e)=>t+e),0);e.style.marginTop=`${s}px`}),10)}adjustScroll(t){var e,i;if(!t.element)return;const n=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getWrapper())||void 0===i?void 0:i.parentElement;if(!n)return;const{clientWidth:s,scrollWidth:r}=n;if(r<=s)return;const o=n.getBoundingClientRect(),l=t.element.getBoundingClientRect(),h=l.left-o.left,a=l.right-o.left;h<0?n.scrollLeft+=h:a>s&&(n.scrollLeft+=a-s)}virtualAppend(t,e,i){const n=()=>{if(!this.wavesurfer)return;const n=this.wavesurfer.getWidth(),s=this.wavesurfer.getScroll(),r=e.clientWidth,o=this.wavesurfer.getDuration(),l=Math.round(t.start/o*r),h=l+(Math.round((t.end-t.start)/o*r)||1)>s&&l<s+n;h&&!i.parentElement?e.appendChild(i):!h&&i.parentElement&&i.remove()};setTimeout((()=>{if(!this.wavesurfer||!t.element)return;n();const e=this.wavesurfer.on("scroll",n),i=this.wavesurfer.on("zoom",n),s=this.wavesurfer.on("resize",n),r=t.on("render",n);this.subscriptions.push(e,i,s,r),t.once("remove",(()=>{e(),i(),s(),r()}))}),0)}saveRegion(t){if(!t.element)return;this.virtualAppend(t,this.regionsContainer,t.element),this.avoidOverlapping(t),this.regions.push(t);const e=[t.on("update",(e=>{e||this.adjustScroll(t),this.emit("region-update",t,e)})),t.on("update-end",(e=>{this.avoidOverlapping(t),this.emit("region-updated",t,e)})),t.on("play",(e=>{var i;null===(i=this.wavesurfer)||void 0===i||i.play(t.start,e)})),t.on("click",(e=>{this.emit("region-clicked",t,e)})),t.on("dblclick",(e=>{this.emit("region-double-clicked",t,e)})),t.on("content-changed",(()=>{this.emit("region-content-changed",t)})),t.once("remove",(()=>{e.forEach((t=>t())),this.regions=this.regions.filter((e=>e!==t)),this.emit("region-removed",t)}))];this.subscriptions.push(...e),this.emit("region-created",t)}addRegion(t){var e,i;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const n=this.wavesurfer.getDuration(),s=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDecodedData())||void 0===i?void 0:i.numberOfChannels,r=new a(t,n,s);return this.emit("region-initialized",r),n?this.saveRegion(r):this.subscriptions.push(this.wavesurfer.once("ready",(t=>{r._setTotalDuration(t),this.saveRegion(r)}))),r}enableDragSelection(t,e=3){var i;const n=null===(i=this.wavesurfer)||void 0===i?void 0:i.getWrapper();if(!(n&&n instanceof HTMLElement))return()=>{};let s=null,o=0,l=0;const d=h(n,{threshold:e}),c=r((()=>{var e,i;const n=d.signal.value;if(n)if("start"===n.type){if(o=n.x,!this.wavesurfer)return;const r=this.wavesurfer.getDuration(),h=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDecodedData())||void 0===i?void 0:i.numberOfChannels,{width:d}=this.wavesurfer.getWrapper().getBoundingClientRect();l=o/d*r;const c=n.x/d*r,u=(n.x+5)/d*r;s=new a(Object.assign(Object.assign({},t),{start:c,end:u}),r,h),this.emit("region-initialized",s),s.element&&this.regionsContainer.appendChild(s.element)}else"move"===n.type&&void 0!==n.deltaX?s&&s._onUpdate(n.deltaX,n.x>o?"end":"start",l):"end"===n.type&&s&&(this.saveRegion(s),s.updatingSide=void 0,s=null)}),[d.signal]);return()=>{c(),d.cleanup()}}clearRegions(){this.regions.slice().forEach((t=>t.remove())),this.regions=[]}destroy(){this.clearRegions(),super.destroy(),this.regionsContainer.remove()}}module.exports=d;

package/dist/plugins/regions.esm.js

@@ -0,0 +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=(...n)=>{this.un(t,i),e(...n)};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 n=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,s]of Object.entries(e))if("children"===t&&s)for(const[t,e]of Object.entries(s))e instanceof Node?n.appendChild(e):"string"==typeof e?n.appendChild(document.createTextNode(e)):n.appendChild(i(t,e));else"style"===t?Object.assign(n.style,s):"textContent"===t?n.textContent=s:n.setAttribute(t,s.toString());return n}function n(t,e,n){const s=i(t,e||{});return null==n||n.appendChild(s),s}function s(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))}}function r(t,e){let i;const n=()=>{i&&(i(),i=void 0),i=t()},s=e.map((t=>t.subscribe(n)));return n(),()=>{i&&(i(),i=void 0),s.forEach((t=>t()))}}function o(t,e){const i=s(null),n=t=>{i.set(t)};return t.addEventListener(e,n),i._cleanup=()=>{t.removeEventListener(e,n)},i}function l(t){const e=t._cleanup;"function"==typeof e&&e()}function h(t,e={}){const{threshold:i=3,mouseButton:n=0,touchDelay:r=100}=e,o=s(null),h=new Map,a=matchMedia("(pointer: coarse)").matches;let d=()=>{};const c=e=>{if(e.button!==n)return;if(h.set(e.pointerId,e),h.size>1)return;let s=e.clientX,l=e.clientY,c=!1;const u=Date.now(),v=t.getBoundingClientRect(),{left:p,top:g}=v,m=t=>{if(t.defaultPrevented||h.size>1)return;if(a&&Date.now()-u<r)return;const e=t.clientX,n=t.clientY,d=e-s,v=n-l;(c||Math.abs(d)>i||Math.abs(v)>i)&&(t.preventDefault(),t.stopPropagation(),c||(o.set({type:"start",x:s-p,y:l-g}),c=!0),o.set({type:"move",x:e-p,y:n-g,deltaX:d,deltaY:v}),s=e,l=n)},f=t=>{if(h.delete(t.pointerId),c){const e=t.clientX,i=t.clientY;o.set({type:"end",x:e-p,y:i-g})}d()},b=t=>{h.delete(t.pointerId),t.relatedTarget&&t.relatedTarget!==document.documentElement||f(t)},E=t=>{c&&(t.stopPropagation(),t.preventDefault())},C=t=>{t.defaultPrevented||h.size>1||c&&t.preventDefault()};document.addEventListener("pointermove",m),document.addEventListener("pointerup",f),document.addEventListener("pointerout",b),document.addEventListener("pointercancel",b),document.addEventListener("touchmove",C,{passive:!1}),document.addEventListener("click",E,{capture:!0}),d=()=>{document.removeEventListener("pointermove",m),document.removeEventListener("pointerup",f),document.removeEventListener("pointerout",b),document.removeEventListener("pointercancel",b),document.removeEventListener("touchmove",C),setTimeout((()=>{document.removeEventListener("click",E,{capture:!0})}),10)}};t.addEventListener("pointerdown",c);return{signal:o,cleanup:()=>{d(),t.removeEventListener("pointerdown",c),h.clear(),l(o)}}}class a extends t{constructor(t,e,i=0){var n,s,r,o,l,h,a,d,c,u;super(),this.totalDuration=e,this.numberOfChannels=i,this.element=null,this.minLength=0,this.maxLength=1/0,this.contentEditable=!1,this.subscriptions=[],this.updatingSide=void 0,this.isRemoved=!1,this.subscriptions=[],this.id=t.id||`region-${Math.random().toString(32).slice(2)}`,this.start=this.clampPosition(t.start),this.end=this.clampPosition(null!==(n=t.end)&&void 0!==n?n:t.start),this.drag=null===(s=t.drag)||void 0===s||s,this.resize=null===(r=t.resize)||void 0===r||r,this.resizeStart=null===(o=t.resizeStart)||void 0===o||o,this.resizeEnd=null===(l=t.resizeEnd)||void 0===l||l,this.color=null!==(h=t.color)&&void 0!==h?h:"rgba(0, 0, 0, 0.1)",this.minLength=null!==(a=t.minLength)&&void 0!==a?a:this.minLength,this.maxLength=null!==(d=t.maxLength)&&void 0!==d?d:this.maxLength,this.channelIdx=null!==(c=t.channelIdx)&&void 0!==c?c:-1,this.contentEditable=null!==(u=t.contentEditable)&&void 0!==u?u:this.contentEditable,this.element=this.initElement(),this.setContent(t.content),this.setPart(),this.renderPosition(),this.initMouseEvents()}clampPosition(t){return Math.max(0,Math.min(this.totalDuration,t))}setPart(){var t;const e=this.start===this.end;null===(t=this.element)||void 0===t||t.setAttribute("part",`${e?"marker":"region"} ${this.id}`)}addResizeHandles(t){const e={position:"absolute",zIndex:"2",width:"6px",height:"100%",top:"0",cursor:"ew-resize",wordBreak:"keep-all"},i=n("div",{part:"region-handle region-handle-left",style:Object.assign(Object.assign({},e),{left:"0",borderLeft:"2px solid rgba(0, 0, 0, 0.5)",borderRadius:"2px 0 0 2px"})},t),s=n("div",{part:"region-handle region-handle-right",style:Object.assign(Object.assign({},e),{right:"0",borderRight:"2px solid rgba(0, 0, 0, 0.5)",borderRadius:"0 2px 2px 0"})},t),o=h(i,{threshold:1}),l=h(s,{threshold:1}),a=r((()=>{const t=o.signal.value;t&&("move"===t.type&&void 0!==t.deltaX?this.onResize(t.deltaX,"start"):"end"===t.type&&this.onEndResizing("start"))}),[o.signal]),d=r((()=>{const t=l.signal.value;t&&("move"===t.type&&void 0!==t.deltaX?this.onResize(t.deltaX,"end"):"end"===t.type&&this.onEndResizing("end"))}),[l.signal]);this.subscriptions.push((()=>{a(),d(),o.cleanup(),l.cleanup()}))}removeResizeHandles(t){const e=t.querySelector('[part*="region-handle-left"]'),i=t.querySelector('[part*="region-handle-right"]');e&&t.removeChild(e),i&&t.removeChild(i)}initElement(){if(this.isRemoved)return null;const t=this.start===this.end;let e=0,i=100;this.channelIdx>=0&&this.numberOfChannels>0&&this.channelIdx<this.numberOfChannels&&(i=100/this.numberOfChannels,e=i*this.channelIdx);const s=n("div",{style:{position:"absolute",top:`${e}%`,height:`${i}%`,backgroundColor:t?"none":this.color,borderLeft:t?"2px solid "+this.color:"none",borderRadius:"2px",boxSizing:"border-box",transition:"background-color 0.2s ease",cursor:this.drag?"grab":"default",pointerEvents:"all"}});return!t&&this.resize&&this.addResizeHandles(s),s}renderPosition(){if(!this.element)return;const t=this.start/this.totalDuration,e=(this.totalDuration-this.end)/this.totalDuration;this.element.style.left=100*t+"%",this.element.style.right=100*e+"%"}toggleCursor(t){var e;this.drag&&(null===(e=this.element)||void 0===e?void 0:e.style)&&(this.element.style.cursor=t?"grabbing":"grab")}initMouseEvents(){const{element:t}=this;if(!t)return;const e=o(t,"click"),i=o(t,"mouseenter"),n=o(t,"mouseleave"),s=o(t,"dblclick"),a=o(t,"pointerdown"),d=o(t,"pointerup"),c=e.subscribe((t=>t&&this.emit("click",t))),u=i.subscribe((t=>t&&this.emit("over",t))),v=n.subscribe((t=>t&&this.emit("leave",t))),p=s.subscribe((t=>t&&this.emit("dblclick",t))),g=a.subscribe((t=>t&&this.toggleCursor(!0))),m=d.subscribe((t=>t&&this.toggleCursor(!1)));this.subscriptions.push((()=>{c(),u(),v(),p(),g(),m(),l(e),l(i),l(n),l(s),l(a),l(d)}));const f=h(t),b=r((()=>{const t=f.signal.value;t&&("start"===t.type?this.toggleCursor(!0):"move"===t.type&&void 0!==t.deltaX?this.onMove(t.deltaX):"end"===t.type&&(this.toggleCursor(!1),this.drag&&this.emit("update-end")))}),[f.signal]);this.subscriptions.push((()=>{b(),f.cleanup()})),this.contentEditable&&this.content&&(this.contentClickListener=t=>this.onContentClick(t),this.contentBlurListener=()=>this.onContentBlur(),this.content.addEventListener("click",this.contentClickListener),this.content.addEventListener("blur",this.contentBlurListener))}_onUpdate(t,e,i){var n;if(!(null===(n=this.element)||void 0===n?void 0:n.parentElement))return;const{width:s}=this.element.parentElement.getBoundingClientRect(),r=t/s*this.totalDuration;let o=e&&"start"!==e?this.start:this.start+r,l=e&&"end"!==e?this.end:this.end+r;const h=void 0!==i;h&&this.updatingSide&&this.updatingSide!==e&&("start"===this.updatingSide?o=i:l=i),o=Math.max(0,o),l=Math.min(this.totalDuration,l);const a=l-o;this.updatingSide=e;const d=a>=this.minLength&&a<=this.maxLength;o<=l&&(d||h)&&(this.start=o,this.end=l,this.renderPosition(),this.emit("update",e))}onMove(t){this.drag&&this._onUpdate(t)}onResize(t,e){this.resize&&(this.resizeStart||"start"!==e)&&(this.resizeEnd||"end"!==e)&&this._onUpdate(t,e)}onEndResizing(t){this.resize&&(this.emit("update-end",t),this.updatingSide=void 0)}onContentClick(t){t.stopPropagation();t.target.focus(),this.emit("click",t)}onContentBlur(){this.emit("update-end")}_setTotalDuration(t){this.totalDuration=t,this.renderPosition()}play(t){this.emit("play",t&&this.end!==this.start?this.end:void 0)}getContent(t=!1){var e;return t?this.content||void 0:this.element instanceof HTMLElement?(null===(e=this.content)||void 0===e?void 0:e.innerHTML)||void 0:""}setContent(t){var e;if(this.element)if(this.content&&this.contentEditable&&(this.contentClickListener&&this.content.removeEventListener("click",this.contentClickListener),this.contentBlurListener&&this.content.removeEventListener("blur",this.contentBlurListener)),null===(e=this.content)||void 0===e||e.remove(),t){if("string"==typeof t){const e=this.start===this.end;this.content=n("div",{style:{padding:`0.2em ${e?.2:.4}em`,display:"inline-block"},textContent:t})}else this.content=t;this.contentEditable&&(this.content.contentEditable="true",this.contentClickListener=t=>this.onContentClick(t),this.contentBlurListener=()=>this.onContentBlur(),this.content.addEventListener("click",this.contentClickListener),this.content.addEventListener("blur",this.contentBlurListener)),this.content.setAttribute("part","region-content"),this.element.appendChild(this.content),this.emit("content-changed")}else this.content=void 0}setOptions(t){var e,i;if(this.element){if(t.color&&(this.color=t.color,this.element.style.backgroundColor=this.color),void 0!==t.drag&&(this.drag=t.drag,this.element.style.cursor=this.drag?"grab":"default"),void 0!==t.start||void 0!==t.end){const n=this.start===this.end;this.start=this.clampPosition(null!==(e=t.start)&&void 0!==e?e:this.start),this.end=this.clampPosition(null!==(i=t.end)&&void 0!==i?i:n?this.start:this.end),this.renderPosition(),this.setPart(),this.emit("render")}if(t.content&&this.setContent(t.content),t.id&&(this.id=t.id,this.setPart()),void 0!==t.resize&&t.resize!==this.resize){const e=this.start===this.end;this.resize=t.resize,this.resize&&!e?this.addResizeHandles(this.element):this.removeResizeHandles(this.element)}void 0!==t.resizeStart&&(this.resizeStart=t.resizeStart),void 0!==t.resizeEnd&&(this.resizeEnd=t.resizeEnd)}}remove(){this.isRemoved=!0,this.emit("remove"),this.subscriptions.forEach((t=>t())),this.subscriptions=[],this.content&&this.contentEditable&&(this.contentClickListener&&(this.content.removeEventListener("click",this.contentClickListener),this.contentClickListener=void 0),this.contentBlurListener&&(this.content.removeEventListener("blur",this.contentBlurListener),this.contentBlurListener=void 0)),this.element&&(this.element.remove(),this.element=null),this.unAll()}}class d extends e{constructor(t){super(t),this.regions=[],this.regionsContainer=this.initRegionsContainer()}static create(t){return new d(t)}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");this.wavesurfer.getWrapper().appendChild(this.regionsContainer),this.subscriptions.push(this.wavesurfer.on("ready",(t=>{this.regions.forEach((e=>e._setTotalDuration(t)))})));let t=[];this.subscriptions.push(this.wavesurfer.on("timeupdate",(e=>{const i=this.regions.filter((t=>t.start<=e&&(t.end===t.start?t.start+.05:t.end)>=e));i.forEach((e=>{t.includes(e)||this.emit("region-in",e)})),t.forEach((t=>{i.includes(t)||this.emit("region-out",t)})),t=i})))}initRegionsContainer(){return n("div",{part:"regions-container",style:{position:"absolute",top:"0",left:"0",width:"100%",height:"100%",zIndex:"5",pointerEvents:"none"}})}getRegions(){return this.regions}avoidOverlapping(t){t.content&&!t.isRemoved&&setTimeout((()=>{const e=t.content,i=e.getBoundingClientRect(),n=this.regions.indexOf(t),s=this.regions.slice(0,n).filter((t=>!t.isRemoved)).map((e=>{if(e===t||!e.content)return 0;const n=e.content.getBoundingClientRect();return i.left<n.left+n.width&&n.left<i.left+i.width?n.height+2:0})).reduce(((t,e)=>t+e),0);e.style.marginTop=`${s}px`}),10)}adjustScroll(t){var e,i;if(!t.element)return;const n=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getWrapper())||void 0===i?void 0:i.parentElement;if(!n)return;const{clientWidth:s,scrollWidth:r}=n;if(r<=s)return;const o=n.getBoundingClientRect(),l=t.element.getBoundingClientRect(),h=l.left-o.left,a=l.right-o.left;h<0?n.scrollLeft+=h:a>s&&(n.scrollLeft+=a-s)}virtualAppend(t,e,i){const n=()=>{if(!this.wavesurfer)return;const n=this.wavesurfer.getWidth(),s=this.wavesurfer.getScroll(),r=e.clientWidth,o=this.wavesurfer.getDuration(),l=Math.round(t.start/o*r),h=l+(Math.round((t.end-t.start)/o*r)||1)>s&&l<s+n;h&&!i.parentElement?e.appendChild(i):!h&&i.parentElement&&i.remove()};setTimeout((()=>{if(!this.wavesurfer||!t.element)return;n();const e=this.wavesurfer.on("scroll",n),i=this.wavesurfer.on("zoom",n),s=this.wavesurfer.on("resize",n),r=t.on("render",n);this.subscriptions.push(e,i,s,r),t.once("remove",(()=>{e(),i(),s(),r()}))}),0)}saveRegion(t){if(!t.element)return;this.virtualAppend(t,this.regionsContainer,t.element),this.avoidOverlapping(t),this.regions.push(t);const e=[t.on("update",(e=>{e||this.adjustScroll(t),this.emit("region-update",t,e)})),t.on("update-end",(e=>{this.avoidOverlapping(t),this.emit("region-updated",t,e)})),t.on("play",(e=>{var i;null===(i=this.wavesurfer)||void 0===i||i.play(t.start,e)})),t.on("click",(e=>{this.emit("region-clicked",t,e)})),t.on("dblclick",(e=>{this.emit("region-double-clicked",t,e)})),t.on("content-changed",(()=>{this.emit("region-content-changed",t)})),t.once("remove",(()=>{e.forEach((t=>t())),this.regions=this.regions.filter((e=>e!==t)),this.emit("region-removed",t)}))];this.subscriptions.push(...e),this.emit("region-created",t)}addRegion(t){var e,i;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const n=this.wavesurfer.getDuration(),s=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDecodedData())||void 0===i?void 0:i.numberOfChannels,r=new a(t,n,s);return this.emit("region-initialized",r),n?this.saveRegion(r):this.subscriptions.push(this.wavesurfer.once("ready",(t=>{r._setTotalDuration(t),this.saveRegion(r)}))),r}enableDragSelection(t,e=3){var i;const n=null===(i=this.wavesurfer)||void 0===i?void 0:i.getWrapper();if(!(n&&n instanceof HTMLElement))return()=>{};let s=null,o=0,l=0;const d=h(n,{threshold:e}),c=r((()=>{var e,i;const n=d.signal.value;if(n)if("start"===n.type){if(o=n.x,!this.wavesurfer)return;const r=this.wavesurfer.getDuration(),h=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDecodedData())||void 0===i?void 0:i.numberOfChannels,{width:d}=this.wavesurfer.getWrapper().getBoundingClientRect();l=o/d*r;const c=n.x/d*r,u=(n.x+5)/d*r;s=new a(Object.assign(Object.assign({},t),{start:c,end:u}),r,h),this.emit("region-initialized",s),s.element&&this.regionsContainer.appendChild(s.element)}else"move"===n.type&&void 0!==n.deltaX?s&&s._onUpdate(n.deltaX,n.x>o?"end":"start",l):"end"===n.type&&s&&(this.saveRegion(s),s.updatingSide=void 0,s=null)}),[d.signal]);return()=>{c(),d.cleanup()}}clearRegions(){this.regions.slice().forEach((t=>t.remove())),this.regions=[]}destroy(){this.clearRegions(),super.destroy(),this.regionsContainer.remove()}}export{d as default};