Media session improved

package.json

@@ -48,7 +48,6 @@
     "lodash-es": "^4.17.21",
     "m3ujs": "^0.2.1",
     "mime-types": "^2.1.34",
-    "mpris-service": "2.1.0",
     "music-metadata": "^7.11.4",
     "postcss-scss": "^4.0.2",
     "postcss-url": "^10.1.3",

src/main/main.ts

@@ -8,9 +8,7 @@ import ConfigModule from './modules/config';
 import PowerModule from './modules/power-monitor';
 import ThumbarModule from './modules/thumbar';
 import DockMenuModule from './modules/dock-menu-darwin';
-import GlobalShortcutsModule from './modules/global-shortcuts';
 import SleepBlockerModule from './modules/sleep-blocker';
-import MprisModule from './modules/mpris';
 import DialogsModule from './modules/dialogs';
 import NativeThemeModule from './modules/native-theme';
 import DevtoolsModule from './modules/devtools';
@@ -84,9 +82,7 @@ app.on('ready', async () => {
     new TrayModule(mainWindow),
     new ThumbarModule(mainWindow),
     new DockMenuModule(mainWindow),
-    new GlobalShortcutsModule(mainWindow),
     new SleepBlockerModule(mainWindow),
-    new MprisModule(mainWindow),
     new DialogsModule(mainWindow),
     new NativeThemeModule(mainWindow, configModule),
     new DevtoolsModule(mainWindow)

src/renderer/lib/player.ts

@@ -1,4 +1,3 @@
-import { fetchCover } from '../../shared/lib/utils-cover';
 import { Track } from '../../shared/types/museeks';
 import * as utils from '../lib/utils';
 
@@ -17,6 +16,7 @@ interface PlayerOptions {
 class Player {
   private audio: HTMLAudioElement;
   private durationThresholdReached: boolean;
+  private track: Track | null;
   public threshold: number;
 
   constructor(options?: PlayerOptions) {
@@ -29,6 +29,7 @@ class Player {
     };
 
     this.audio = new Audio();
+    this.track = null;
 
     this.audio.defaultPlaybackRate = mergedOptions.playbackRate;
     // eslint-disable-next-line
@@ -91,25 +92,16 @@ class Player {
     await this.audio.setSinkId(deviceId);
   }
 
-  getSrc() {
-    return this.audio.src;
+  getTrack() {
+    return this.track;
   }
 
-  setSrc(track: Track) {
-    // When we change song, need to update the thresholdReached indicator.
-    this.durationThresholdReached = false;
+  setTrack(track: Track) {
+    this.track = track;
     this.audio.src = utils.parseUri(track.path);
 
-    setTimeout(async () => {
-      const cover = await fetchCover(track.path);
-
-      navigator.mediaSession.metadata = new MediaMetadata({
-        title: track.title,
-        artist: track.artist.join(', '),
-        album: track.album,
-        artwork: cover ? [{ src: cover }] : undefined,
-      });
-    }, 0);
+    // When we change song, need to update the thresholdReached indicator.
+    this.durationThresholdReached = false;
   }
 
   setCurrentTime(currentTime: number) {

src/renderer/store/actions/AppActions.ts

@@ -1,9 +1,7 @@
-import os from 'os';
 import electron from 'electron';
 
 import Player from '../../lib/player';
 import { browserWindows, config } from '../../lib/app';
-import * as utils from '../../lib/utils';
 import history from '../../lib/history';
 import * as coverUtils from '../../../shared/lib/utils-cover';
 import channels from '../../../shared/lib/ipc-channels';
@@ -50,7 +48,8 @@ const init = async (): Promise<void> => {
   Player.getAudio().addEventListener('error', PlayerActions.audioError);
   Player.getAudio().addEventListener('timeupdate', async () => {
     if (Player.isThresholdReached()) {
-      await LibraryActions.incrementPlayCount(Player.getSrc());
+      const track = Player.getTrack();
+      if (track) await LibraryActions.incrementPlayCount(track.path);
     }
   });
 
@@ -59,18 +58,9 @@ const init = async (): Promise<void> => {
   Player.getAudio().addEventListener('play', async () => {
     ipcRenderer.send(channels.PLAYBACK_PLAY);
 
-    // HACK, on win32, a prefix slash is weirdly added
-    let trackPath = Player.getSrc();
+    const track = Player.getTrack();
 
-    if (os.platform() === 'win32') {
-      trackPath = trackPath.replace('file:///', '');
-    } else {
-      trackPath = trackPath.replace('file://', '');
-    }
-
-    trackPath = decodeURIComponent(trackPath);
-
-    const track = await utils.getMetadata(trackPath);
+    if (!track) return;
 
     ipcRenderer.send(channels.PLAYBACK_TRACK_CHANGE, track);
 
@@ -88,6 +78,47 @@ const init = async (): Promise<void> => {
     ipcRenderer.send(channels.PLAYBACK_PAUSE);
   });
 
+  // Support MediaSession (mpris, macOS player controls etc)...
+  // Media Session support
+  Player.getAudio().addEventListener('loadstart', async () => {
+    const track = Player.getTrack();
+    if (track) {
+      const cover = await coverUtils.fetchCover(track.path, false, true);
+
+      navigator.mediaSession.metadata = new MediaMetadata({
+        title: track.title,
+        artist: track.artist.join(', '),
+        album: track.album,
+        artwork: cover ? [{ src: cover }] : undefined,
+      });
+    }
+  });
+
+  Player.getAudio().addEventListener('play', async () => {
+    navigator.mediaSession.playbackState = 'playing';
+  });
+
+  Player.getAudio().addEventListener('pause', async () => {
+    navigator.mediaSession.playbackState = 'paused';
+  });
+
+  navigator.mediaSession.setActionHandler('play', async () => {
+    PlayerActions.play();
+  });
+
+  navigator.mediaSession.setActionHandler('pause', async () => {
+    PlayerActions.pause();
+  });
+
+  navigator.mediaSession.setActionHandler('previoustrack', async () => {
+    PlayerActions.previous();
+  });
+
+  navigator.mediaSession.setActionHandler('nexttrack', async () => {
+    PlayerActions.next();
+  });
+
+  // Support for multiple audio output
   navigator.mediaDevices.addEventListener('devicechange', async () => {
     try {
       await Player.setOutputDevice('default');
@@ -98,7 +129,7 @@ const init = async (): Promise<void> => {
 
   // Listen for main-process events
   ipcRenderer.on(channels.PLAYBACK_PLAY, () => {
-    if (Player.getSrc()) {
+    if (Player.getTrack()) {
       PlayerActions.play();
     } else {
       PlayerActions.start();

src/renderer/store/actions/PlayerActions.ts

@@ -87,7 +87,7 @@ export const start = async (queue?: TrackModel[], _id?: string): Promise<void> =
   if (queuePosition > -1) {
     const track = newQueue[queuePosition];
 
-    Player.setSrc(track);
+    Player.setTrack(track);
     await Player.play();
 
     let queueCursor = queuePosition; // Clean that variable mess later
@@ -173,7 +173,7 @@ export const next = async (): Promise<void> => {
 
     // tslint:disable-next-line strict-type-predicates
     if (track !== undefined) {
-      Player.setSrc(track);
+      Player.setTrack(track);
       await Player.play();
       store.dispatch({
         type: types.PLAYER_NEXT,
@@ -209,7 +209,7 @@ export const previous = async (): Promise<void> => {
 
     // tslint:disable-next-line
     if (newTrack !== undefined) {
-      Player.setSrc(newTrack);
+      Player.setTrack(newTrack);
       await Player.play();
 
       store.dispatch({

src/renderer/store/actions/QueueActions.ts

@@ -13,7 +13,7 @@ export const start = async (index: number): Promise<void> => {
   const { queue } = store.getState().player;
   const track = queue[index];
 
-  Player.setSrc(track);
+  Player.setTrack(track);
   await Player.play();
 
   store.dispatch({

src/renderer/store/store.ts

@@ -50,7 +50,7 @@ export const persistor = persistStore(store, null, () => {
   if (state.player.queue && state.player.queueCursor) {
     const track = state.player.queue[state.player.queueCursor];
 
-    player.setSrc(track);
+    player.setTrack(track);
   }
 });