From 07032f28403569398d6933437d7d9c1af5974d07 Mon Sep 17 00:00:00 2001
From: IanDesuyo <59338745+IanDesuyo@users.noreply.github.com>
Date: Sun, 5 Jan 2025 01:49:25 +0800
Subject: [PATCH 1/2] POC for adding translated tracks to YouTube

---
 extension/src/pages/youtube-page.ts | 26 ++++++++++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/extension/src/pages/youtube-page.ts b/extension/src/pages/youtube-page.ts
index c6980172..0920ebf5 100644
--- a/extension/src/pages/youtube-page.ts
+++ b/extension/src/pages/youtube-page.ts
@@ -1,6 +1,8 @@
 import { VideoData } from '@project/common';
 import { trackFromDef } from './util';
 
+const TLANG = 'ja';
+
 declare global {
     interface Window {
         trustedTypes?: any;
@@ -37,6 +39,26 @@ const adaptYtTrack = (track: any) => {
     });
 };
 
+const appendTranslatedTracks = (tracks: any, tlang: string) => {
+    const translatedTracks = [...tracks];
+
+    for (const track of tracks) {
+        // Ignore subtitles that are already in the target language
+        if (track.languageCode !== tlang) {
+            const translatedTrack = { 
+                ...track,
+                languageCode:`${track.languageCode} >> ${tlang}`,
+                baseUrl: `${track.baseUrl}&tlang=${tlang}` // YouTube API param for translation
+            };
+
+            translatedTracks.push(translatedTrack);
+        }
+    }
+    
+
+    return translatedTracks;
+}
+
 document.addEventListener(
     'asbplayer-get-synced-data',
     async () => {
@@ -89,7 +111,7 @@ document.addEventListener(
             }
 
             response.basename = playerContext.videoDetails?.title || document.title;
-            response.subtitles = (playerContext?.captions?.playerCaptionsTracklistRenderer?.captionTracks || []).map(
+            response.subtitles = appendTranslatedTracks(playerContext?.captions?.playerCaptionsTracklistRenderer?.captionTracks || [], TLANG).map(
                 adaptYtTrack
             );
         } catch (error) {
@@ -137,7 +159,7 @@ JSON.parse = function () {
 
     if (typeof tracks === 'object' && Array.isArray(tracks) && typeof value?.videoDetails?.videoId === 'string') {
         const videoId = value.videoDetails.videoId;
-        const subtitles = tracks.map(adaptYtTrack);
+        const subtitles = appendTranslatedTracks(tracks, TLANG).map(adaptYtTrack);
         const basename = value.videoDetails?.title || document.title;
         dataByVideoId[videoId] = {
             subtitles,

From e8d6fadd9c4847345f996cb35b3fa65ae39516cd Mon Sep 17 00:00:00 2001
From: IanDesuyo <59338745+IanDesuyo@users.noreply.github.com>
Date: Sat, 4 Jan 2025 18:23:20 +0000
Subject: [PATCH 2/2] Update language code and name formatting

---
 extension/src/pages/youtube-page.ts | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/extension/src/pages/youtube-page.ts b/extension/src/pages/youtube-page.ts
index 0920ebf5..447680d6 100644
--- a/extension/src/pages/youtube-page.ts
+++ b/extension/src/pages/youtube-page.ts
@@ -45,19 +45,22 @@ const appendTranslatedTracks = (tracks: any, tlang: string) => {
     for (const track of tracks) {
         // Ignore subtitles that are already in the target language
         if (track.languageCode !== tlang) {
-            const translatedTrack = { 
+            const translatedTrack = {
                 ...track,
-                languageCode:`${track.languageCode} >> ${tlang}`,
-                baseUrl: `${track.baseUrl}&tlang=${tlang}` // YouTube API param for translation
+                name: {
+                    simpleText: `${track.name?.simpleText} >> ${tlang}`,
+                    runs: track.name?.runs?.map((run: any) => ({ ...run, text: `${run.text} >> ${tlang}` })),
+                },
+                languageCode: tlang,
+                baseUrl: `${track.baseUrl}&tlang=${tlang}`, // YouTube API param for translation
             };
 
             translatedTracks.push(translatedTrack);
         }
     }
-    
 
     return translatedTracks;
-}
+};
 
 document.addEventListener(
     'asbplayer-get-synced-data',
@@ -111,9 +114,10 @@ document.addEventListener(
             }
 
             response.basename = playerContext.videoDetails?.title || document.title;
-            response.subtitles = appendTranslatedTracks(playerContext?.captions?.playerCaptionsTracklistRenderer?.captionTracks || [], TLANG).map(
-                adaptYtTrack
-            );
+            response.subtitles = appendTranslatedTracks(
+                playerContext?.captions?.playerCaptionsTracklistRenderer?.captionTracks || [],
+                TLANG
+            ).map(adaptYtTrack);
         } catch (error) {
             if (error instanceof Error) {
                 response.error = error.message;