47 lines
1012 B
TypeScript
47 lines
1012 B
TypeScript
import { getContext, setContext } from "svelte";
|
|
|
|
const AUDIO_CTX_KEY = "amqtrain:player:audio-ctx";
|
|
|
|
export class AudioContext {
|
|
currentTime = $state(0);
|
|
duration = $state(0);
|
|
paused = $state(true);
|
|
|
|
private audioEl: HTMLAudioElement | null = null;
|
|
|
|
setElement(el: HTMLAudioElement) {
|
|
this.audioEl = el;
|
|
}
|
|
|
|
// Bindings will handle state updates, but we need methods to control play/pause
|
|
// from other components.
|
|
// Since we bind to `this.paused`, toggling it here will trigger the audio element.
|
|
|
|
play() {
|
|
this.paused = false;
|
|
}
|
|
|
|
pause() {
|
|
this.paused = true;
|
|
}
|
|
|
|
toggle() {
|
|
this.paused = !this.paused;
|
|
}
|
|
|
|
seek(time: number) {
|
|
// Seeking is done by updating currentTime, which is bound to the audio element.
|
|
this.currentTime = Math.max(0, Math.min(time, this.duration));
|
|
}
|
|
}
|
|
|
|
export function setAudioContext() {
|
|
const ctx = new AudioContext();
|
|
setContext(AUDIO_CTX_KEY, ctx);
|
|
return ctx;
|
|
}
|
|
|
|
export function getAudioContext() {
|
|
return getContext<AudioContext>(AUDIO_CTX_KEY);
|
|
}
|