diff --git a/src/lib/components/player/Queue.svelte b/src/lib/components/player/Queue.svelte index 594576c..a46a75a 100644 --- a/src/lib/components/player/Queue.svelte +++ b/src/lib/components/player/Queue.svelte @@ -1,5 +1,5 @@
{:else} - {#each player.displayQueue as track (track.id)} + {#each player.displayQueue as track, i (track.id)}
onDragStart(e, i)} + ondragover={(e) => onDragOver(e, i)} + ondrop={(e) => onDrop(e, i)} onclick={() => onJump(track)} onkeydown={(e) => e.key === "Enter" && onJump(track)} class="group flex items-center gap-2 px-3 py-2 rounded-md hover:bg-muted/50 transition-colors cursor-pointer text-sm" class:active={player.currentId === track.id} + class:border-t-2={dragOverIndex === i} + class:border-primary={dragOverIndex === i} >
+ +
+
{#if player.currentId === track.id}
{:else} - # -
diff --git a/src/lib/player/store.svelte.ts b/src/lib/player/store.svelte.ts index 4753650..007af1d 100644 --- a/src/lib/player/store.svelte.ts +++ b/src/lib/player/store.svelte.ts @@ -216,6 +216,28 @@ class PlayerStore { } } + move(fromIdx: number, toIdx: number) { + if (fromIdx === toIdx) return; + + if (this.isShuffled) { + const indices = [...this.shuffledIndices]; + if (fromIdx < 0 || fromIdx >= indices.length) return; + if (toIdx < 0 || toIdx >= indices.length) return; + + const [item] = indices.splice(fromIdx, 1); + indices.splice(toIdx, 0, item); + this.shuffledIndices = indices; + } else { + const q = [...this.queue]; + if (fromIdx < 0 || fromIdx >= q.length) return; + if (toIdx < 0 || toIdx >= q.length) return; + + const [item] = q.splice(fromIdx, 1); + q.splice(toIdx, 0, item); + this.queue = q; + } + } + // Playback Controls next() {