update position for mediasession, reset repeat and shuffel when playing new playlist

Author: DutchJavaDev

MyMusicClientSveltePwa/src/lib/pages/Playlist.svelte

@@ -19,7 +19,6 @@
 
     intervalId = setInterval(() => {
       songs.set(getCachedPlaylistSongs(playlistId));
-      setPlaylists(playlistId);
     }, updateIntervalTimeOut);
   });
 

MyMusicClientSveltePwa/src/lib/scripts/mediasessionService.js

@@ -1,6 +1,8 @@
 import { getImageUrl } from "./api.js"
 import { nextSong, previousSong } from "./playbackService.js";
 
+const DEFAULT_PLAYBACK_RATE = 1.0;
+
 export function initializeMediaSessionService() {
   if ("mediaSession" in navigator) {
     navigator.mediaSession.setActionHandler("previoustrack", () => {
@@ -20,6 +22,16 @@ export function updateMediaSessionPlaybackState(isPlaying) {
   }
 }
 
+export function updatePositionState(currentTime, duration) {
+  if ("mediaSession" in navigator) {
+    navigator.mediaSession.setPositionState({
+      duration: duration,
+      playbackRate: DEFAULT_PLAYBACK_RATE,
+      position: currentTime,
+    });
+  }
+}
+
 export function updateMediaSessionMetadata(song, playlist) {
   if ("mediaSession" in navigator) {
     navigator.mediaSession.playbackState = "paused";

MyMusicClientSveltePwa/src/lib/scripts/playbackService.js

@@ -8,7 +8,7 @@ import { getCachedPlaylistSongs, getCachedPlaylists,
          getCurrentSongIndex, setCurrentSongIndex, setCurrentSongTime,
          getCurrentSongTime } from "./storageService";
 import { shuffleArray } from "./util";
-import { updateMediaSessionMetadata, updateMediaSessionPlaybackState } from "./mediasessionService";
+import { updateMediaSessionMetadata, updateMediaSessionPlaybackState, updatePositionState } from "./mediasessionService";
 
 export let currentSong = writable({id: -999, title: "", artist: "", album: "", source_id: ""});
 export let isPlaying = writable(false);
@@ -52,7 +52,6 @@ export function initializePlaybackService() {
     playOrPauseSong(playlistSongs[songIndex].id);
   }
 
-
   audioElement.addEventListener("play", () => {
     isPlaying.set(true);
     updateMediaSessionPlaybackState(true);
@@ -65,7 +64,7 @@ export function initializePlaybackService() {
     updateMediaSessionPlaybackState(false);
     if (get(isLoopingEnabled)) {
       audioElement.currentTime = 0;
-      audioElement.play();
+      audioElement.load();
     } else {
       nextSong();
     }
@@ -90,7 +89,7 @@ export function initializePlaybackService() {
     }
 
     setCurrentSongTime(audioElement.currentTime);
-
+    updatePositionState(audioElement.currentTime, audioElement.duration);
     playPercentage.set(percentage);
   });
 
@@ -132,6 +131,7 @@ export function playOrPauseSong(songId) {
   else if (get(isPlaying)) {
     audioElement.pause();
   }else {
+    // data is already loaded, just play
     audioElement.play();
   }
 }
@@ -174,6 +174,9 @@ export function setPlaylists(playlistId) {
     // and update playlistSongs accordingly if shuffle is enabled
     return; // Already set to this playlist
   }
+  isLoopingEnabled.set(false);
+  isShuffledEnabled.set(false);
+  setPlaybackState(false, false);
   currentPlaylistId = playlistId;
   originalPlaylistSongs = getCachedPlaylistSongs(playlistId);
   playlistSongs = originalPlaylistSongs;