From 3364f60d32bf88a10373216b98a73d4124c6c9a4 Mon Sep 17 00:00:00 2001
From: Ivan Agosto <ivagosto@protonmail.com>
Date: Sat, 11 May 2024 13:51:16 -0600
Subject: [PATCH] Update exo player with better UX

---
 .../agosto/p2play/ReproductorActivity.kt      | 16 ++++
 .../res/drawable/ic_baseline_settings_24.xml  |  5 +
 .../main/res/layout/activity_reproductor.xml  |  8 +-
 .../res/layout/custom_player_controls.xml     | 92 ++++++++++---------
 4 files changed, 77 insertions(+), 44 deletions(-)
 create mode 100644 app/src/main/res/drawable/ic_baseline_settings_24.xml

diff --git a/app/src/main/java/org/libre/agosto/p2play/ReproductorActivity.kt b/app/src/main/java/org/libre/agosto/p2play/ReproductorActivity.kt
index 0735b8f..fe71c0c 100644
--- a/app/src/main/java/org/libre/agosto/p2play/ReproductorActivity.kt
+++ b/app/src/main/java/org/libre/agosto/p2play/ReproductorActivity.kt
@@ -20,6 +20,7 @@ import androidx.appcompat.app.AppCompatActivity
 import androidx.core.content.ContextCompat
 import androidx.media3.common.MediaItem
 import androidx.media3.common.MediaMetadata
+import androidx.media3.common.Player
 import androidx.media3.exoplayer.DefaultLoadControl
 import androidx.media3.exoplayer.ExoPlayer
 import androidx.media3.exoplayer.upstream.DefaultAllocator
@@ -32,6 +33,7 @@ import kotlinx.android.synthetic.main.comment_component.commentaryBtn
 import kotlinx.android.synthetic.main.comment_component.commentaryLayout
 import kotlinx.android.synthetic.main.comment_component.commentaryText
 import kotlinx.android.synthetic.main.comment_component.userImgCom
+import kotlinx.android.synthetic.main.custom_player_controls.view.exo_controls
 import org.libre.agosto.p2play.adapters.CommentariesAdapter
 import org.libre.agosto.p2play.ajax.Actions
 import org.libre.agosto.p2play.ajax.Comments
@@ -151,9 +153,23 @@ class ReproductorActivity : AppCompatActivity() {
                             .setSeekForwardIncrementMs(10000)
                             .setLoadControl(loadControl).build()
                     }
+
                     player = PlaybackSingleton.player!!
                     exoPlayer.player = player
 
+                    player.addListener(
+                        object : Player.Listener {
+                            override fun onPlaybackStateChanged(playbackState: Int) {
+                                super.onPlaybackStateChanged(playbackState)
+                                if (playbackState == Player.STATE_BUFFERING || playbackState == Player.STATE_IDLE) {
+                                    exoPlayer.exo_controls.visibility = View.INVISIBLE
+                                } else if (playbackState == Player.STATE_READY) {
+                                    exoPlayer.exo_controls.visibility = View.VISIBLE
+                                }
+                            }
+                        }
+                    )
+
                     println("----- video --------")
                     println(videoPlayback.streamingData?.playlistUrl)
 
diff --git a/app/src/main/res/drawable/ic_baseline_settings_24.xml b/app/src/main/res/drawable/ic_baseline_settings_24.xml
new file mode 100644
index 0000000..094732d
--- /dev/null
+++ b/app/src/main/res/drawable/ic_baseline_settings_24.xml
@@ -0,0 +1,5 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:height="24dp" android:tint="#88ffffff" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="@android:color/white" android:pathData="M19.14,12.94c0.04,-0.3 0.06,-0.61 0.06,-0.94c0,-0.32 -0.02,-0.64 -0.07,-0.94l2.03,-1.58c0.18,-0.14 0.23,-0.41 0.12,-0.61l-1.92,-3.32c-0.12,-0.22 -0.37,-0.29 -0.59,-0.22l-2.39,0.96c-0.5,-0.38 -1.03,-0.7 -1.62,-0.94L14.4,2.81c-0.04,-0.24 -0.24,-0.41 -0.48,-0.41h-3.84c-0.24,0 -0.43,0.17 -0.47,0.41L9.25,5.35C8.66,5.59 8.12,5.92 7.63,6.29L5.24,5.33c-0.22,-0.08 -0.47,0 -0.59,0.22L2.74,8.87C2.62,9.08 2.66,9.34 2.86,9.48l2.03,1.58C4.84,11.36 4.8,11.69 4.8,12s0.02,0.64 0.07,0.94l-2.03,1.58c-0.18,0.14 -0.23,0.41 -0.12,0.61l1.92,3.32c0.12,0.22 0.37,0.29 0.59,0.22l2.39,-0.96c0.5,0.38 1.03,0.7 1.62,0.94l0.36,2.54c0.05,0.24 0.24,0.41 0.48,0.41h3.84c0.24,0 0.44,-0.17 0.47,-0.41l0.36,-2.54c0.59,-0.24 1.13,-0.56 1.62,-0.94l2.39,0.96c0.22,0.08 0.47,0 0.59,-0.22l1.92,-3.32c0.12,-0.22 0.07,-0.47 -0.12,-0.61L19.14,12.94zM12,15.6c-1.98,0 -3.6,-1.62 -3.6,-3.6s1.62,-3.6 3.6,-3.6s3.6,1.62 3.6,3.6S13.98,15.6 12,15.6z"/>
+    
+</vector>
diff --git a/app/src/main/res/layout/activity_reproductor.xml b/app/src/main/res/layout/activity_reproductor.xml
index ad370a8..2cc533a 100644
--- a/app/src/main/res/layout/activity_reproductor.xml
+++ b/app/src/main/res/layout/activity_reproductor.xml
@@ -39,6 +39,7 @@
             android:layout_height="match_parent"
             android:background="#000"
             app:use_controller="true"
+            app:show_buffering="always"
             app:controller_layout_id="@layout/custom_player_controls"
             app:player_layout_id="@layout/exo_player_view"/>
     </RelativeLayout>
@@ -73,9 +74,12 @@
                 android:id="@+id/exoPlayer"
                 android:layout_width="match_parent"
                 android:layout_height="205dp"
-                app:use_controller="true"
+                app:auto_show="true"
+                app:show_buffering="always"
                 app:controller_layout_id="@layout/custom_player_controls"
-                app:player_layout_id="@layout/exo_player_view"/>
+                app:surface_type="surface_view"
+                app:use_controller="true"
+                app:repeat_toggle_modes="none"/>
 
             <TextView
                 android:id="@+id/tittleVideoTxt"
diff --git a/app/src/main/res/layout/custom_player_controls.xml b/app/src/main/res/layout/custom_player_controls.xml
index 0da9007..85fd4e1 100644
--- a/app/src/main/res/layout/custom_player_controls.xml
+++ b/app/src/main/res/layout/custom_player_controls.xml
@@ -1,10 +1,23 @@
 <?xml version="1.0" encoding="utf-8"?>
 <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
-    xmlns:tools="http://schemas.android.com/tools"
-    android:background="#aa000000"
+    android:id="@+id/exo_controls"
     android:layout_width="match_parent"
-    android:layout_height="match_parent">
+    android:layout_height="match_parent"
+    android:background="#44000000">
+
+    <ImageView
+        android:id="@+id/exo_settings"
+        android:layout_width="30dp"
+        android:layout_height="30dp"
+        android:layout_gravity="center"
+        android:layout_marginTop="8dp"
+        android:layout_marginEnd="8dp"
+        android:layout_weight="0"
+        android:alpha="0.5"
+        android:src="@drawable/ic_baseline_settings_24"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
 
     <LinearLayout
         android:layout_width="match_parent"
@@ -17,83 +30,78 @@
         app:layout_constraintTop_toTopOf="parent">
 
         <ImageView
-            android:layout_width="48dp"
-            android:layout_height="48dp"
             android:id="@+id/exo_rew"
-            android:src="@drawable/ic_replay_10_24"
-            />
+            android:layout_width="35dp"
+            android:layout_height="35dp"
+            android:src="@drawable/ic_replay_10_24" />
 
         <ImageView
             android:id="@+id/exo_play_pause"
-            android:layout_width="48dp"
-            android:layout_height="48dp"
-            android:layout_marginHorizontal="30dp"/>
+            android:layout_width="43dp"
+            android:layout_height="43dp"
+            android:layout_marginHorizontal="30dp" />
 
         <ImageView
-            android:layout_width="48dp"
-            android:layout_height="48dp"
             android:id="@+id/exo_ffwd"
-            android:src="@drawable/ic_forward_10_24"
-            />
+            android:layout_width="35dp"
+            android:layout_height="35dp"
+            android:src="@drawable/ic_forward_10_24" />
 
     </LinearLayout>
 
     <LinearLayout
+        android:id="@+id/linearLayout4"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_marginStart="0dp"
-        android:layout_marginEnd="0dp"
-        android:layout_marginBottom="0dp"
         android:orientation="vertical"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent">
 
+        <androidx.media3.ui.DefaultTimeBar
+            android:id="@+id/exo_progress"
+            android:layout_width="wrap_content"
+            android:layout_height="10dp"
+            android:layout_weight="1" />
+
         <LinearLayout
             android:layout_width="match_parent"
-            android:layout_height="20dp"
+            android:layout_height="35dp"
+            android:layout_marginStart="8dp"
+            android:layout_marginEnd="8dp"
+            android:gravity="center"
             android:orientation="horizontal">
+
             <TextView
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
                 android:id="@+id/exo_position"
-                android:textColor="#fff"/>
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:textColor="#fff" />
+
             <TextView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
+                android:layout_marginHorizontal="4dp"
                 android:text="/"
-                android:textColor="#CBCDC8"
-                android:layout_marginHorizontal="4dp"/>
+                android:textColor="#CBCDC8" />
+
             <TextView
+                android:id="@+id/exo_duration"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_weight="1"
-                android:id="@+id/exo_duration"
-                android:textColor="#CBCDC8"/>
-        </LinearLayout>
-
-        <LinearLayout
-            android:layout_width="match_parent"
-            android:layout_height="50dp"
-            android:orientation="horizontal">
-
-            <androidx.media3.ui.DefaultTimeBar
-                android:id="@+id/exo_progress"
-                android:layout_width="wrap_content"
-                android:layout_height="match_parent"
-                android:layout_weight="2" />
+                android:textColor="#CBCDC8" />
 
             <ImageView
                 android:id="@+id/exo_fullscreen_custom"
-                android:layout_width="42dp"
+                android:layout_width="35dp"
                 android:layout_height="42dp"
-                android:src="@drawable/ic_fullscreen_24"
+                android:layout_gravity="center"
                 android:layout_weight="0"
-                android:layout_gravity="center"/>
+                android:src="@drawable/ic_fullscreen_24" />
         </LinearLayout>
+
     </LinearLayout>
 
 
-
-
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file