Skip to content

Now Playing Art

Port for publishing now-playing artwork and metadata to OS-native UI surfaces (lock screen, notification panel, AirPlay, cast receiver), the INowPlayingArt contract. The player calls publish(item, artwork) on each track change and clear() on stop or dispose.

TypeScript
import type { INowPlayingArt } from '@nomercy-entertainment/nomercy-music-player/adapters/now-playing-art';

Interface

TypeScript
interface INowPlayingArt<T extends BasePlaylistItem = BasePlaylistItem> {
  readonly id: string;
  publish(item: T, artwork: string | undefined): Promise<void>;
  clear(): void;
}

publish(item, artwork)

Publish now-playing metadata and artwork for item. artwork is the resolved artwork URL, or undefined when no art is available. Called by the player when the current track changes.

clear()

Clear the now-playing metadata. Called when the player stops or is disposed. Implementations that do not support clearing may no-op.

Built-in adapter

MediaSessionArtProvider

TypeScript
import { MediaSessionArtProvider } from '@nomercy-entertainment/nomercy-music-player/adapters/now-playing-art';

Uses the browser Media Session API (navigator.mediaSession.metadata) to push artwork and track metadata to lock screens, notification panels, and browser media controls.

MediaSessionArtProvider is a standalone built-in implementation of the INowPlayingArt port. It is not auto-wired by MediaSessionPlugin — that plugin does its own Media Session metadata and artwork push. Wire this adapter yourself only if you want to use it directly.

Custom implementation

For native-shell scenarios (Capacitor, Electron) or custom cast receiver artwork feeds:

TypeScript
import type { INowPlayingArt } from '@nomercy-entertainment/nomercy-music-player/adapters/now-playing-art';
import type { MusicPlaylistItem } from '@nomercy-entertainment/nomercy-music-player';

class CapacitorNowPlayingArt implements INowPlayingArt<MusicPlaylistItem> {
  readonly id = 'capacitor-now-playing';

  async publish(item: MusicPlaylistItem, artwork: string | undefined): Promise<void> {
    await NativeAudio.setNowPlaying({
      title: item.name,
      artist: item.artist ?? '',
      artwork: artwork ?? '',
    });
  }

  clear(): void {
    void NativeAudio.clearNowPlaying();
  }
}

See also

  • MediaSessionPlugin: does its own Media Session metadata/artwork push (this adapter is a standalone alternative, not used internally)
  • MusicPlaylistItem: cover, name, artist fields