Add Playback Modes
This commit is contained in:
parent
1175f88401
commit
c7e0d93fb0
1 changed files with 40 additions and 1 deletions
|
@ -11,9 +11,43 @@
|
|||
//let audioSource: HTMLAudioElement = $state(new Audio());
|
||||
//let paused: boolean = $derived(audioSource.paused);
|
||||
//let volume: number = $derived(audioSource.volume);
|
||||
enum PlaybackMode {
|
||||
Linear,
|
||||
LoopOne,
|
||||
LoopQueue,
|
||||
}
|
||||
|
||||
class PlaybackState {
|
||||
values = {
|
||||
[PlaybackMode.Linear]: "1",
|
||||
[PlaybackMode.LoopOne]: "0",
|
||||
[PlaybackMode.LoopQueue]: "00",
|
||||
}
|
||||
|
||||
current: PlaybackMode = $state(PlaybackMode.Linear);
|
||||
|
||||
next = function() {
|
||||
console.log(this.current)
|
||||
if (this.current == PlaybackMode.LoopQueue) {
|
||||
this.current = -1;
|
||||
}
|
||||
return this.values[++this.current];
|
||||
}
|
||||
|
||||
prev = function() {
|
||||
if (this.current == PlaybackMode.Linear) {
|
||||
this.current = this.values.length;
|
||||
}
|
||||
return this.values[--this.current];
|
||||
}
|
||||
|
||||
get = function() {
|
||||
return this.values[this.current];
|
||||
}
|
||||
}
|
||||
|
||||
let source: HTMLAudioElement = $state();
|
||||
let mode = $state(new PlaybackState());
|
||||
let title = $state("");
|
||||
let queueIndex = $state(0);
|
||||
let currentSong = $state({
|
||||
|
@ -119,7 +153,11 @@
|
|||
progress = source.currentTime;
|
||||
}
|
||||
|
||||
source.load();
|
||||
currentSong.source.onended = () => {
|
||||
if (mode.current == PlaybackMode.LoopOne) {
|
||||
currentSong.source.play();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function play() {
|
||||
|
@ -199,6 +237,7 @@
|
|||
{:else}
|
||||
<Button onclick={pause}>Pause</Button>
|
||||
{/if}
|
||||
<Button class="border p-2" onclick={() => mode.next()}>{mode.get()}</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in a new issue