Move Player code to separate file
This commit is contained in:
parent
1a771168ee
commit
25536b078a
2 changed files with 40 additions and 41 deletions
33
src/lib/player.svelte.ts
Normal file
33
src/lib/player.svelte.ts
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
export enum PlaybackMode {
|
||||||
|
Linear,
|
||||||
|
LoopOne,
|
||||||
|
LoopQueue,
|
||||||
|
}
|
||||||
|
|
||||||
|
export class PlaybackStateSvelte {
|
||||||
|
values = {
|
||||||
|
[PlaybackMode.Linear]: "1",
|
||||||
|
[PlaybackMode.LoopOne]: "0",
|
||||||
|
[PlaybackMode.LoopQueue]: "00",
|
||||||
|
}
|
||||||
|
|
||||||
|
current: PlaybackMode = $state(PlaybackMode.Linear);
|
||||||
|
|
||||||
|
next = function() {
|
||||||
|
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];
|
||||||
|
}
|
||||||
|
}
|
|
@ -4,50 +4,18 @@
|
||||||
import {OpenSubsonic} from "$lib/opensubsonic";
|
import {OpenSubsonic} from "$lib/opensubsonic";
|
||||||
import {onMount} from "svelte";
|
import {onMount} from "svelte";
|
||||||
import QueueFrame from "$lib/components/custom/QueueFrame.svelte";
|
import QueueFrame from "$lib/components/custom/QueueFrame.svelte";
|
||||||
//import PlayerFrame from "$lib/components/custom/PlayerFrame.svelte";
|
//import PlayerFrame from "$lib/components/custom/PlayerControls.svelte";
|
||||||
import {Button} from "$lib/components/ui/button";
|
import {Button} from "$lib/components/ui/button";
|
||||||
|
import {PlaybackMode, PlaybackStateSvelte} from "$lib/player.svelte.js";
|
||||||
|
import PlayerSidebar from "$lib/components/custom/PlayerSidebar.svelte";
|
||||||
|
|
||||||
function toFixedNumber(num, digits, base){
|
function toFixedNumber(num, digits, base){
|
||||||
const pow = Math.pow(base ?? 10, digits);
|
const pow = Math.pow(base ?? 10, digits);
|
||||||
return Math.round(num*pow) / pow;
|
return Math.round(num*pow) / pow;
|
||||||
}
|
}
|
||||||
|
|
||||||
enum PlaybackMode {
|
|
||||||
Linear,
|
|
||||||
LoopOne,
|
|
||||||
LoopQueue,
|
|
||||||
}
|
|
||||||
|
|
||||||
class PlaybackState {
|
|
||||||
values = {
|
|
||||||
[PlaybackMode.Linear]: "1",
|
|
||||||
[PlaybackMode.LoopOne]: "0",
|
|
||||||
[PlaybackMode.LoopQueue]: "00",
|
|
||||||
}
|
|
||||||
|
|
||||||
current: PlaybackMode = $state(PlaybackMode.Linear);
|
|
||||||
|
|
||||||
next = function() {
|
|
||||||
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 mode = $state(new PlaybackStateSvelte());
|
||||||
let title = $state("");
|
let title = $state("");
|
||||||
let artist = $state("");
|
let artist = $state("");
|
||||||
let queueIndex = $state(0);
|
let queueIndex = $state(0);
|
||||||
|
@ -201,7 +169,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
function displayTime(rawSeconds: number) {
|
function displayTime(rawSeconds: number) {
|
||||||
const intSeconds = rawSeconds.toFixed(0);
|
const intSeconds = Math.round(rawSeconds);
|
||||||
const seconds = intSeconds % 60;
|
const seconds = intSeconds % 60;
|
||||||
const minutes = Math.floor((intSeconds / 60)) % 60;
|
const minutes = Math.floor((intSeconds / 60)) % 60;
|
||||||
const hours = Math.floor((intSeconds / 3600));
|
const hours = Math.floor((intSeconds / 3600));
|
||||||
|
@ -218,7 +186,7 @@
|
||||||
fetchQueue().then(() => {
|
fetchQueue().then(() => {
|
||||||
fetchNowPlaying();
|
fetchNowPlaying();
|
||||||
});
|
});
|
||||||
currentSong.source = new Audio();
|
currentSong.source = new Audio(); // needed so source is not undefined
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -228,9 +196,7 @@
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<div class="border border-2 flex-1 grid grid-cols-5">
|
<div class="border border-2 flex-1 grid grid-cols-5">
|
||||||
<div class="border border-2 col-span-1">
|
<!--<PlayerSidebar bind:selectedPlayerView />-->
|
||||||
<h1>Left Sidebar</h1>
|
|
||||||
</div>
|
|
||||||
<div class="border border-2 col-span-3">
|
<div class="border border-2 col-span-3">
|
||||||
<h1>Center</h1>
|
<h1>Center</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue