Add support for music (#1059)

## Description
Adds support for music playback

### Features
- Adds a "Now Playing" page which is accessible from the nav drawer
while music is playing
- Manage the playback queue, add/remove/re-order songs
- Supports synced & non-synced lyrics
- Scroll through lyrics
- Click on line for synced lyrics to seek to that position

### User interface
- Customize what's shown on the "Now Playing" page
- Show album cover art, backdrops, and lyrics
- Show a basic bar visualizer
- Search for albums, artists, & songs
- Links between albums, artists, playlists, & music videos when metadata
is available
- Throughout the app, see which song is playing and which ones are in
the queue

Note: lyrics are synced by line. `10.11` added support for syncing by
word, but Wholphin still supports `10.10`

### Related issues
Closes #2 
Closes #267 

### Testing
Emulator & shield testing

## Screenshots
<details><summary>Click to see screenshots</summary>
<p>

### Album grid
![music_album_grid
Large](https://github.com/user-attachments/assets/4573ad32-0cd7-49db-94db-de37ceb6f641)

### Artist page
![music_artist
Large](https://github.com/user-attachments/assets/fdf3b7b9-5c40-434d-867d-7d56e0b3430e)

### Album details
![music_album_details
Large](https://github.com/user-attachments/assets/494d1a76-9581-4a07-a8ee-5c0957f542e0)

### Album is playing/queued
![music_album_queued
Large](https://github.com/user-attachments/assets/55c72cd2-10a9-411d-8bae-b232150db506)

### Now playing page
![now_playing
Large](https://github.com/user-attachments/assets/b773b1bc-71fd-4789-8509-cebfc0d0ffe5)

### Now playing queue
![now_playing_queue
Large](https://github.com/user-attachments/assets/db244462-e33d-452a-93dc-dd2123a4862d)

</p>
</details> 

## AI or LLM usage
None

## Try it out

See instructions at
https://github.com/damontecres/Wholphin/releases/tag/develop-music
This commit is contained in:
Ray 2026-03-24 13:42:18 -04:00 committed by GitHub
parent 8a37d63d09
commit f2570d4ab0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
46 changed files with 6342 additions and 436 deletions

View file

@ -16,6 +16,7 @@ import com.github.damontecres.wholphin.preferences.updateHomePagePreferences
import com.github.damontecres.wholphin.preferences.updateInterfacePreferences
import com.github.damontecres.wholphin.preferences.updateLiveTvPreferences
import com.github.damontecres.wholphin.preferences.updateMpvOptions
import com.github.damontecres.wholphin.preferences.updateMusicPreferences
import com.github.damontecres.wholphin.preferences.updatePhotoPreferences
import com.github.damontecres.wholphin.preferences.updatePlaybackOverrides
import com.github.damontecres.wholphin.preferences.updateScreensaverPreferences
@ -280,5 +281,15 @@ class AppUpgradeHandler
)
}
}
if (previous.isEqualOrBefore(Version.fromString("0.6.0-0-g0"))) {
appPreferences.updateData {
it.updateMusicPreferences {
showBackdrop = true
showLyrics = true
showAlbumArt = true
}
}
}
}
}

View file

@ -114,7 +114,7 @@ class BackdropService
}
}
private suspend fun extractColorsFromBackdrop(imageUrl: String?): ExtractedColors =
suspend fun extractColorsFromBackdrop(imageUrl: String?): ExtractedColors =
withContext(Dispatchers.IO) {
if (imageUrl.isNullOrBlank()) {
return@withContext ExtractedColors.DEFAULT

View file

@ -0,0 +1,519 @@
package com.github.damontecres.wholphin.services
import android.content.Context
import androidx.annotation.OptIn
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.remember
import androidx.media3.common.AudioAttributes
import androidx.media3.common.C
import androidx.media3.common.MediaItem
import androidx.media3.common.Player
import androidx.media3.common.Timeline
import androidx.media3.common.util.UnstableApi
import androidx.media3.datasource.okhttp.OkHttpDataSource
import androidx.media3.exoplayer.ExoPlayer
import androidx.media3.exoplayer.source.DefaultMediaSourceFactory
import androidx.media3.session.MediaSession
import com.github.damontecres.wholphin.data.ServerRepository
import com.github.damontecres.wholphin.data.model.AudioItem
import com.github.damontecres.wholphin.data.model.BaseItem
import com.github.damontecres.wholphin.services.hilt.AuthOkHttpClient
import com.github.damontecres.wholphin.services.hilt.DefaultCoroutineScope
import com.github.damontecres.wholphin.ui.DefaultItemFields
import com.github.damontecres.wholphin.ui.main.settings.MoveDirection
import com.github.damontecres.wholphin.ui.onMain
import com.github.damontecres.wholphin.ui.seekBack
import com.github.damontecres.wholphin.ui.seekForward
import com.github.damontecres.wholphin.ui.toServerString
import com.github.damontecres.wholphin.util.BlockingList
import com.github.damontecres.wholphin.util.LoadingState
import com.github.damontecres.wholphin.util.PlaybackItemState
import com.github.damontecres.wholphin.util.TrackActivityPlaybackListener
import com.github.damontecres.wholphin.util.profile.Codec
import dagger.hilt.android.qualifiers.ApplicationContext
import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.Job
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.StateFlow
import kotlinx.coroutines.flow.catch
import kotlinx.coroutines.flow.launchIn
import kotlinx.coroutines.flow.onEach
import kotlinx.coroutines.flow.update
import kotlinx.coroutines.sync.Mutex
import kotlinx.coroutines.sync.withLock
import kotlinx.coroutines.withContext
import okhttp3.OkHttpClient
import org.jellyfin.sdk.api.client.ApiClient
import org.jellyfin.sdk.api.client.extensions.instantMixApi
import org.jellyfin.sdk.api.client.extensions.universalAudioApi
import org.jellyfin.sdk.api.sockets.subscribe
import org.jellyfin.sdk.model.api.BaseItemKind
import org.jellyfin.sdk.model.api.ImageType
import org.jellyfin.sdk.model.api.PlayMethod
import org.jellyfin.sdk.model.api.PlaystateCommand
import org.jellyfin.sdk.model.api.PlaystateMessage
import org.jellyfin.sdk.model.extensions.ticks
import org.jellyfin.sdk.model.serializer.toUUID
import org.jellyfin.sdk.model.serializer.toUUIDOrNull
import timber.log.Timber
import java.util.UUID
import javax.inject.Inject
import javax.inject.Singleton
import kotlin.time.Duration.Companion.seconds
@OptIn(UnstableApi::class)
@Singleton
class MusicService
@Inject
constructor(
@param:ApplicationContext private val context: Context,
@param:AuthOkHttpClient private val authOkHttpClient: OkHttpClient,
@param:DefaultCoroutineScope private val defaultScope: CoroutineScope,
private val api: ApiClient,
private val serverRepository: ServerRepository,
private val imageUrlService: ImageUrlService,
) {
private val _state = MutableStateFlow(MusicServiceState.EMPTY)
val state: StateFlow<MusicServiceState> = _state
val player: Player by lazy {
ExoPlayer
.Builder(context)
.setMediaSourceFactory(
DefaultMediaSourceFactory(
OkHttpDataSource.Factory(authOkHttpClient),
),
).build()
.also {
it.setAudioAttributes(
AudioAttributes
.Builder()
.setContentType(C.AUDIO_CONTENT_TYPE_MUSIC)
.build(),
false,
)
it.addListener(MusicPlayerListener(it, _state))
}
}
private val mutex = Mutex()
var mediaSession: MediaSession? = null
private set
private var activityTracker: TrackActivityPlaybackListener? = null
private var websocketJob: Job? = null
suspend fun start() {
if (mediaSession == null) {
mutex.withLock {
if (mediaSession == null) {
Timber.i("Starting music MediaSession")
mediaSession = MediaSession.Builder(context, player).build()
activityTracker =
TrackActivityPlaybackListener(api, player) {
state.value.currentItemId?.let { itemId ->
PlaybackItemState(
itemId = itemId,
playMethod = PlayMethod.DIRECT_PLAY,
// playSessionId = mediaSession?.id,
)
}
}.also { player.addListener(it) }
websocketJob = subscribe()
}
}
}
onMain {
player.prepare()
player.play()
}
}
suspend fun stop() {
mutex.withLock {
Timber.i("Stopping music")
if (mediaSession == null) {
Timber.w("Stopping but no MediaSession")
}
mediaSession?.release()
mediaSession = null
onMain {
websocketJob?.cancel()
websocketJob = null
activityTracker?.let {
it.release()
player.removeListener(it)
}
activityTracker = null
player.stop()
player.setMediaItems(emptyList())
}
_state.update {
MusicServiceState.EMPTY
}
}
}
/**
* Fetches instant mix items, replaces the queue, and begins playback
*/
suspend fun startInstantMix(itemId: UUID) =
loading {
val items =
api.instantMixApi
.getInstantMixFromItem(
userId = serverRepository.currentUser.value?.id,
itemId = itemId,
limit = 200,
fields = DefaultItemFields,
).content.items
.map { BaseItem(it, false) }
setQueue(items, false)
}
/**
* Replace the queue with the given list and starting playing the song as startIndex as soon as its ready
*
* Fetches each item in a blocking way and adds to the queue
*/
suspend fun setQueue(
items: BlockingList<BaseItem?>,
startIndex: Int,
shuffled: Boolean,
) = withContext(Dispatchers.IO) {
Timber.d("setQueue: %s items, startIndex=%s, shuffled=%s", items.size, startIndex, shuffled)
withContext(Dispatchers.Main) {
player.setMediaItems(emptyList())
player.shuffleModeEnabled = shuffled
}
start()
addAllToQueue(items, startIndex)
}
suspend fun setQueue(
items: List<BaseItem>,
shuffled: Boolean,
) {
Timber.d("setQueue: %s items, shuffled=%s", items.size, shuffled)
val mediaItems =
items
.filter { it.type == BaseItemKind.AUDIO }
.map(::convert)
withContext(Dispatchers.Main) {
player.setMediaItems(mediaItems)
player.shuffleModeEnabled = shuffled
updateQueueSize()
start()
}
}
suspend fun addToQueue(
item: BaseItem,
index: Int? = null,
) {
if (item.type == BaseItemKind.AUDIO) {
val mediaItem = convert(item)
withContext(Dispatchers.Main) {
if (index != null) {
player.addMediaItem(index, mediaItem)
} else {
player.addMediaItem(mediaItem)
}
updateQueueSize()
if (player.mediaItemCount == 1) {
// Start playing if this was the first time added
start()
}
}
}
}
suspend fun addAllToQueue(
list: BlockingList<BaseItem?>,
startIndex: Int,
) = loading {
var remaining = startIndex
list.indices
.chunked(25)
.forEach {
val mediaItems =
it.mapNotNull {
if (remaining == 0) {
list
.getBlocking(it)
?.takeIf { it.type == BaseItemKind.AUDIO }
?.let(::convert)
} else {
Timber.v("Skipping $remaining")
remaining--
null
}
}
onMain { player.addMediaItems(mediaItems) }
}
updateQueueSize()
}
private fun convert(audio: BaseItem): MediaItem {
val url =
api.universalAudioApi.getUniversalAudioStreamUrl(
itemId = audio.id,
container =
listOf(
Codec.Audio.OPUS,
Codec.Audio.MP3,
Codec.Audio.AAC,
Codec.Audio.FLAC,
),
)
val imageUrl =
audio.data.albumId?.let { albumId ->
imageUrlService.getItemImageUrl(
itemId = albumId,
imageType = ImageType.PRIMARY,
)
}
return MediaItem
.Builder()
.setUri(url)
.setMediaId(audio.id.toServerString())
.setTag(AudioItem.from(audio, imageUrl))
.build()
}
private suspend fun updateQueueSize() {
// val ids =
// withContext(Dispatchers.Default) {
// (0..<player.mediaItemCount).map { player.getMediaItemAt(it).mediaId.toUUID() }
// }
val timeline = onMain { player.currentTimeline }
val window = Timeline.Window()
val ids =
(0..<timeline.windowCount)
.map {
timeline.getWindow(it, window)
window.mediaItem.mediaId.toUUID()
}.toSet()
withContext(Dispatchers.Main) {
_state.update {
it.copy(
queueVersion = it.queueVersion + 1,
queueSize = player.mediaItemCount,
queuedIds = ids,
)
}
}
}
suspend fun moveQueue(
index: Int,
direction: MoveDirection,
) = withContext(Dispatchers.Main) {
player.moveMediaItem(index, if (direction == MoveDirection.UP) index - 1 else index + 1)
updateQueueSize()
}
suspend fun moveQueue(
index: Int,
newIndex: Int,
) = withContext(Dispatchers.Main) {
player.moveMediaItem(index, newIndex)
updateQueueSize()
}
suspend fun playIndex(index: Int) {
onMain {
player.seekTo(index, 0L)
player.play()
}
// MusicPlayerListener will update state
}
suspend fun playNext(song: BaseItem) {
val mediaItem = convert(song)
onMain {
player.addMediaItem(state.value.currentIndex + 1, mediaItem)
if (player.mediaItemCount == 1) {
start()
}
}
updateQueueSize()
}
suspend fun removeFromQueue(index: Int) {
onMain { player.removeMediaItem(index) }
updateQueueSize()
}
private suspend fun <T> loading(block: suspend () -> T): T {
_state.update { it.copy(loadingState = LoadingState.Loading) }
val result = block.invoke()
_state.update { it.copy(loadingState = LoadingState.Success) }
return result
}
fun subscribe(): Job =
api.webSocket
.subscribe<PlaystateMessage>()
.onEach { message ->
message.data?.let {
withContext(Dispatchers.Main) {
when (it.command) {
PlaystateCommand.STOP -> {
stop()
}
PlaystateCommand.PAUSE -> {
player.pause()
}
PlaystateCommand.UNPAUSE -> {
player.play()
}
PlaystateCommand.NEXT_TRACK -> {
player.seekToNext()
}
PlaystateCommand.PREVIOUS_TRACK -> {
player.seekToPrevious()
}
PlaystateCommand.SEEK -> {
it.seekPositionTicks?.ticks?.let {
player.seekTo(
it.inWholeMilliseconds,
)
}
}
PlaystateCommand.REWIND -> {
player.seekBack(10.seconds)
}
PlaystateCommand.FAST_FORWARD -> {
player.seekForward(30.seconds)
}
PlaystateCommand.PLAY_PAUSE -> {
if (player.isPlaying) player.pause() else player.play()
}
}
}
}
}.catch { ex ->
Timber.e(ex, "Error in websocket subscription")
}.launchIn(defaultScope)
}
@Stable
data class MusicServiceState(
val queueVersion: Long,
val queueSize: Int,
val currentIndex: Int,
val currentItemId: UUID?,
val status: NowPlayingStatus,
val currentItemTitle: String?,
val loadingState: LoadingState = LoadingState.Pending,
val queuedIds: Set<UUID>,
) {
companion object {
val EMPTY =
MusicServiceState(
0L,
0,
0,
null,
NowPlayingStatus.IDLE,
null,
LoadingState.Pending,
emptySet(),
)
}
}
enum class NowPlayingStatus {
PLAYING,
PAUSED,
IDLE,
}
/**
* Listens to [Player] events and updates the [StateFlow]
*/
private class MusicPlayerListener(
private val player: Player,
private val state: MutableStateFlow<MusicServiceState>,
) : Player.Listener {
init {
Timber.v("MusicPlayerListener init")
state.update {
it.copy(
queueSize = player.mediaItemCount,
currentIndex = player.currentMediaItemIndex,
status = if (player.isPlaying) NowPlayingStatus.PLAYING else NowPlayingStatus.IDLE,
)
}
}
override fun onIsPlayingChanged(isPlaying: Boolean) {
Timber.v("MusicPlayerListener onIsPlayingChanged")
state.update {
it.copy(
status = if (isPlaying) NowPlayingStatus.PLAYING else NowPlayingStatus.PAUSED,
)
}
}
override fun onMediaItemTransition(
mediaItem: MediaItem?,
reason: Int,
) {
Timber.v("MusicPlayerListener onMediaItemTransition")
updateCurrentIndex()
}
override fun onTimelineChanged(
timeline: Timeline,
reason: Int,
) {
// Timber.v("MusicPlayerListener onTimelineChanged")
if (reason == Player.TIMELINE_CHANGE_REASON_PLAYLIST_CHANGED) {
updateCurrentIndex()
}
}
private fun updateCurrentIndex() {
state.update { state ->
player.currentMediaItemIndex.takeIf { it >= 0 }?.let { currentMediaItemIndex ->
if (currentMediaItemIndex in (0..<player.mediaItemCount)) {
val item =
player.getMediaItemAt(currentMediaItemIndex).localConfiguration?.tag as? AudioItem
state.copy(
currentIndex = currentMediaItemIndex,
currentItemId = player.getMediaItemAt(currentMediaItemIndex).mediaId.toUUIDOrNull(),
currentItemTitle = item?.title,
)
} else {
state
}
} ?: state
}
}
}
@Composable
fun rememberQueue(
player: Player,
queueVersion: Long,
queueSize: Int,
): List<AudioItem> =
remember(queueVersion, queueSize) {
object : AbstractList<AudioItem>() {
override val size: Int
get() = player.mediaItemCount
override fun get(index: Int): AudioItem = player.getMediaItemAt(index).localConfiguration?.tag as AudioItem
}
}

View file

@ -7,6 +7,7 @@ import com.github.damontecres.wholphin.data.ServerRepository
import com.github.damontecres.wholphin.data.model.JellyfinUser
import com.github.damontecres.wholphin.data.model.NavPinType
import com.github.damontecres.wholphin.services.hilt.DefaultCoroutineScope
import com.github.damontecres.wholphin.ui.launchDefault
import com.github.damontecres.wholphin.ui.main.settings.Library
import com.github.damontecres.wholphin.ui.nav.Destination
import com.github.damontecres.wholphin.ui.nav.NavDrawerItem
@ -16,9 +17,11 @@ import com.github.damontecres.wholphin.util.supportedCollectionTypes
import dagger.hilt.android.qualifiers.ApplicationContext
import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.delay
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.StateFlow
import kotlinx.coroutines.flow.catch
import kotlinx.coroutines.flow.collectLatest
import kotlinx.coroutines.flow.combine
import kotlinx.coroutines.flow.launchIn
import kotlinx.coroutines.flow.onEach
@ -33,6 +36,7 @@ import timber.log.Timber
import java.util.UUID
import javax.inject.Inject
import javax.inject.Singleton
import kotlin.time.Duration.Companion.hours
@Singleton
class NavDrawerService
@ -44,6 +48,7 @@ class NavDrawerService
private val serverRepository: ServerRepository,
private val serverPreferencesDao: ServerPreferencesDao,
private val seerrServerRepository: SeerrServerRepository,
private val musicService: MusicService,
) {
private val _state = MutableStateFlow(NavDrawerItemState.EMPTY)
val state: StateFlow<NavDrawerItemState> = _state
@ -73,6 +78,40 @@ class NavDrawerService
.onEach { discoverActive ->
_state.update { it.copy(discoverEnabled = discoverActive) }
}.launchIn(coroutineScope)
coroutineScope.launchDefault {
musicService.state.collectLatest { music ->
Timber.v("MusicService updated")
when (music.status) {
NowPlayingStatus.PLAYING -> {
_state.update {
it.copy(
nowPlayingEnabled = true,
nowPlayingTitle = music.currentItemTitle,
)
}
}
NowPlayingStatus.IDLE -> {
_state.update {
it.copy(
nowPlayingEnabled = false,
nowPlayingTitle = null,
)
}
}
NowPlayingStatus.PAUSED -> {
delay(2.hours)
_state.update {
it.copy(
nowPlayingEnabled = false,
nowPlayingTitle = null,
)
}
}
}
}
}
}
suspend fun getAllUserLibraries(
@ -185,9 +224,11 @@ data class NavDrawerItemState(
val items: List<NavDrawerItem>,
val moreItems: List<NavDrawerItem>,
val discoverEnabled: Boolean,
val nowPlayingEnabled: Boolean,
val nowPlayingTitle: String?,
) {
companion object {
val EMPTY = NavDrawerItemState(emptyList(), emptyList(), false)
val EMPTY = NavDrawerItemState(emptyList(), emptyList(), false, false, null)
}
}