Deluan Quintão
957130ca38
* feat(ui): add browser audio profile detection for transcoding Detect browser codec capabilities via canPlayType() to build a client profile for the getTranscodeDecision API. Only codecs returning "probably" are treated as supported for conservative compatibility. * feat(ui): add transcode decision service with caching and pre-fetch Standalone service that fetches getTranscodeDecision results, caches them with an 11-hour TTL (1h buffer before 12h token expiry), and supports bulk pre-fetching for upcoming queue items. Includes invalidateAll() for handling stale tokens and getCachedDecision() for synchronous cache reads. * feat(ui): add fetch helper for getTranscodeDecision endpoint POST-based Subsonic API call that sends the browser's codec profile and returns the transcode decision including the JWT transcodeParams token for subsequent streaming. * feat(ui): wire transcode decision service singleton Module index that creates the service singleton with the real fetch function and re-exports the browser profile detector. * feat(ui): add Redux transcoding reducer for browser profile state Store the detected browser codec profile in Redux so it's available globally. The profile is set once at startup and used by the decision service when calling getTranscodeDecision. * feat(ui): integrate transcode decision into player musicSrc Replace static stream URLs with lazy musicSrc functions that fetch a transcode decision before playback. Falls back to the old stream endpoint if the decision fetch fails or if no browser profile is set. * feat(ui): detect browser profile and pre-fetch transcode decisions Run codec detection once when the Player mounts, storing the profile in both the decision service and Redux. Pre-fetch decisions for the next 3 songs when the queue or play position changes. * feat(ui): handle stale tokens and replace audio preload with decision pre-fetch On audio playback error, invalidate all cached transcode decisions and pre-fetch fresh decisions for upcoming songs. Replace the old Audio element preload with decision pre-fetching to warm the cache for instant playback transitions. * feat(ui): show transcode format in QualityInfo chip When transcode decision data is available, QualityInfo now shows "FLAC → OPUS 128" instead of just the source format. The new props are optional, so existing usages in song lists, album songs, playlists, and shares are unaffected. * feat(ui): display transcode status in player quality badge AudioTitle now reads the cached transcode decision for the current track and passes it to QualityInfo, showing "FLAC → OPUS 128" when transcoding or the normal format when direct playing. * chore(ui): format and lint transcode decision integration * refactor(ui): use JWT exp claim for decision cache expiry Replace the hardcoded 11-hour TTL with actual token expiration decoded from the JWT's exp claim. Each cache entry is now validated against its own token's lifetime, adapting automatically to server configuration changes. Tokens without an exp claim are treated as expired and re-fetched immediately. * fix(ui): resolve transcode URLs eagerly on browser refresh Instead of setting musicSrc to a function on queue refresh (which breaks the player's identity matching and can't survive JSON serialization), resolve transcode decisions for the current and next few tracks before dispatching, passing string URLs to the reducer. Also simplifies code: extract makeMusicSrc helper, add resolveStreamUrl to decisionService, use httpClient instead of raw fetch, and remove barrel file test. * chore(ui): fix prettier formatting in Player.jsx * fix(ui): use ref to avoid stale closure in mount-only transcode effect Split the mount effect into profile detection + URL resolution, using a ref for playerState so the effect correctly reads the latest queue without needing playerState in the dependency array (which would cause it to re-run on every queue/position change). * fix(ui): address code review feedback on transcode integration - Use jwt-decode for JWT parsing instead of manual atob (handles base64url) - Guard resolveStreamUrl to fall back to direct stream when decision is null - Fix savedPlayIndex -1 bug in PLAYER_REFRESH_QUEUE (findIndex returns -1) * docs: improve comments on JWT exp claim decoding in decision service Signed-off-by: Deluan <deluan@navidrome.org> --------- Signed-off-by: Deluan <deluan@navidrome.org>
117 lines
2.8 KiB
JavaScript
117 lines
2.8 KiB
JavaScript
export const PLAYER_ADD_TRACKS = 'PLAYER_ADD_TRACKS'
|
|
export const PLAYER_PLAY_NEXT = 'PLAYER_PLAY_NEXT'
|
|
export const PLAYER_SET_TRACK = 'PLAYER_SET_TRACK'
|
|
export const PLAYER_SYNC_QUEUE = 'PLAYER_SYNC_QUEUE'
|
|
export const PLAYER_CLEAR_QUEUE = 'PLAYER_CLEAR_QUEUE'
|
|
export const PLAYER_PLAY_TRACKS = 'PLAYER_PLAY_TRACKS'
|
|
export const PLAYER_CURRENT = 'PLAYER_CURRENT'
|
|
export const PLAYER_SET_VOLUME = 'PLAYER_SET_VOLUME'
|
|
export const PLAYER_SET_MODE = 'PLAYER_SET_MODE'
|
|
export const TRANSCODING_SET_PROFILE = 'TRANSCODING_SET_PROFILE'
|
|
export const PLAYER_REFRESH_QUEUE = 'PLAYER_REFRESH_QUEUE'
|
|
|
|
export const setTrack = (data) => ({
|
|
type: PLAYER_SET_TRACK,
|
|
data,
|
|
})
|
|
|
|
export const filterSongs = (data, ids) => {
|
|
const filteredData = Object.fromEntries(
|
|
Object.entries(data).filter(([_, song]) => !song.missing),
|
|
)
|
|
return !ids
|
|
? filteredData
|
|
: ids.reduce((acc, id) => {
|
|
if (filteredData[id]) {
|
|
return { ...acc, [id]: filteredData[id] }
|
|
}
|
|
return acc
|
|
}, {})
|
|
}
|
|
|
|
export const addTracks = (data, ids) => {
|
|
const songs = filterSongs(data, ids)
|
|
return {
|
|
type: PLAYER_ADD_TRACKS,
|
|
data: songs,
|
|
}
|
|
}
|
|
|
|
export const playNext = (data, ids) => {
|
|
const songs = filterSongs(data, ids)
|
|
return {
|
|
type: PLAYER_PLAY_NEXT,
|
|
data: songs,
|
|
}
|
|
}
|
|
|
|
export const shuffle = (data) => {
|
|
const ids = Object.keys(data)
|
|
for (let i = ids.length - 1; i > 0; i--) {
|
|
let j = Math.floor(Math.random() * (i + 1))
|
|
;[ids[i], ids[j]] = [ids[j], ids[i]]
|
|
}
|
|
const shuffled = {}
|
|
// The "_" is to force the object key to be a string, so it keeps the order when adding to object
|
|
// or else the keys will always be in the same (numerically) order
|
|
ids.forEach((id) => (shuffled['_' + id] = data[id]))
|
|
return shuffled
|
|
}
|
|
|
|
export const shuffleTracks = (data, ids) => {
|
|
const songs = filterSongs(data, ids)
|
|
const shuffled = shuffle(songs)
|
|
const firstId = Object.keys(shuffled)[0]
|
|
return {
|
|
type: PLAYER_PLAY_TRACKS,
|
|
id: firstId,
|
|
data: shuffled,
|
|
}
|
|
}
|
|
|
|
export const playTracks = (data, ids, selectedId) => {
|
|
const songs = filterSongs(data, ids)
|
|
return {
|
|
type: PLAYER_PLAY_TRACKS,
|
|
id: selectedId || Object.keys(songs)[0],
|
|
data: songs,
|
|
}
|
|
}
|
|
|
|
export const syncQueue = (audioInfo, audioLists) => ({
|
|
type: PLAYER_SYNC_QUEUE,
|
|
data: {
|
|
audioInfo,
|
|
audioLists,
|
|
},
|
|
})
|
|
|
|
export const clearQueue = () => ({
|
|
type: PLAYER_CLEAR_QUEUE,
|
|
})
|
|
|
|
export const currentPlaying = (audioInfo) => ({
|
|
type: PLAYER_CURRENT,
|
|
data: audioInfo,
|
|
})
|
|
|
|
export const setVolume = (volume) => ({
|
|
type: PLAYER_SET_VOLUME,
|
|
data: { volume },
|
|
})
|
|
|
|
export const setPlayMode = (mode) => ({
|
|
type: PLAYER_SET_MODE,
|
|
data: { mode },
|
|
})
|
|
|
|
export const setTranscodingProfile = (profile) => ({
|
|
type: TRANSCODING_SET_PROFILE,
|
|
data: profile,
|
|
})
|
|
|
|
export const refreshQueue = (resolvedUrls) => ({
|
|
type: PLAYER_REFRESH_QUEUE,
|
|
data: resolvedUrls,
|
|
})
|