Make Center Module reactive & use snippets
This commit is contained in:
parent
b69f04fbe8
commit
e162c674bf
1 changed files with 22 additions and 4 deletions
|
@ -10,6 +10,8 @@
|
||||||
import {Button} from "$lib/components/ui/button";
|
import {Button} from "$lib/components/ui/button";
|
||||||
import {PlaybackMode, PlaybackStateSvelte} from "$lib/player.svelte.js";
|
import {PlaybackMode, PlaybackStateSvelte} from "$lib/player.svelte.js";
|
||||||
import PlayerSidebar from "$lib/components/custom/PlayerSidebar.svelte";
|
import PlayerSidebar from "$lib/components/custom/PlayerSidebar.svelte";
|
||||||
|
import AlbumView from "$lib/components/custom/Views/AlbumView.svelte";
|
||||||
|
import {AlbumViews, Views} from "$lib/components/custom/Views/views.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);
|
||||||
|
@ -202,13 +204,29 @@
|
||||||
<meta name="robots" content="noindex nofollow" />
|
<meta name="robots" content="noindex nofollow" />
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<div class="border border-2 flex-1 grid grid-cols-5">
|
{#snippet centerModule()}
|
||||||
<PlayerSidebar />
|
<div class="border border-2 col-span-3 overflow-hidden">
|
||||||
<div class="border border-2 col-span-3">
|
{#if viewMode === Views.Albums}
|
||||||
<h1>Center</h1>
|
<AlbumView viewMode={subViewMode}/>
|
||||||
|
{:else if viewMode === Views.Artists}
|
||||||
|
<p>Get Fucked</p>
|
||||||
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
{/snippet}
|
||||||
|
|
||||||
|
{#snippet leftModule()}
|
||||||
<PlayerSidebar bind:view={viewMode} bind:subView={subViewMode} />
|
<PlayerSidebar bind:view={viewMode} bind:subView={subViewMode} />
|
||||||
|
{/snippet}
|
||||||
|
|
||||||
|
{#snippet rightModule()}
|
||||||
<QueueFrame {queue} {fetchQueue} {saveQueue} {removeSongFromQueue} {playSong} currentIndex={currentSong.queueIndex} />
|
<QueueFrame {queue} {fetchQueue} {saveQueue} {removeSongFromQueue} {playSong} currentIndex={currentSong.queueIndex} />
|
||||||
|
{/snippet}
|
||||||
|
|
||||||
|
<div class="border border-2 flex-1 grid grid-cols-5 h-1 min-h-fit">
|
||||||
|
{@render leftModule()}
|
||||||
|
{@render centerModule()}
|
||||||
|
{@render rightModule()}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="border border-2 min-h-24 h-24">
|
<div class="border border-2 min-h-24 h-24">
|
||||||
<div class="flex flex-row gap-2">
|
<div class="flex flex-row gap-2">
|
||||||
|
|
Loading…
Reference in a new issue