Initial implementation of "Next episode" button in player

app/components/ui/player/Player.vue

@@ -5,6 +5,7 @@ import Hls from "hls.js";
 interface Props {
     urls: any;
     id: string;
+    nextEpisodeButton: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -13,6 +14,23 @@ const props = withDefaults(defineProps<Props>(), {
 const emit = defineEmits(['get-instance'])
 
 const options = computed(() => {
+    const controls = []
+    if (props.nextEpisodeButton) {
+        controls.push(
+            {
+                name: 'next-episode',
+                index: 50,
+                position: 'left',
+                html: '<button>Test</button>',
+                tooltip: 'Next episode',
+                style: {
+                    color: 'red',
+                },
+                click: function () {
+                },
+            },
+        )
+    }
     return {
         url: props.urls[0].url || '',
         type: 'm3u8',
@@ -30,6 +48,7 @@ const options = computed(() => {
         autoOrientation: true,
         autoPlayback: true,
         id: props.id,
+        controls: controls,
     }
 })
 const artplayerRef = ref();