fix
This commit is contained in:
@@ -9,28 +9,6 @@
|
||||
|
||||
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[]) {
|
||||
player.setVolume(v[0]);
|
||||
}
|
||||
@@ -72,12 +50,10 @@
|
||||
|
||||
<!-- Progress -->
|
||||
<div class="space-y-2">
|
||||
<Slider
|
||||
bind:value={sliderValue}
|
||||
<input
|
||||
type="range"
|
||||
bind:value={audio.currentTime}
|
||||
max={audio.duration || 100}
|
||||
step={0.01}
|
||||
onValueChange={onSeek}
|
||||
type="multiple"
|
||||
class="w-full"
|
||||
/>
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user