dusk/musikspider
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: dont copy scheme in share

Browse Source
This commit is contained in:
dusk 2023-05-09 17:32:21 +03:00
parent 9a0d05df94
commit 54ddf32e21
Signed by: dusk
GPG Key ID: 1D8F8FAF2294D6EA
16 changed files with 397 additions and 382 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
postcss.config.js
View File

@ -1,6 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
autoprefixer: {}
}
};

2
src/app.html
View File

@ -1,6 +1,5 @@
<!DOCTYPE html>
<html class="dark" lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
@ -11,5 +10,4 @@
<body data-sveltekit-preload-data="hover" data-theme="crimson">
<div style="display: contents" class="h-full overflow-hidden">%sveltekit.body%</div>
</body>
</html>

9
src/app.postcss
View File

@ -1,2 +1,7 @@
html, body { @apply h-full overflow-hidden; }
.card { @apply shadow shadow-black; }
html,
body {
@apply h-full overflow-hidden;
}
.card {
@apply shadow shadow-black;
}

40
src/comms.ts
View File

@ -1,11 +1,11 @@
import { dev } from '$app/environment';
import type { TrackWithId } from "./types";
import type { TrackWithId } from './types';
const API_VERSION: number = 20;
const HTTP_DISABLED_ERROR: string =
"server does not have HTTP resources enabled, you will not be able to stream music";
const SERVER_API_INCOMPATIBLE_ERROR: (serverApi: number) => string =
(serverApi) => `server API version (${serverApi}) is different from our supported version (${API_VERSION})`;
'server does not have HTTP resources enabled, you will not be able to stream music';
const SERVER_API_INCOMPATIBLE_ERROR: (serverApi: number) => string = (serverApi) =>
`server API version (${serverApi}) is different from our supported version (${API_VERSION})`;
interface Message {
name: string;
@ -13,7 +13,7 @@ interface Message {
device_id: string;
type: MessageType;
options: any;
};
}
type MessageType = 'request' | 'response' | 'broadcast';
type RequestCallback = (arg0: Message | null) => void;
@ -38,7 +38,7 @@ export class MetadataCommunicator {
this.eventCallbacks = {
onDisconnect: () => {},
onConnect: () => {},
onIncompatible: () => { },
onIncompatible: () => {}
};
this.onConnectCallbacks = [];
this.ws = null;
@ -51,11 +51,11 @@ export class MetadataCommunicator {
connect(address: string, password: string) {
this.close();
const scheme = dev ? "ws" : "wss";
const scheme = dev ? 'ws' : 'wss';
this.ws = new WebSocket(`${scheme}://${address}`);
this.ws.addEventListener('open', (event) => {
this.makeRequest("authenticate", 'request', { password }, (msg) => {
this.makeRequest('authenticate', 'request', { password }, (msg) => {
if (msg!.options.authenticated) {
this.authenticated = true;
this.eventCallbacks.onConnect(msg!);
@ -90,7 +90,7 @@ export class MetadataCommunicator {
const options = { count_only: true };
const th = this;
return new Promise(function (resolve, reject) {
th.makeRequest("query_tracks", "request", options, (resp) => {
th.makeRequest('query_tracks', 'request', options, (resp) => {
if (resp) {
resolve(resp.options.count);
} else {
@ -106,10 +106,11 @@ export class MetadataCommunicator {
const th = this;
return new Promise(function (resolve, reject) {
th.makeRequest("query_tracks", "request", options, (resp) => {
th.makeRequest('query_tracks', 'request', options, (resp) => {
if (resp) {
const data: any[] = resp.options.data;
resolve(data.map((t) => ({
resolve(
data.map((t) => ({
id: t.external_id,
track: {
id: t.id,
@ -119,9 +120,10 @@ export class MetadataCommunicator {
album_id: t.album_id,
artist_name: t.artist,
artist_id: t.artist_id,
thumbnail_id: t.thumbnail_id,
thumbnail_id: t.thumbnail_id
}
})));
}))
);
} else {
reject(null);
}
@ -131,7 +133,7 @@ export class MetadataCommunicator {
private makeRequest(name: string, type: MessageType, options: object, callback: RequestCallback) {
// return if not authenticated, allow authentication messages
if (this.isClosed() || !this.authenticated && name != "authenticate") {
if (this.isClosed() || (!this.authenticated && name != 'authenticate')) {
callback(null);
return;
}
@ -143,9 +145,9 @@ export class MetadataCommunicator {
type,
options,
device_id: this.deviceId,
id,
id
});
console.trace("sending metadata message: " + payload);
console.trace('sending metadata message: ' + payload);
this.ws!.send(payload);
}
@ -158,9 +160,9 @@ export class MetadataCommunicator {
isClosed() {
return (
this.ws === null
|| this.ws.readyState === WebSocket.CLOSED
|| this.ws.readyState === WebSocket.CLOSING
this.ws === null ||
this.ws.readyState === WebSocket.CLOSED ||
this.ws.readyState === WebSocket.CLOSING
);
}

5
src/components/track.svelte
View File

@ -4,14 +4,13 @@
makeThumbnailUrl,
currentTrack,
setQueuePositionTo,
makeGenScopedTokenUrl,
makeShareUrl
makeGenScopedTokenUrl
} from '../stores';
import Spinnny from '~icons/line-md/loading-loop';
import IconPlay from '~icons/mdi/play';
import IconMusic from '~icons/mdi/music';
import { toastStore } from '@skeletonlabs/skeleton';
import { getAudioElement } from '../utils';
import { getAudioElement, makeShareUrl } from '../utils';
export let track_with_id: TrackWithId;
let track = track_with_id.track;

2
src/routes/(app)/+layout.ts
View File

@ -1,4 +1,4 @@
import { MetadataCommunicator } from "../../comms";
import { MetadataCommunicator } from '../../comms';
export const _metadataComm = new MetadataCommunicator();
export const ssr = false;

8
src/routes/share/[token]/+page.server.ts
View File

@ -3,9 +3,9 @@ import { LOCAL_MUSIKQUAD_SERVER } from '$env/static/private';
import { scheme } from '../../../utils';
interface MusicInfo {
title: string,
album: string,
artist: string,
title: string;
album: string;
artist: string;
}
export async function load({ params }) {
@ -14,6 +14,6 @@ export async function load({ params }) {
return {
info,
thumbnail_url: `${scheme}://${PUBLIC_MUSIKQUAD_SERVER}/share/thumbnail/${params.token}`,
audio_url: `${scheme}://${PUBLIC_MUSIKQUAD_SERVER}/share/audio/${params.token}`,
audio_url: `${scheme}://${PUBLIC_MUSIKQUAD_SERVER}/share/audio/${params.token}`
};
}

31
src/stores.ts
View File

@ -1,17 +1,17 @@
import { get, writable } from 'svelte/store';
import { type Track, type TrackId, type TrackWithId, LoopKind } from './types';
import { PUBLIC_BASEURL, PUBLIC_MUSIKQUAD_SERVER } from '$env/static/public';
import { PUBLIC_MUSIKQUAD_SERVER } from '$env/static/public';
import { scheme } from './utils';
function writableStorage(key: string, defaultValue: string) {
const store = writable(localStorage.getItem(key) ?? defaultValue);
store.subscribe(value => localStorage.setItem(key, value));
store.subscribe((value) => localStorage.setItem(key, value));
return store;
}
export const address = writableStorage("address", PUBLIC_MUSIKQUAD_SERVER);
export const token = writableStorage("token", "");
export const address = writableStorage('address', PUBLIC_MUSIKQUAD_SERVER);
export const token = writableStorage('token', '');
export function makeThumbnailUrl(id: number) {
if (id === 0) {
@ -28,13 +28,13 @@ export function makeGenScopedTokenUrl(id: TrackId) {
return `${scheme}://${get(address)}/share/generate/${id}?token=${get(token)}`;
}
export function makeShareUrl(token: string) {
return `${scheme}://${PUBLIC_BASEURL}/share/${token}`;
}
export const currentTrack = writable<TrackWithId | null>(null);
export function getCurrentTrack(tracks: Map<TrackId, Track>, queue: TrackId[], position: number | null): TrackWithId | null {
export function getCurrentTrack(
tracks: Map<TrackId, Track>,
queue: TrackId[],
position: number | null
): TrackWithId | null {
if (position === null) {
return null;
}
@ -48,7 +48,7 @@ export function getCurrentTrack(tracks: Map<TrackId, Track>, queue: TrackId[], p
}
return {
track,
id,
id
};
}
@ -58,7 +58,9 @@ export const tracks = writable<Map<TrackId, Track>>(new Map());
export const tracksSorted = writable<TrackId[]>([]);
queuePosition.subscribe((pos) => currentTrack.set(getCurrentTrack(get(tracks), get(queue), pos)));
tracks.subscribe((newTracks) => currentTrack.set(getCurrentTrack(newTracks, get(queue), get(queuePosition))));
tracks.subscribe((newTracks) =>
currentTrack.set(getCurrentTrack(newTracks, get(queue), get(queuePosition)))
);
export function setQueuePositionTo(track_id: TrackId) {
let q = get(queue);
@ -78,7 +80,8 @@ export function getPrevQueuePosition(respectLoop: boolean) {
const q = get(queue);
const l = get(loop);
const _newPos = pos - 1;
const newPos = _newPos > -1 ? _newPos : l === LoopKind.Once || !respectLoop ? q.length - 1 : null;
const newPos =
_newPos > -1 ? _newPos : l === LoopKind.Once || !respectLoop ? q.length - 1 : null;
return newPos;
}
return null;
@ -123,7 +126,7 @@ export function changeLoop() {
}
}
export const searchText = writable<string>("");
export const searchText = writable<string>('');
export function search(q: string) {
const query = q.trim();
@ -131,7 +134,7 @@ export function search(q: string) {
if (query.length === 0) {
let result: TrackId[] = [];
t.forEach((_, id) => (result.push(id)));
t.forEach((_, id) => result.push(id));
tracksSorted.set(result);
return;
}

28
src/types.ts
View File

@ -2,32 +2,32 @@ export type ResourceId = bigint;
export type TrackId = string;
export interface Track {
id: number,
title: string,
track_num: number,
album_title: string,
album_id: ResourceId,
artist_name: string,
artist_id: ResourceId,
thumbnail_id: number,
id: number;
title: string;
track_num: number;
album_title: string;
album_id: ResourceId;
artist_name: string;
artist_id: ResourceId;
thumbnail_id: number;
}
export interface TrackWithId {
id: TrackId,
track: Track,
id: TrackId;
track: Track;
}
export interface Artist {
name: string,
name: string;
}
export interface Album {
title: string,
artist_id: ResourceId,
title: string;
artist_id: ResourceId;
}
export enum LoopKind {
Off,
Once,
Always,
Always
}

27
src/utils.ts
View File

@ -1,6 +1,11 @@
import { dev } from '$app/environment';
import { PUBLIC_BASEURL } from '$env/static/public';
export const scheme = dev ? "http" : "https";
export const scheme = dev ? 'http' : 'https';
export function makeShareUrl(token: string) {
return `${PUBLIC_BASEURL}/share/${token}`;
}
export function getAudioElement() {
const elem = document.getElementById('audio-source');
@ -21,22 +26,30 @@ export function calculateMinuteSecond(seconds: number) {
return `${minutesFormatted}:${secondsFormatted}`;
}
export function interceptKeys(extraActions: [string, () => void][] = []): (event: KeyboardEvent) => void {
export function interceptKeys(
extraActions: [string, () => void][] = []
): (event: KeyboardEvent) => void {
return (event) => {
const tagName = document.activeElement?.tagName ?? '';
const audio = getAudioElement();
const actions = new Map([
...extraActions,
['Space', () => {
[
'Space',
() => {
if (audio !== null) {
audio.paused ? audio.play() : audio.pause();
}
}],
['KeyM', () => {
}
],
[
'KeyM',
() => {
if (audio !== null) {
audio.muted = !audio.muted;
}
}],
}
],
[
'ArrowLeft',
() => {
@ -63,5 +76,5 @@ export function interceptKeys(extraActions: [string, () => void][] = []): (event
action();
}
}
}
};
}

15
tailwind.config.js
View File

@ -2,16 +2,11 @@
export default {
content: [
'./src/**/*.{html,js,svelte,ts}',
require('path').join(require.resolve(
'@skeletonlabs/skeleton'),
'../**/*.{html,js,svelte,ts}'
),
require('path').join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}')
],
theme: {
extend: {},
extend: {}
},
plugins: [
...require('@skeletonlabs/skeleton/tailwind/skeleton.cjs')()
],
darkMode: 'class',
}
plugins: [...require('@skeletonlabs/skeleton/tailwind/skeleton.cjs')()],
darkMode: 'class'
};

4
vite.config.ts
View File

@ -1,12 +1,12 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import Icons from 'unplugin-icons/vite'
import Icons from 'unplugin-icons/vite';
export default defineConfig({
plugins: [
sveltekit(),
Icons({
compiler: 'svelte',
compiler: 'svelte'
})
]
});