add toggable options menu

app/src/main/java/com/github/libretube/fragments/PlayerFragment.kt

@@ -276,6 +276,16 @@ class PlayerFragment : Fragment() {
                 .remove(this)
                 .commit()
         }
+        // show the advanced player options
+        playerBinding.toggleOptions.setOnClickListener {
+            if (playerBinding.advancedOptions.isVisible) {
+                playerBinding.toggleOptions.animate().rotationX(0F).setDuration(200).start()
+                playerBinding.advancedOptions.visibility = View.GONE
+            } else {
+                playerBinding.toggleOptions.animate().rotationX(180F).setDuration(200).start()
+                playerBinding.advancedOptions.visibility = View.VISIBLE
+            }
+        }
         binding.playImageView.setOnClickListener {
             paused = if (paused) {
                 binding.playImageView.setImageResource(R.drawable.ic_pause)

app/src/main/java/com/github/libretube/views/CustomExoPlayerView.kt

@@ -4,6 +4,7 @@ import android.annotation.SuppressLint
 import android.content.Context
 import android.util.AttributeSet
 import android.view.MotionEvent
+import android.view.View
 import com.github.libretube.databinding.ExoStyledPlayerControlViewBinding
 import com.google.android.exoplayer2.ui.StyledPlayerView
 
@@ -13,6 +14,12 @@ internal class CustomExoPlayerView(
 ) : StyledPlayerView(context, attributeSet) {
     val binding: ExoStyledPlayerControlViewBinding = ExoStyledPlayerControlViewBinding.bind(this)
 
+    override fun hideController() {
+        super.hideController()
+        binding.toggleOptions.animate().rotationX(0F).start()
+        binding.advancedOptions.visibility = View.GONE
+    }
+
     @SuppressLint("ClickableViewAccessibility")
     override fun onTouchEvent(event: MotionEvent): Boolean {
         when (event.action) {

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

@@ -11,16 +11,22 @@
     <LinearLayout
         android:id="@+id/exo_top_bar"
         android:layout_width="match_parent"
-        android:layout_height="@dimen/exo_styled_bottom_bar_height"
+        android:layout_height="wrap_content"
         android:layout_gravity="top"
-        android:layout_marginBottom="@dimen/exo_styled_bottom_bar_margin_top"
+        android:animateLayoutChanges="true"
+        android:orientation="vertical"
+        android:paddingStart="5dp"
+        android:paddingEnd="10dp">
+
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
             android:layoutDirection="ltr">
 
             <LinearLayout
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center"
-            android:layout_marginStart="5dp"
                 android:layoutDirection="ltr">
 
                 <ImageView
@@ -57,17 +63,8 @@
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_gravity="center"
-            android:layout_marginEnd="10dp"
                 android:layoutDirection="ltr">
 
-            <ImageView
-                android:id="@+id/aspect_ratio_button"
-                style="@style/PlayerControlTop"
-                android:layout_marginTop="-1dp"
-                android:scaleX=".9"
-                android:scaleY=".9"
-                android:src="@drawable/ic_aspect_ratio" />
-
                 <TextView
                     android:id="@+id/speed_text"
                     style="@style/PlayerControlTop"
@@ -78,6 +75,41 @@
                     style="@style/PlayerControlTop"
                     android:text="@string/hls" />
 
+                <ImageButton
+                    android:id="@+id/toggle_options"
+                    style="@style/PlayerControlTop"
+                    android:layout_marginTop="-.5dp"
+                    android:src="@drawable/ic_arrow_down"
+                    app:tint="@android:color/white" />
+
+            </LinearLayout>
+
+        </LinearLayout>
+
+        <LinearLayout
+            android:id="@+id/advanced_options"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="right"
+            android:layout_marginTop="-10dp"
+            android:orientation="horizontal"
+            android:visibility="gone">
+
+            <ImageButton
+                android:id="@id/exo_subtitle"
+                style="@style/PlayerControlBottom" />
+
+            <ImageButton
+                android:id="@+id/repeat_toggle"
+                style="@style/PlayerControlTop"
+                android:src="@drawable/ic_repeat"
+                app:tint="@android:color/darker_gray" />
+
+            <ImageView
+                android:id="@+id/aspect_ratio_button"
+                style="@style/PlayerControlTop"
+                android:src="@drawable/ic_aspect_ratio" />
+
         </LinearLayout>
 
     </LinearLayout>
@@ -150,19 +182,10 @@
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content">
 
-                <ImageButton
-                    android:id="@+id/repeat_toggle"
-                    style="@style/PlayerControlBottom"
-                    android:src="@drawable/ic_repeat"
-                    app:tint="@android:color/darker_gray" />
-
-                <ImageButton
-                    android:id="@id/exo_subtitle"
-                    style="@style/PlayerControlBottom" />
-
                 <ImageButton
                     android:id="@+id/fullscreen"
                     style="@style/PlayerControlBottom"
+                    android:layout_marginEnd="5dp"
                     android:src="@drawable/ic_fullscreen"
                     app:tint="@android:color/white" />
 

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

@@ -379,7 +379,7 @@
             android:id="@+id/doubleTapOverlayLL"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
-            android:layout_marginVertical="50dp">
+            android:layout_marginVertical="60dp">
 
             <!-- double tap rewind btn -->
             <FrameLayout