This commit is contained in:
2026-02-10 00:30:38 -08:00
parent c8de948e7f
commit bfae55afa3

View File

@@ -9,28 +9,6 @@
const audio = getAudioContext(); const audio = getAudioContext();
// Local state for slider to allow binding
let sliderValue = $state([0]);
// Sync Audio -> Slider
$effect(() => {
// Only sync if the value is different to avoid unnecessary updates
// and potential loops if onValueChange fires on prop change.
// Using a small threshold or just direct assignment if we trust the loop break.
if (Math.abs(sliderValue[0] - audio.currentTime) > 0.1) {
sliderValue = [audio.currentTime];
}
});
function onSeek(v: number[]) {
// Guard against feedback loop:
// If the value matches current time (within tolerance), it's likely a feedback
// from the effect above -> component -> onValueChange.
if (Math.abs(v[0] - audio.currentTime) < 0.1) return;
audio.seek(v[0]);
}
function onVolume(v: number[]) { function onVolume(v: number[]) {
player.setVolume(v[0]); player.setVolume(v[0]);
} }
@@ -72,12 +50,10 @@
<!-- Progress --> <!-- Progress -->
<div class="space-y-2"> <div class="space-y-2">
<Slider <input
bind:value={sliderValue} type="range"
bind:value={audio.currentTime}
max={audio.duration || 100} max={audio.duration || 100}
step={0.01}
onValueChange={onSeek}
type="multiple"
class="w-full" class="w-full"
/> />
<div <div