diff --git a/protos/player.proto b/protos/player.proto
index 087e54c..e86cd47 100644
--- a/protos/player.proto
+++ b/protos/player.proto
@@ -6,16 +6,20 @@ import 'library.proto';
package player;
service Player {
- rpc PlayTrack(PlayTrackRequest) returns (PlayTrackResponse);
+ rpc PlayTrack(TrackRequest) returns (PlayTrackResponse);
rpc ResumeTrack(google.protobuf.Empty) returns (PauseState);
rpc PauseTrack(google.protobuf.Empty) returns (PauseState);
rpc TogglePause(google.protobuf.Empty) returns (PauseState);
rpc GetStatus(google.protobuf.Empty) returns (stream PlayerStatus);
rpc SeekPosition(SeekPositionRequest) returns (SeekPositionResponse);
rpc SetVolume(SetVolumeRequest) returns (SetVolumeResponse);
+ rpc PlayTrackNext(TrackRequest) returns (Queue);
+ rpc AddTrackToQueue(TrackRequest) returns (Queue);
+ rpc SkipTrack(google.protobuf.Empty) returns (PlayerStatus);
+ rpc SkipToQueueIndex(SkipToQueueIndexRequest) returns (PlayerStatus);
}
-message PlayTrackRequest {
+message TrackRequest {
string hash = 1;
}
@@ -29,6 +33,11 @@ message PlayerStatus {
bool is_paused = 2;
float volume = 3;
uint64 progress = 4;
+ repeated library.Track queue = 5;
+}
+
+message Queue {
+ repeated library.Track tracks = 1;
}
message PauseState {
@@ -50,3 +59,7 @@ message SetVolumeRequest {
message SetVolumeResponse {
float volume = 1;
}
+
+message SkipToQueueIndexRequest {
+ uint32 index = 1;
+}
diff --git a/src/lib/components/groove/Footer.svelte b/src/lib/components/groove/Footer.svelte
index 643cae9..4abdaf0 100644
--- a/src/lib/components/groove/Footer.svelte
+++ b/src/lib/components/groove/Footer.svelte
@@ -55,14 +55,22 @@
console.log(`SKIP TO QUEUE INDEX ${index}`);
}
- const submitTogglePause: SubmitFunction = async () => {
+ const submitPlayerAction: SubmitFunction = async () => {
return async ({ update, result }) => {
await update({
invalidateAll: false
});
- if (result.type === 'success' && result.data && 'isPaused' in result.data) {
- player.isPaused = result.data.isPaused;
+ if (result.type !== 'success' || !result.data) {
+ return;
+ }
+
+ if ('isPaused' in result.data) {
+ if (!('volume' in result.data)) {
+ player.isPaused = result.data.isPaused;
+ } else {
+ player.applyStatus(result.data);
+ }
}
};
};
@@ -93,9 +101,9 @@
@@ -116,7 +124,7 @@
{#snippet child({ props })}
{/snippet}
@@ -125,34 +133,35 @@
-
- {#each [] as _track, i}
+
+
diff --git a/src/lib/components/groove/TrackListing.svelte b/src/lib/components/groove/TrackListing.svelte
index ebb3864..d60f9b3 100644
--- a/src/lib/components/groove/TrackListing.svelte
+++ b/src/lib/components/groove/TrackListing.svelte
@@ -2,11 +2,10 @@
import { enhance } from '$app/forms';
import { getCoverUrl } from '$lib/covers';
import { getPlayerState } from '$lib/player.svelte';
-
- // import { AudioLines } from 'lucide-svelte';
- import { AudioLines } from 'lucide-svelte';
+ import { AudioLines, Music2, ListMusic, ListEnd } from 'lucide-svelte';
import type { SubmitFunction } from '../../../routes/tracks/[hash]/$types';
import type { Track } from '$lib/proto/library';
+ import * as ContextMenu from '$lib/components/ui/context-menu';
interface Props {
track: Track;
@@ -14,21 +13,44 @@
let { track }: Props = $props();
+ let isOpen = $state(false);
+
const player = getPlayerState();
const submitPlayTrack: SubmitFunction = async () => {
return async ({ update, result }) => {
+ isOpen = false;
+
await update({
invalidateAll: false
});
- if (result.type === 'success' && result.data) {
+ if (result.type === 'success' && result.data && 'track' in result.data) {
+ player.queue = [];
player.currentlyPlaying = result.data.track ?? null;
player.progress = result.data.position;
player.isPaused = false;
}
};
};
+
+ const submitEnqueue: SubmitFunction = async () => {
+ return async ({ update, result }) => {
+ isOpen = false;
+
+ await update({
+ invalidateAll: false
+ });
+
+ if (result.type === 'success' && result.data && 'tracks' in result.data) {
+ player.queue = result.data.tracks;
+ }
+ };
+ };
+
+ function contextMenuItemClicked(e: MouseEvent) {
+ e.stopPropagation();
+ }
diff --git a/src/lib/player.svelte.ts b/src/lib/player.svelte.ts
index 27601a5..9f9013c 100644
--- a/src/lib/player.svelte.ts
+++ b/src/lib/player.svelte.ts
@@ -10,6 +10,7 @@ class PlayerState {
progress = $state(0n);
isPaused = $state(false);
adjustingVolume = $state(false);
+ queue = $state