NotS1mp/Musify
0
0
Fork 0
Code Issues 23 Pull Requests Actions Packages Projects Releases Wiki Activity

Merge master into web-player-general-changes
CI/CD / BackEnd (push) Canceled after 0s
Details
CI/CD / WebPlayer (push) Canceled after 0s
Details
CI/CD / BackEnd (pull_request) Successful in 1m23s
Details
CI/CD / WebPlayer (pull_request) Successful in 40s
Details
CI/CD / Deploy (pull_request) Skipped
Details
CI/CD / Deploy (push) Canceled after 0s
Details

Browse Source
This commit is contained in:
Admin
2026-09-24 00:32:03 +02:00
parent 430c711ff2 421fc929e8
commit 302dd1e0f8
57 changed files with 2584 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web-player/src/lib/api/schema.d.ts
Vendored
+168 -1
View File
@@ -177,6 +177,40 @@ export interface paths {
patch?: never;
trace?: never;
};
"/genres": {
parameters: {
query?: never;
header?: never;
path?: never;
cookie?: never;
};
/** Get The Genres That Have At Least One Track, Most Populated First. Works Anonymously. */
get: operations["GetGenres"];
put?: never;
post?: never;
delete?: never;
options?: never;
head?: never;
patch?: never;
trace?: never;
};
"/genres/available": {
parameters: {
query?: never;
header?: never;
path?: never;
cookie?: never;
};
/** Get Every Genre A Track Can Be Tagged With, Including The Genres It Cannot Be Combined With. Works Anonymously. */
get: operations["GetAvailableGenres"];
put?: never;
post?: never;
delete?: never;
options?: never;
head?: never;
patch?: never;
trace?: never;
};
"/likes": {
parameters: {
query?: never;
@@ -391,7 +425,7 @@ export interface paths {
path?: never;
cookie?: never;
};
/** Get Paginated Tracks, Optionally Filtered By Name. */
/** Get Paginated Tracks, Optionally Filtered By Name And Genre. */
get: operations["GetTracks"];
put?: never;
/** Create A New Track. */
@@ -453,6 +487,23 @@ export interface paths {
patch?: never;
trace?: never;
};
"/tracks/listens/{listenId}/progress": {
parameters: {
query?: never;
header?: never;
path?: never;
cookie?: never;
};
get?: never;
/** Report The Total Seconds Actually Played For A Listen Started By The Stream Endpoint. */
put: operations["RecordListeningProgress"];
post?: never;
delete?: never;
options?: never;
head?: never;
patch?: never;
trace?: never;
};
"/tracks/users/{userId}": {
parameters: {
query?: never;
@@ -730,6 +781,10 @@ export interface components {
hasPreviousPage: boolean;
hasNextPage: boolean;
};
AvailableGenreResponse: {
genre: components["schemas"]["Genre"];
incompatibleWith: components["schemas"]["Genre"][];
};
CreateAlbumRequest: {
title: string;
description: null | string;
@@ -764,6 +819,11 @@ export interface components {
};
/** @enum {unknown} */
Genre: "Pop" | "Rock" | "HipHop" | "RnB" | "Jazz" | "Blues" | "Classical" | "Electronic" | "House" | "Techno" | "Trance" | "Dubstep" | "DrumAndBass" | "Metal" | "Punk" | "Reggae" | "Reggaeton" | "Country" | "Folk" | "Indie" | "KPop" | "Latin" | "Soul" | "Funk" | "Ambient" | "Lofi";
GenreResponse: {
genre: components["schemas"]["Genre"];
/** Format: int32 */
trackCount: number | string;
};
HttpValidationProblemDetails: {
type?: null | string;
title?: null | string;
@@ -854,6 +914,19 @@ export interface components {
hasNextPage: boolean;
hasPreviousPage: boolean;
};
PaginatedResponseOfUserApplicationResponse: {
items: components["schemas"]["UserApplicationResponse"][];
/** Format: int32 */
pageNumber: number | string;
/** Format: int32 */
pageSize: number | string;
/** Format: int32 */
pageCount: number | string;
/** Format: int32 */
totalItemCount: number | string;
hasNextPage: boolean;
hasPreviousPage: boolean;
};
PlaybackPublicConfigResponse: {
allowAnonymousListening: boolean;
/** Format: int32 */
@@ -889,6 +962,10 @@ export interface components {
PlaylistVisibility: "Private" | "Public";
/** @enum {unknown} */
ProcessingStatus: "Pending" | "Processing" | "Completed" | "Failed";
RecordListeningProgressRequest: {
/** Format: double */
playedSeconds: number | string;
};
RequestAlbumPictureUploadRequest: {
fileType: string;
contentType: string;
@@ -954,6 +1031,8 @@ export interface components {
ticket: string;
/** Format: int32 */
expiresInSeconds: number | string;
/** Format: uuid */
listenId?: null | string;
};
TrackUploadUrlsResponse: {
/** Format: uuid */
@@ -1479,6 +1558,46 @@ export interface operations {
};
};
};
GetGenres: {
parameters: {
query?: never;
header?: never;
path?: never;
cookie?: never;
};
requestBody?: never;
responses: {
/** @description OK */
200: {
headers: {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["GenreResponse"][];
};
};
};
};
GetAvailableGenres: {
parameters: {
query?: never;
header?: never;
path?: never;
cookie?: never;
};
requestBody?: never;
responses: {
/** @description OK */
200: {
headers: {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["AvailableGenreResponse"][];
};
};
};
};
GetLikedTracks: {
parameters: {
query?: {
@@ -2013,6 +2132,7 @@ export interface operations {
parameters: {
query?: {
name?: string;
genre?: string;
pageNumber?: number | string;
pageSize?: number | string;
};
@@ -2031,6 +2151,15 @@ export interface operations {
"application/json": components["schemas"]["TracksSearchResponse"];
};
};
/** @description Bad Request */
400: {
headers: {
[name: string]: unknown;
};
content: {
"application/problem+json": components["schemas"]["HttpValidationProblemDetails"];
};
};
};
};
CreateTrack: {
@@ -2181,6 +2310,44 @@ export interface operations {
};
};
};
RecordListeningProgress: {
parameters: {
query?: never;
header?: never;
path: {
listenId: string;
};
cookie?: never;
};
requestBody: {
content: {
"application/json": components["schemas"]["RecordListeningProgressRequest"];
};
};
responses: {
/** @description No Content */
204: {
headers: {
[name: string]: unknown;
};
content?: never;
};
/** @description Unauthorized */
401: {
headers: {
[name: string]: unknown;
};
content?: never;
};
/** @description Not Found */
404: {
headers: {
[name: string]: unknown;
};
content?: never;
};
};
};
GetTracksByUserId: {
parameters: {
query?: {
web-player/src/lib/data/genres.ts
+73 -20
View File
@@ -1,22 +1,75 @@
export const GENRE_INFO: Record<string, { label: string; tagline: string }> = {
pop: { label: 'Pop', tagline: 'Éxitos que suenan en todas partes' },
rock: { label: 'Rock', tagline: 'Guitarras, actitud y ruido' },
reggaeton: { label: 'Reggaetón', tagline: 'El ritmo que no para' },
'lo-fi': { label: 'Lo-fi', tagline: 'Para concentrarte o relajarte' },
indie: { label: 'Indie', tagline: 'Voces fuera del radar' },
salsa: { label: 'Salsa', tagline: 'Para mover el cuerpo' },
'k-pop': { label: 'K-pop', tagline: 'Coreografías pegajosas' },
electrónica: { label: 'Electrónica', tagline: 'Beats para perderte' },
jazz: { label: 'Jazz', tagline: 'Improvisación y elegancia' },
baladas: { label: 'Baladas', tagline: 'Para sentir con calma' },
trap: { label: 'Trap', tagline: 'Autotune y bajos pesados' },
cumbia: { label: 'Cumbia', tagline: 'El sabor de siempre' },
'hip hop': { label: 'Hip hop', tagline: 'Rimas con actitud' },
'música clásica': { label: 'Clásica', tagline: 'Siglos de composición' }
const GENRE_INFO: Record<string, { label: string; tagline: string }> = {
Pop: { label: 'Pop', tagline: 'Éxitos que suenan en todas partes' },
Rock: { label: 'Rock', tagline: 'Guitarras, actitud y ruido' },
HipHop: { label: 'Hip hop', tagline: 'Rimas con actitud' },
RnB: { label: 'R&B', tagline: 'Ritmo suave y voces con alma' },
Jazz: { label: 'Jazz', tagline: 'Improvisación y elegancia' },
Blues: { label: 'Blues', tagline: 'Sentimiento en cada nota' },
Classical: { label: 'Clásica', tagline: 'Siglos de composición' },
Electronic: { label: 'Electrónica', tagline: 'Beats para perderte' },
House: { label: 'House', tagline: 'Pista de baile sin fin' },
Techno: { label: 'Techno', tagline: 'Pulso hipnótico' },
Trance: { label: 'Trance', tagline: 'Melodías que te elevan' },
Dubstep: { label: 'Dubstep', tagline: 'Bajos que hacen temblar' },
DrumAndBass: { label: 'Drum and bass', tagline: 'Velocidad y graves' },
Metal: { label: 'Metal', tagline: 'Riffs pesados' },
Punk: { label: 'Punk', tagline: 'Rápido, crudo y directo' },
Reggae: { label: 'Reggae', tagline: 'Buenas vibraciones' },
Reggaeton: { label: 'Reggaetón', tagline: 'El ritmo que no para' },
Country: { label: 'Country', tagline: 'Historias con guitarra' },
Folk: { label: 'Folk', tagline: 'Raíces y acústico' },
Indie: { label: 'Indie', tagline: 'Voces fuera del radar' },
KPop: { label: 'K-pop', tagline: 'Coreografías pegajosas' },
Latin: { label: 'Latina', tagline: 'Sabor y ritmo' },
Soul: { label: 'Soul', tagline: 'Emoción en estado puro' },
Funk: { label: 'Funk', tagline: 'Groove imposible de quedarse quieto' },
Ambient: { label: 'Ambient', tagline: 'Paisajes sonoros' },
Lofi: { label: 'Lo-fi', tagline: 'Para concentrarte o relajarte' }
};
export const genreTiles = Object.entries(GENRE_INFO).map(([query, info], i, all) => ({
query,
hue: Math.round((i * 360) / all.length),
...info
}));
const KNOWN_GENRES = Object.keys(GENRE_INFO);
function humanize(name: string): string {
return name.replace(/([a-z])([A-Z])/g, '$1 $2');
}
export function genreInfo(genre: string) {
return GENRE_INFO[genre] ?? { label: humanize(genre), tagline: '' };
}
export function genreHue(genre: string): number {
const known = KNOWN_GENRES.indexOf(genre);
if (known >= 0) return Math.round((known * 360) / KNOWN_GENRES.length);
let hash = 0;
for (const char of genre) hash = (hash * 31 + char.charCodeAt(0)) % 360;
return hash;
}
export function genreTiles(genres: { genre: string }[]) {
return genres.map(({ genre }) => ({
genre,
hue: genreHue(genre),
...genreInfo(genre)
}));
}
export function genreOptions(genres: { genre: string; incompatibleWith: string[] }[]) {
return genres.map(({ genre, incompatibleWith }) => ({
genre,
incompatibleWith,
label: genreInfo(genre).label
}));
}
export function findConflict(
tags: string[],
options: { genre: string; incompatibleWith: string[] }[]
): [string, string] | undefined {
const byGenre = new Map(options.map((option) => [option.genre, option.incompatibleWith]));
for (let i = 0; i < tags.length; i++) {
for (let j = i + 1; j < tags.length; j++) {
if (byGenre.get(tags[i])?.includes(tags[j])) return [tags[i], tags[j]];
}
}
return undefined;
}
web-player/src/lib/data/trackGenres.ts
-56
View File
@@ -1,56 +0,0 @@
export const TRACK_GENRES = [
{ value: 'Pop', label: 'Pop' },
{ value: 'Rock', label: 'Rock' },
{ value: 'HipHop', label: 'Hip-hop' },
{ value: 'RnB', label: 'R&B' },
{ value: 'Jazz', label: 'Jazz' },
{ value: 'Blues', label: 'Blues' },
{ value: 'Classical', label: 'Clásica' },
{ value: 'Electronic', label: 'Electrónica' },
{ value: 'House', label: 'House' },
{ value: 'Techno', label: 'Techno' },
{ value: 'Trance', label: 'Trance' },
{ value: 'Dubstep', label: 'Dubstep' },
{ value: 'DrumAndBass', label: 'Drum and bass' },
{ value: 'Metal', label: 'Metal' },
{ value: 'Punk', label: 'Punk' },
{ value: 'Reggae', label: 'Reggae' },
{ value: 'Reggaeton', label: 'Reggaetón' },
{ value: 'Country', label: 'Country' },
{ value: 'Folk', label: 'Folk' },
{ value: 'Indie', label: 'Indie' },
{ value: 'KPop', label: 'K-pop' },
{ value: 'Latin', label: 'Latina' },
{ value: 'Soul', label: 'Soul' },
{ value: 'Funk', label: 'Funk' },
{ value: 'Ambient', label: 'Ambient' },
{ value: 'Lofi', label: 'Lo-fi' }
] as const;
export type TrackGenre = (typeof TRACK_GENRES)[number]['value'];
const GENRE_VALUES: ReadonlySet<string> = new Set(TRACK_GENRES.map((genre) => genre.value));
const INTENSE: ReadonlySet<TrackGenre> = new Set(['Metal', 'Punk', 'Dubstep', 'DrumAndBass']);
const MELLOW: ReadonlySet<TrackGenre> = new Set(['Classical', 'Ambient', 'Lofi']);
export function isTrackGenre(value: string): value is TrackGenre {
return GENRE_VALUES.has(value);
}
export function areCompatible(a: TrackGenre, b: TrackGenre): boolean {
return !((INTENSE.has(a) && MELLOW.has(b)) || (INTENSE.has(b) && MELLOW.has(a)));
}
export function genreLabel(value: TrackGenre): string {
return TRACK_GENRES.find((genre) => genre.value === value)?.label ?? value;
}
export function findConflict(tags: readonly TrackGenre[]): [TrackGenre, TrackGenre] | undefined {
for (let i = 0; i < tags.length; i++) {
for (let j = i + 1; j < tags.length; j++) {
if (!areCompatible(tags[i], tags[j])) return [tags[i], tags[j]];
}
}
return undefined;
}
web-player/src/lib/player/listenTracker.ts
+52
View File
@@ -0,0 +1,52 @@
const MAX_TICK_GAP_SECONDS = 2.5;
const FLUSH_EVERY_SECONDS = 30;
export class ListenTracker {
#listenId: string | null = null;
#played = 0;
#sent = 0;
#lastTime: number | null = null;
#lastFlushAt = 0;
begin(listenId: string | null | undefined) {
this.flush();
this.#listenId = listenId ?? null;
this.#played = 0;
this.#sent = 0;
this.#lastTime = null;
this.#lastFlushAt = Date.now();
}
resync(currentTime: number) {
this.#lastTime = currentTime;
}
interrupt() {
this.#lastTime = null;
}
tick(currentTime: number) {
if (this.#listenId === null) return;
const last = this.#lastTime;
this.#lastTime = currentTime;
if (last === null) return;
const delta = currentTime - last;
if (delta > 0 && delta <= MAX_TICK_GAP_SECONDS) this.#played += delta;
if (Date.now() - this.#lastFlushAt >= FLUSH_EVERY_SECONDS * 1000) this.flush();
}
flush() {
const id = this.#listenId;
if (id === null || this.#played <= this.#sent) return;
this.#sent = this.#played;
this.#lastFlushAt = Date.now();
fetch(`/api/listens/${id}/progress`, {
method: 'PUT',
headers: { 'content-type': 'application/json' },
body: JSON.stringify({ playedSeconds: this.#played }),
keepalive: true
}).catch(() => {
this.#sent = 0;
});
}
}
web-player/src/lib/player/player.svelte.ts
+37 -4
View File
@@ -3,6 +3,7 @@ import { DEFAULT_ACCENT } from '$lib/theme/color';
import { extractAccent, type Accent } from '$lib/theme/palette';
import { shuffle } from '$lib/data/collections';
import { dialog } from '$lib/state/dialog.svelte';
import { ListenTracker } from './listenTracker';
export interface PlayerTrack {
id: string | number;
@@ -132,6 +133,7 @@ class PlayerState {
#loadToken = 0;
#accentCache = new Map<string, Accent>();
#rafId: number | null = null;
#listen = new ListenTracker();
current = $derived(this.tracks.find((t) => t.id === this.currentId) ?? EMPTY);
accent = $derived(this.accentColor ?? DEFAULT_ACCENT);
@@ -152,19 +154,30 @@ class PlayerState {
audio.muted = this.muted;
audio.addEventListener('durationchange', () => this.#syncDuration(audio.duration));
audio.addEventListener('loadedmetadata', () => this.#syncDuration(audio.duration));
audio.addEventListener('timeupdate', () => {
if (!audio.paused) this.#listen.tick(audio.currentTime);
});
audio.addEventListener('seeking', () => this.#listen.interrupt());
audio.addEventListener('seeked', () => this.#listen.resync(audio.currentTime));
audio.addEventListener('play', () => {
this.#listen.resync(audio.currentTime);
this.playing = true;
this.#startProgressLoop();
this.#syncMediaSessionPlaybackState();
});
audio.addEventListener('pause', () => {
this.#listen.interrupt();
this.#listen.flush();
this.playing = false;
this.#stopProgressLoop();
this.#syncMediaSessionPlaybackState();
});
audio.addEventListener('ended', () => {
this.#stopProgressLoop();
this.#listen.tick(audio.currentTime);
this.#listen.begin(null);
if (this.repeat) {
this.#beginRepeatListen();
audio.currentTime = 0;
audio.play().catch(() => {});
return;
@@ -178,6 +191,10 @@ class PlayerState {
this.#fail();
});
this.#audio = audio;
document.addEventListener('visibilitychange', () => {
if (document.visibilityState === 'hidden') this.#listen.flush();
});
window.addEventListener('pagehide', () => this.#listen.flush());
this.#setupMediaSession(audio);
return audio;
}
@@ -277,14 +294,16 @@ class PlayerState {
const track = this.tracks.find((t) => t.id === id);
this.#applyAccent(id);
if (track) this.#syncMediaSessionMetadata(track);
this.#listen.begin(null);
const token = ++this.#loadToken;
this.loading = true;
this.progress = 0;
try {
const src = await this.#resolveLocalSrc(String(id));
const { src, listenId } = await this.#resolveLocalSrc(String(id));
if (token !== this.#loadToken) return;
audio.src = src;
audio.volume = this.volume / 100;
this.#listen.begin(listenId);
await audio.play();
this.loading = false;
this.#pushRecent(this.current);
@@ -310,14 +329,28 @@ class PlayerState {
);
}
async #resolveLocalSrc(id: string): Promise<string> {
async #resolveLocalSrc(id: string): Promise<{ src: string; listenId: string | null }> {
const res = await fetch(`/api/tracks/${id}/stream`);
if (!res.ok) throw new Error(await readErrorMessage(res));
const { manifestUrl, ticket } = (await res.json()) as {
const { manifestUrl, ticket, listenId } = (await res.json()) as {
manifestUrl: string;
ticket: string;
listenId?: string | null;
};
return this.#withTicket(manifestUrl, ticket);
return { src: this.#withTicket(manifestUrl, ticket), listenId: listenId ?? null };
}
async #beginRepeatListen() {
const id = this.currentId;
if (id === null) return;
try {
const res = await fetch(`/api/tracks/${id}/stream`);
if (!res.ok) return;
const { listenId } = (await res.json()) as { listenId?: string | null };
if (this.currentId === id) this.#listen.begin(listenId ?? null);
} catch {
return;
}
}
#withTicket(url: string, ticket: string): string {
web-player/src/lib/state/navigation.svelte.ts
+4
View File
@@ -88,6 +88,10 @@ export function searchHref(query: string): string {
return query ? `/explore?q=${encodeURIComponent(query)}` : '/explore';
}
export function genreHref(genre: string): string {
return `/explore?genre=${encodeURIComponent(genre)}`;
}
export interface AppNavLink {
href: string;
label: string;