diff --git a/src/pages/constituent/blur/artwork-controller/_applet.astro b/src/pages/constituent/blur/artwork-controller/_applet.astro index 362118e..6fa85ab 100644 --- a/src/pages/constituent/blur/artwork-controller/_applet.astro +++ b/src/pages/constituent/blur/artwork-controller/_applet.astro @@ -170,10 +170,10 @@ import "@styles/diffuse/fonts.css"; .controller menu { align-items: center; display: flex; - font-size: var(--fs-md); + font-size: var(--fs-lg); gap: var(--space-lg); justify-content: center; - margin: var(--space-sm) 0; + margin: var(--space-md) 0; padding: 0; text-align: center; } @@ -185,7 +185,7 @@ import "@styles/diffuse/fonts.css"; .controller .ph-pause, .controller .ph-play { - font-size: var(--fs-lg); + font-size: var(--fs-xl); } /* Volume */ diff --git a/src/scripts/engine/queue/types.d.ts b/src/scripts/engine/queue/types.d.ts index 4795771..6038dc1 100644 --- a/src/scripts/engine/queue/types.d.ts +++ b/src/scripts/engine/queue/types.d.ts @@ -1,7 +1,11 @@ import type { Track } from "@applets/core/types"; +export type Item = Track & { + manualEntry?: boolean; +}; + export interface State { - past: Track[]; - now: Track | null; - future: Track[]; + past: Item[]; + now: Item | null; + future: Item[]; } diff --git a/src/scripts/engine/queue/worker.ts b/src/scripts/engine/queue/worker.ts index 6324dae..378f493 100644 --- a/src/scripts/engine/queue/worker.ts +++ b/src/scripts/engine/queue/worker.ts @@ -1,6 +1,6 @@ import type { Track } from "@applets/core/types.js"; -import type { State } from "./types"; -import { expose, transfer } from "@scripts/common.ts"; +import type { Item, State } from "./types"; +import { arrayShuffle, expose, transfer } from "@scripts/common.ts"; //////////////////////////////////////////// // STATE @@ -26,7 +26,7 @@ export type Actions = typeof actions; // Actions -function add(state: State, items: Track[]): State { +function add(state: State, items: Item[]): State { return transfer({ ...state, future: [...state.future, ...items] }); } @@ -67,15 +67,30 @@ function unshift(state: State): State { // 🛠️ -// TODO: Shuffle, limit track amount, etc. +// TODO: Most likely there's a more performant solution function fill(state: State): State { - return state.future.length < QUEUE_SIZE - ? add( - state, - internal.pool.slice( - state.past.length, - state.past.length + (QUEUE_SIZE - state.future.length), - ), - ) - : state; + if (state.future.length >= QUEUE_SIZE) return state; + + let reducedPool = internal.pool.reduce( + ({ past, pool }: { past: Set; pool: Track[] }, track: Track) => { + if (past.has(track.id)) + return { + past: past.difference(new Set(track.id)), + pool, + }; + + return { + past, + pool: [...pool, track], + }; + }, + { past: new Set(state.past.map((t) => t.id)), pool: [] }, + ).pool; + + if (reducedPool.length === 0) { + reducedPool = internal.pool; + } + + const poolSelection = arrayShuffle(reducedPool).slice(0, QUEUE_SIZE - state.future.length); + return add(state, poolSelection); }