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 audioSource: HTMLAudioElement = $state(new Audio());
|
||||||
//let paused: boolean = $derived(audioSource.paused);
|
//let paused: boolean = $derived(audioSource.paused);
|
||||||
//let volume: number = $derived(audioSource.volume);
|
//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 source: HTMLAudioElement = $state();
|
||||||
|
let mode = $state(new PlaybackState());
|
||||||
let title = $state("");
|
let title = $state("");
|
||||||
let queueIndex = $state(0);
|
let queueIndex = $state(0);
|
||||||
let currentSong = $state({
|
let currentSong = $state({
|
||||||
|
@ -119,7 +153,11 @@
|
||||||
progress = source.currentTime;
|
progress = source.currentTime;
|
||||||
}
|
}
|
||||||
|
|
||||||
source.load();
|
currentSong.source.onended = () => {
|
||||||
|
if (mode.current == PlaybackMode.LoopOne) {
|
||||||
|
currentSong.source.play();
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function play() {
|
function play() {
|
||||||
|
@ -199,6 +237,7 @@
|
||||||
{:else}
|
{:else}
|
||||||
<Button onclick={pause}>Pause</Button>
|
<Button onclick={pause}>Pause</Button>
|
||||||
{/if}
|
{/if}
|
||||||
|
<Button class="border p-2" onclick={() => mode.next()}>{mode.get()}</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue