Improve Volume Handling
This commit is contained in:
parent
115d30dc67
commit
d1903045a4
1 changed files with 15 additions and 4 deletions
|
@ -126,11 +126,20 @@
|
||||||
source.pause();
|
source.pause();
|
||||||
}
|
}
|
||||||
|
|
||||||
$effect(() => {
|
function changeVolume(change: number) {
|
||||||
if (source) {
|
if (volume + change > 1) {
|
||||||
source.volume = volume;
|
volume = 1;
|
||||||
|
}
|
||||||
|
else if (volume + change < 0) {
|
||||||
|
volume = 0;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
volume = toFixedNumber(volume + change, 2, 10) ;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (currentSong.source) {
|
||||||
|
currentSong.source.volume = volume;
|
||||||
}
|
}
|
||||||
});
|
|
||||||
|
|
||||||
function progressPercent() {
|
function progressPercent() {
|
||||||
return progress / duration * 100 || 0;
|
return progress / duration * 100 || 0;
|
||||||
|
@ -175,6 +184,8 @@
|
||||||
<p class="border p-2">Volume: {volume}</p>
|
<p class="border p-2">Volume: {volume}</p>
|
||||||
<p class="border p-2">{displayTime(progress)}/{displayTime(duration)}</p>
|
<p class="border p-2">{displayTime(progress)}/{displayTime(duration)}</p>
|
||||||
<p class="border p-2">{progressPercent().toFixed(2)}%</p>
|
<p class="border p-2">{progressPercent().toFixed(2)}%</p>
|
||||||
|
<Button class="border p-2" onclick={() => changeVolume(-0.05)}>-</Button>
|
||||||
|
<Button class="border p-2" onclick={() => changeVolume(0.05)}>+</Button>
|
||||||
{#if isPaused}
|
{#if isPaused}
|
||||||
<Button onclick={play}>Play</Button>
|
<Button onclick={play}>Play</Button>
|
||||||
{:else}
|
{:else}
|
||||||
|
|
Loading…
Reference in a new issue