add mediasession metadata

AuthorKonata <konata@posteo.jp>
Date
Commit23305637704bc9e313e7a2c4f6dc980b987e41ea
Parent2d42d2c
1 file changed, 23 insertions(+), 3 deletions(-)
▾Mwebclient/src/App.tsx
@@ -1,19 +1,18 @@
import { createSignal, createEffect, onMount, on, createResource, batch } from "solid-js";
import type { Component } from "solid-js";
import type { PlaylistItem, PlayerState, AppOptions } from "./types";
import { type PlaylistItem, type PlayerState, type AppOptions, getItemName } from "./types";
import OptionsModal from "./components/OptionsModal";
import PlayerControls from "./components/PlayerControls";
import FileBrowser from "./components/FileBrowser";
import { ClosedFolderSVG, CogSVG, FullscreenSVG, OpenFolderSVG, PlaylistSVG } from "./components/SVG";
import { LocalStorageValues, toast } from "./utils";
import Playlist from "./components/Playlist";
import { getSrc, listFiles } from "./offline";
import { getCover, getSrc, listFiles } from "./offline";
import { MediaFormat } from "music-server-shared/types";
import PlaylistManager from "./components/PlaylistManager";
import { BUILD_HASH } from "./build-info";
import { createStore } from "solid-js/store";
//TODO: use more store
//TODO: show offline-only files in online mode as well
//TODO: add loading state to playercontrols
//TODO: search
@@ -92,6 +91,27 @@ const App: Component = () => {
}),
);
if ("mediaSession" in navigator) {
createEffect(async () => {
if (!playerState.currentTrack) {
navigator.mediaSession.metadata = new MediaMetadata();
return;
}
const oldSrc = navigator.mediaSession.metadata?.artwork[0]?.src ?? "";
if (oldSrc.startsWith("blob:")) URL.revokeObjectURL(oldSrc);
const artwork = await getCover(playerState.currentTrack.path.split("/").slice(0, -1).join("/"), isOffline());
console.log(artwork);
navigator.mediaSession.metadata = new MediaMetadata({
title: getItemName(playerState.currentTrack),
artwork: [
{
src: artwork ?? "",
},
],
});
});
}
let audioElement!: HTMLAudioElement;
function handlePlayerError(e: unknown) {