Separate playback info overlay from player controls

That makes it possible to always see the playback info while playing media.
Also move them to the top left corner, to not block the video itself so much.

app/src/main/java/org/jellyfin/mobile/player/PlaybackMenus.kt

@@ -22,7 +22,7 @@ class PlaybackMenus(private val activity: PlayerActivity) : PopupMenu.OnDismissL
     private val infoButton: View = activity.findViewById(R.id.info_button)
     private val subtitlesMenu: PopupMenu = createSubtitlesMenu()
     private val audioStreamsMenu: PopupMenu = createAudioStreamsMenu()
-    val playbackInfo: TextView = activity.findViewById(R.id.playback_info)
+    private val playbackInfo: TextView = activity.findViewById(R.id.playback_info)
 
     init {
         subtitlesButton.setOnClickListener {
@@ -34,9 +34,11 @@ class PlaybackMenus(private val activity: PlayerActivity) : PopupMenu.OnDismissL
             audioStreamsMenu.show()
         }
         infoButton.setOnClickListener {
-            activity.suppressControllerAutoHide(true)
             playbackInfo.isVisible = !playbackInfo.isVisible
         }
+        playbackInfo.setOnClickListener {
+            playbackInfo.isVisible = false
+        }
     }
 
     fun onItemChanged(item: JellyfinMediaSource) {

app/src/main/java/org/jellyfin/mobile/player/PlayerActivity.kt

@@ -39,7 +39,8 @@ class PlayerActivity : AppCompatActivity() {
     private val viewModel: PlayerViewModel by viewModels()
     private val playerView: PlayerView by lazyView(R.id.player_view)
     private val playerControlsView: View by lazyView(R.id.player_controls)
-    private val loadingBar: View by lazyView(R.id.loading_indicator)
+    private val playerOverlay: View by lazyView(R.id.player_overlay)
+    private val loadingIndicator: View by lazyView(R.id.loading_indicator)
     private val titleTextView: TextView by lazyView(R.id.track_title)
     private val fullscreenSwitcher: ImageButton by lazyView(R.id.fullscreen_switcher)
     private lateinit var playbackMenus: PlaybackMenus
@@ -77,7 +78,7 @@ class PlayerActivity : AppCompatActivity() {
         // Handle system window insets
         ViewCompat.setOnApplyWindowInsetsListener(window.decorView) { _, insets ->
             playerControlsView.updatePadding(left = insets.systemWindowInsetLeft, right = insets.systemWindowInsetRight)
-            loadingBar.updatePadding(left = insets.systemWindowInsetLeft, right = insets.systemWindowInsetRight)
+            playerOverlay.updatePadding(left = insets.systemWindowInsetLeft, right = insets.systemWindowInsetRight)
             insets
         }
 
@@ -105,7 +106,7 @@ class PlayerActivity : AppCompatActivity() {
             }
             notifyEvent(if (isPlaying) EVENT_PLAYING else EVENT_PAUSE)
             updatePlaybackPosition()
-            loadingBar.isVisible = playerState == Player.STATE_BUFFERING
+            loadingIndicator.isVisible = playerState == Player.STATE_BUFFERING
         }
         viewModel.mediaSourceManager.jellyfinMediaSource.observe(this) { jellyfinMediaSource ->
             playbackMenus.onItemChanged(jellyfinMediaSource)
@@ -172,9 +173,6 @@ class PlayerActivity : AppCompatActivity() {
         // Handle double tap gesture on controls
         val gestureDetector = GestureDetector(this, object : GestureDetector.SimpleOnGestureListener() {
             override fun onDoubleTap(e: MotionEvent): Boolean {
-                if (playbackMenus.playbackInfo.isVisible)
-                    return true
-
                 val viewWidth = playerView.measuredWidth
                 val viewHeight = playerView.measuredHeight
                 val viewCenterX = viewWidth / 2
@@ -205,13 +203,7 @@ class PlayerActivity : AppCompatActivity() {
 
             override fun onSingleTapConfirmed(e: MotionEvent?): Boolean {
                 playerView.apply {
-                    if (!isControllerVisible) {
-                        showController()
-                    } else {
-                        if (playbackMenus.playbackInfo.isVisible)
-                            playbackMenus.playbackInfo.isVisible = false
-                        hideController()
-                    }
+                    if (!isControllerVisible) showController() else hideController()
                 }
                 return true
             }

app/src/main/res/drawable/playback_info_background.xml

@@ -2,5 +2,5 @@
 <shape xmlns:android="http://schemas.android.com/apk/res/android"
     android:shape="rectangle">
     <corners android:radius="16dp" />
-    <solid android:color="@android:color/black" />
+    <solid android:color="@color/playback_info_background" />
 </shape>

app/src/main/res/layout/activity_player.xml

@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent">
 
@@ -10,13 +11,31 @@
         android:foreground="@drawable/ripple_background" />
 
     <FrameLayout
-        android:id="@+id/loading_indicator"
+        android:id="@+id/player_overlay"
         android:layout_width="match_parent"
         android:layout_height="match_parent">
 
         <ProgressBar
+            android:id="@+id/loading_indicator"
             android:layout_width="64dp"
             android:layout_height="64dp"
-            android:layout_gravity="center" />
+            android:layout_gravity="center"
+            android:visibility="gone" />
+
+        <androidx.appcompat.widget.AppCompatTextView
+            android:id="@+id/playback_info"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="start|top"
+            android:layout_marginStart="@dimen/exo_player_controls_display_padding"
+            android:layout_marginTop="48dp"
+            android:layout_marginEnd="@dimen/exo_player_controls_display_padding"
+            android:layout_marginBottom="96dp"
+            android:background="@drawable/playback_info_background"
+            android:clickable="true"
+            android:padding="16dp"
+            android:visibility="gone"
+            tools:ignore="KeyboardInaccessibleWidget"
+            tools:visibility="visible" />
     </FrameLayout>
-</FrameLayout>
+</FrameLayout>

app/src/main/res/layout/exo_player_control_view.xml

@@ -77,22 +77,6 @@
         app:layout_constraintStart_toEndOf="@id/play_pause_container"
         app:layout_constraintTop_toTopOf="@id/play_pause_container" />
 
-    <androidx.appcompat.widget.AppCompatTextView
-        android:id="@+id/playback_info"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_margin="@dimen/exo_player_controls_display_padding"
-        android:background="@drawable/playback_info_background"
-        android:clickable="true"
-        android:padding="16dp"
-        android:visibility="gone"
-        app:layout_constraintBottom_toTopOf="@id/exo_progress"
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@id/track_title"
-        tools:ignore="KeyboardInaccessibleWidget"
-        tools:visibility="visible" />
-
     <androidx.appcompat.widget.AppCompatTextView
         android:id="@+id/exo_position"
         android:layout_width="wrap_content"

app/src/main/res/values/colors.xml

@@ -12,4 +12,5 @@
     <color name="theme_background">#101010</color>
     <color name="logo_text_color">#fafafa</color>
     <color name="playback_controls_background">#60000000</color>
+    <color name="playback_info_background">#cc000000</color>
 </resources>