#489 hub player transport show

Author: sentinelweb

hub/src/main/kotlin/uk/co/sentinelweb/cuer/hub/ui/home/HomeComposeables.kt

@@ -20,6 +20,7 @@ import androidx.compose.ui.window.Window
 import androidx.compose.ui.window.WindowPosition
 import androidx.compose.ui.window.application
 import androidx.compose.ui.window.rememberWindowState
+import kotlinx.coroutines.ExperimentalCoroutinesApi
 import uk.co.sentinelweb.cuer.app.ui.common.compose.*
 import uk.co.sentinelweb.cuer.app.ui.local.LocalComposables
 import uk.co.sentinelweb.cuer.hub.ui.home.HomeContract.HomeModel.DisplayRoute.*
@@ -46,6 +47,7 @@ fun home(coordinator: HomeUiCoordinator) = application {
     }
 }
 
+@ExperimentalCoroutinesApi
 @Composable
 @Preview
 fun Home(coordinator: HomeUiCoordinator) {
@@ -93,13 +95,16 @@ fun Home(coordinator: HomeUiCoordinator) {
                 Box(modifier = Modifier.width(400.dp)) {
                     coordinator.remotesCoordinator.RemotesDesktopUi()
                 }
-                Box(
+                Column(
                     modifier = Modifier
                         .fillMaxSize()
                         .background(Color.White)
+//                        .padding(bottom=if (state.value.showPlayer) 100.dp else 0.dp)
                 ) {
-                    val route = state.value.route
-                    when (route) {
+                    if (state.value.showPlayer) {
+                        coordinator.playerUiCoordinator?.PlayerDesktopUi()
+                    }
+                    when (state.value.route) {
                         Settings -> PreferencesUi(coordinator.preferencesUiCoordinator)
                         is Folders -> coordinator.filesUiCoordinator.FileBrowserDesktopUi()
                         ThemeTest -> SharedThemeView.View()

hub/src/main/kotlin/uk/co/sentinelweb/cuer/hub/ui/home/HomeContract.kt

@@ -5,7 +5,8 @@ import uk.co.sentinelweb.cuer.domain.NodeDomain
 class HomeContract {
 
     data class HomeModel(
-        val route: DisplayRoute = DisplayRoute.Settings
+        val route: DisplayRoute = DisplayRoute.Settings,
+        val showPlayer: Boolean = false,
     ) {
 
         sealed class DisplayRoute {

hub/src/main/kotlin/uk/co/sentinelweb/cuer/hub/ui/home/HomeUiCoordinator.kt

@@ -52,7 +52,9 @@ class HomeUiCoordinator(
     private val log: LogWrapper by inject()
     private val playerConfigProvider: PlayerConfigProvider by inject()
 
-    private var playerUiCoordinator: VlcPlayerUiCoordinator? = null
+    private var _playerUiCoordinator: VlcPlayerUiCoordinator? = null
+    val playerUiCoordinator: VlcPlayerUiCoordinator?
+        get() = _playerUiCoordinator
 
     override var modelObservable = MutableStateFlow(HomeContract.HomeModel.Initial)
         private set
@@ -73,7 +75,7 @@ class HomeUiCoordinator(
         remotesCoordinator.destroy()
         preferencesUiCoordinator.destroy()
         filesUiCoordinator.destroy()
-        playerUiCoordinator?.destroy()
+        _playerUiCoordinator?.destroy()
         localCoordinator.destroy()
         scope.close()
     }
@@ -88,22 +90,24 @@ class HomeUiCoordinator(
 
     fun showPlayer(item: PlaylistItemDomain, playlist: PlaylistDomain) {
         killPlayer()
-        playerUiCoordinator = getKoin().get(parameters = { parametersOf(this@HomeUiCoordinator) })
+        _playerUiCoordinator = getKoin().get(parameters = { parametersOf(this@HomeUiCoordinator) })
         val selectedScreen = playerConfigProvider.invoke()
             .screens
             .let { if (it.size > PREFERRED_SCREEN_DEFAULT) it.get(PREFERRED_SCREEN_DEFAULT) else it.get(0) }
-        playerUiCoordinator?.setupPlaylistAndItem(item, playlist, selectedScreen)
+        _playerUiCoordinator?.setupPlaylistAndItem(item, playlist, selectedScreen)
+        modelObservable.value = modelObservable.value.copy(showPlayer = true)
     }
 
     fun killPlayer() {
-        playerUiCoordinator?.destroy()
-        playerUiCoordinator = null
+        modelObservable.value = modelObservable.value.copy(showPlayer = false)
+        _playerUiCoordinator?.destroy()
+        _playerUiCoordinator = null
     }
 
     // called from the webserver
     override fun launchVideo(item: PlaylistItemDomain, screenIndex: Int?) {
         killPlayer()
-        playerUiCoordinator = getKoin().get(parameters = { parametersOf(this@HomeUiCoordinator) })
+        _playerUiCoordinator = getKoin().get(parameters = { parametersOf(this@HomeUiCoordinator) })
         val queuePlaylist = PlaylistDomain(
             id = Identifier(QueueTemp.id, MEMORY),
             title = "Queue",
@@ -113,7 +117,8 @@ class HomeUiCoordinator(
         val selectedScreen = playerConfigProvider.invoke()
             .screens
             .let { if (it.size > index) it.get(index) else it.get(0) }
-        playerUiCoordinator?.setupPlaylistAndItem(item, queuePlaylist, selectedScreen)
+        _playerUiCoordinator?.setupPlaylistAndItem(item, queuePlaylist, selectedScreen)
+        modelObservable.value = modelObservable.value.copy(showPlayer = true)
     }
 
     fun showError(message: String) {

hub/src/main/kotlin/uk/co/sentinelweb/cuer/hub/ui/player/vlc/VlcPlayerUiCoordinator.kt

@@ -1,6 +1,12 @@
 package uk.co.sentinelweb.cuer.hub.ui.player.vlc
 
 import SleepPreventer
+import androidx.compose.foundation.layout.height
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.collectAsState
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
 import com.arkivanov.essenty.lifecycle.Lifecycle
 import com.arkivanov.essenty.lifecycle.LifecycleRegistry
 import com.arkivanov.mvikotlin.core.utils.diff
@@ -23,6 +29,7 @@ import uk.co.sentinelweb.cuer.app.queue.QueueMediatorContract
 import uk.co.sentinelweb.cuer.app.ui.common.skip.EmptySkipView
 import uk.co.sentinelweb.cuer.app.ui.common.skip.SkipContract
 import uk.co.sentinelweb.cuer.app.ui.common.skip.SkipPresenter
+import uk.co.sentinelweb.cuer.app.ui.player.PlayerComposeables
 import uk.co.sentinelweb.cuer.app.ui.player.PlayerContract
 import uk.co.sentinelweb.cuer.app.ui.player.PlayerContract.MviStore.Label.*
 import uk.co.sentinelweb.cuer.app.ui.player.PlayerContract.View.Event
@@ -66,6 +73,18 @@ class VlcPlayerUiCoordinator(
     private var playlistId: OrchestratorContract.Identifier<GUID>? = null
     private lateinit var screen: PlayerNodeDomain.Screen
 
+    @Composable
+    fun PlayerDesktopUi() {
+        val state = modelObservable.collectAsState()
+        PlayerComposeables.PlayerTransport(
+            state.value,
+            this@VlcPlayerUiCoordinator,
+            contentColor = MaterialTheme.colorScheme.onSurface,
+            backgroundColor = MaterialTheme.colorScheme.surface,
+            modifier = Modifier.height(100.dp)
+        )
+    }
+
     override fun create() {
         log.tag(this)
         lifecycle.onCreate()
@@ -106,7 +125,7 @@ class VlcPlayerUiCoordinator(
         }
     }
 
-    override val renderer: ViewRenderer<Model> = diff {
+    val modelDiffer: ViewRenderer<Model> = diff {
         diff(get = Model::playState, set = {
             playerWindow.updateUiPlayState(it)
         })
@@ -124,6 +143,13 @@ class VlcPlayerUiCoordinator(
         })
     }
 
+    override val renderer: ViewRenderer<Model> = object : ViewRenderer<Model> {
+        override fun render(model: Model) {
+            modelObservable.value = model
+            modelDiffer.render(model)
+        }
+    }
+
     fun focusPlayerWindow() {
         playerWindow.doFocus()
     }

shared/src/commonMain/kotlin/uk/co/sentinelweb/cuer/app/ui/player/PlayerComposeables.kt

@@ -11,9 +11,11 @@ import androidx.compose.ui.unit.dp
 import com.arkivanov.mvikotlin.core.view.BaseMviView
 import org.jetbrains.compose.resources.painterResource
 import org.jetbrains.compose.resources.stringResource
+import org.jetbrains.compose.ui.tooling.preview.Preview
 import org.koin.core.component.KoinComponent
 import org.koin.core.component.inject
 import uk.co.sentinelweb.cuer.app.ui.common.compose.colorTransparentBlack
+import uk.co.sentinelweb.cuer.app.ui.player.PlayerComposeables.VolumeDisplay
 import uk.co.sentinelweb.cuer.app.ui.player.PlayerContract.View.Event
 import uk.co.sentinelweb.cuer.app.ui.player.PlayerContract.View.Event.*
 import uk.co.sentinelweb.cuer.app.ui.player.PlayerContract.View.Model
@@ -25,14 +27,16 @@ private val buttonSize = 48.dp
 private val buttonPadding = 8.dp
 
 object PlayerComposeables : KoinComponent {
+
     private val log: LogWrapper by inject<LogWrapper>()
 
     @Composable
     fun PlayerTransport(
         model: Model,
         view: BaseMviView<Model, Event>,
         contentColor: Color = Color.White,
-        modifier: Modifier,
+        backgroundColor: Color = colorTransparentBlack,
+        modifier: Modifier = Modifier,
     ) {
         log.tag("PlayerComposeables")
         Column(
@@ -41,7 +45,7 @@ object PlayerComposeables : KoinComponent {
             modifier = modifier
                 .fillMaxWidth()
                 .wrapContentHeight()
-                .background(colorTransparentBlack)
+                .background(backgroundColor)
         ) {
 
             Row(
@@ -159,7 +163,6 @@ object PlayerComposeables : KoinComponent {
                 )
             }
 
-
             Slider(
                 value = sliderPosition,
                 onValueChange = { fraction -> sliderPosition = fraction },
@@ -188,3 +191,9 @@ object PlayerComposeables : KoinComponent {
         }
     }
 }
+
+@Preview
+@Composable
+fun VolumeDisplayPreview() {
+    VolumeDisplay(0.5f, Modifier.fillMaxWidth())
+}