fix: subtitles turn off when navigating to new video even if it has subtitles

aminnausin · aminnausin · commit f35937b2214a · 2026-01-10T17:25:36.000-05:00
diff --git a/resources/js/components/video/VideoPlayer.vue b/resources/js/components/video/VideoPlayer.vue
@@ -383,7 +383,9 @@ const initVideoPlayer = async () => {
         togglePictureInPicture();
     }
 
-    playerSubtitles.value?.resetSubtitles();
+    if (playerSubtitles.value?.isShowingSubtitles)
+        playerSubtitles.value.handleSubtitles(stateVideo.value?.subtitles[0]); // If currently showing, reset to default track or blank if none exists
+    else playerSubtitles.value?.clearSubtitles(); // Otherwise clear
 
     isLooping.value = false;
     currentSpeed.value = 1;
diff --git a/resources/js/components/video/subtitles/PlayerSubtitles.vue b/resources/js/components/video/subtitles/PlayerSubtitles.vue
@@ -35,7 +35,7 @@ const subtitlesPopover = useTemplateRef('subtitles-popover');
 
 const playerSubtitleItems = computed(() => {
     const items: PopoverItem[] = stateVideo.value.subtitles.map((track) => {
-        const isCurrentTrack = isShowingSubtitles.value && currentSubtitleTrack.value?.id === track.id;
+        const isCurrentTrack = isShowingSubtitles.value && currentSubtitleTrack.value?.track_id === track.track_id;
         return {
             icon: LucideCaptions,
             text: `${track.language} (${track.codec})`,
@@ -54,7 +54,7 @@ const playerSubtitleItems = computed(() => {
         selected: !isShowingSubtitles.value,
         selectedIcon: ProiconsCheckmark,
         selectedIconStyle: 'text-primary',
-        action: resetSubtitles,
+        action: clearSubtitles,
     };
 
     return [subtitlesOff, ...items];
@@ -66,7 +66,9 @@ const playerSubtitleItems = computed(() => {
  * @param track -> Defaults to first available subtitle only if not currently showing anything
  */
 const handleSubtitles = (track?: SubtitleResource) => {
-    if (!track && !isShowingSubtitles.value) track = stateVideo.value.subtitles[0];
+    if (!track && !isShowingSubtitles.value) {
+        track = stateVideo.value.subtitles[0];
+    }
 
     isShowingSubtitles.value = !!track;
     subtitlesPopover.value?.handleClose();
@@ -83,20 +85,18 @@ const handleSubtitles = (track?: SubtitleResource) => {
 };
 
 /**
- * Clear Subtitles
+ * Set subtitles to blank.
  */
-const resetSubtitles = () => {
-    if (isShowingSubtitles.value) handleSubtitles();
-    else {
-        currentSubtitleTrack.value = undefined;
-        subtitlesPopover.value?.handleClose();
-    }
+const clearSubtitles = () => {
+    currentSubtitleTrack.value = undefined;
+    isShowingSubtitles.value = false;
+    subtitlesPopover.value?.handleClose();
 };
 //#endregion
 
 defineExpose({
     handleSubtitles,
-    resetSubtitles,
+    clearSubtitles,
     isShowingSubtitles,
     currentSubtitleTrack,
 });

Original file line number	Diff line number	Diff line change
`@@ -383,7 +383,9 @@ const initVideoPlayer = async () => {`
`383`	`383`	`togglePictureInPicture();`
`384`	`384`	`}`
`385`	`385`
`386`		`- playerSubtitles.value?.resetSubtitles();`
	`386`	`+ if (playerSubtitles.value?.isShowingSubtitles)`
	`387`	`+ playerSubtitles.value.handleSubtitles(stateVideo.value?.subtitles[0]); // If currently showing, reset to default track or blank if none exists`
	`388`	`+ else playerSubtitles.value?.clearSubtitles(); // Otherwise clear`
`387`	`389`
`388`	`390`	`isLooping.value = false;`
`389`	`391`	`currentSpeed.value = 1;`