add google translate

ws1993 · Mar 8, 2023 · 9f1145a · 9f1145a
1 parent f4b7742
commit 9f1145a
Show file tree

Hide file tree

Showing 6 changed files with 177 additions and 10 deletions.
diff --git a/components/Header.tsx b/components/Header.tsx
@@ -26,7 +26,7 @@ export default function Header() {
     }
 
     return (
-        <div style={{display:"flex", alignItems:"center", justifyContent:"space-between"}}>
+        <div style={{margin: "0 auto", display:"flex", alignItems:"center", justifyContent:"space-between", maxWidth: "850px"}}>
             <div style={{marginLeft: "10px", marginTop: "10px"}}>
                 <Github width="33" height="33"></Github>
             </div>

diff --git a/lib/lang.ts b/lib/lang.ts
@@ -196,6 +196,104 @@ const suportedLangZh = `
 吴语
 `.trim().split("\n");
 
+const locales = `
+Albanian - sq
+Arabic - ar
+Armenian - hy
+Awadhi - awa
+Azerbaijani - az
+Bashkir - ba
+Basque - eu
+Belarusian - be
+Bengali - bn
+Bhojpuri - bho
+Bosnian - bs
+Brazilian Portuguese - pt-BR
+Bulgarian - bg
+Cantonese (Yue) - yue
+Catalan - ca
+Chhattisgarhi - hne
+Chinese - zh-CN
+Croatian - hr
+Czech - cs
+Danish - da
+Dogri - doi
+Dutch - nl
+English - en
+Estonian - et
+Faroese - fo
+Finnish - fi
+French - fr
+Galician - gl
+Georgian - ka
+German - de
+Greek - el
+Gujarati - gu
+Haryanvi - bgc
+Hindi - hi
+Hungarian - hu
+Indonesian - id
+Irish - ga
+Italian - it
+Japanese - ja
+Javanese - jv
+Kannada - kn
+Kashmiri - ks
+Kazakh - kk
+Konkani - kok
+Korean - ko
+Kyrgyz - ky
+Latvian - lv
+Lithuanian - lt
+Macedonian - mk
+Maithili - mai
+Malay - ms
+Maltese - mt
+Mandarin - zh-CN
+Mandarin Chinese - zh-CN
+Marathi - mr
+Marwari - mwr
+Min Nan - nan
+Moldovan - mo
+Mongolian - mn
+Montenegrin - cnr
+Nepali - ne
+Norwegian - no
+Oriya - or
+Pashto - ps
+Persian (Farsi) - fa
+Polish - pl
+Portuguese - pt
+Punjabi - pa
+Rajasthani - raj
+Romanian - ro
+Russian - ru
+Sanskrit - sa
+Santali - sat
+Serbian - sr
+Sindhi - sd
+Sinhala - si
+Slovak - sk
+Slovene - sl
+Slovenian - sl
+Spanish - es
+Swahili - sw
+Swedish - sv
+Tajik - tg
+Tamil - ta
+Tatar - tt
+Telugu - te
+Thai - th
+Turkish - tr
+Turkmen - tk
+Ukrainian - uk
+Urdu - ur
+Uzbek - uz
+Vietnamese - vi
+Welsh - cy
+Wu - wuu
+`.trim().split("\n").map(line => line.split(" - "));
+
 const commonLangZh = `
 中文
 英语
@@ -222,4 +320,24 @@ const langBiMap = (() => {
     return res;
 })();
 
-export {suportedLang, suportedLangZh, commonLangZh, langBiMap};
+const langLocaleBiMap = (() => {
+    const res = new Map<string, string>();
+    for (const words of locales) {
+        res.set(words[0], words[1]);
+        res.set(words[1], words[0]);
+    }
+    return res;
+})();
+
+function getLocale(lang: string): string | undefined {
+    let res = langLocaleBiMap.get(lang);
+    if (!res) {
+        const lang1 = langBiMap.get(lang);
+        if (lang1) {
+            res = langLocaleBiMap.get(lang1);
+        }
+    }
+    return res;
+}
+
+export {suportedLang, suportedLangZh, commonLangZh, getLocale, langBiMap, langLocaleBiMap};
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -20,6 +20,7 @@
     "eslint": "8.35.0",
     "eslint-config-next": "13.2.3",
     "get-video-id": "^3.6.5",
+    "google-translate-api-x": "^10.5.4",
     "http-proxy-middleware": "^2.0.6",
     "next": "13.2.3",
     "next-i18next": "^13.2.1",

diff --git a/pages/api/googleTran.ts b/pages/api/googleTran.ts
@@ -0,0 +1,37 @@
+import translate from 'google-translate-api-x';
+import { NextFetchEvent, NextRequest, NextResponse } from "next/server";
+import { getLocale } from '@/lib/lang';
+
+// to like "en", "zh-CN"
+async function trans_texts(texts: string[], to: string) {
+    const res = await translate(texts, {to: to});
+    return res.map((item) => item.text);
+}
+
+export const config = {
+    runtime: "edge",
+}
+
+export default async function handler(
+    req: NextRequest,
+    context: NextFetchEvent
+) {
+    const {sentences, targetLang, srcLang} = (await req.json()) as {
+        sentences: string[];
+        targetLang: string;
+        srcLang?: string;
+    }
+    if (!sentences || sentences.length === 0) {
+        return new Response("no subtitles", { status: 500 });
+    }
+
+    try {
+        const resp = await trans_texts(sentences, getLocale(targetLang)!);
+        return NextResponse.json(resp);
+    } catch (error: any) {
+        console.log("API error", error, error.message);
+        return NextResponse.json({
+            errorMessage: error.message,
+        });
+    }
+}
diff --git a/pages/srt.tsx b/pages/srt.tsx
@@ -36,7 +36,7 @@ function curPageNodes(nodes: Node[], curPage: number) {
 
 const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));
 
-async function traslate_all(nodes: Node[], lang: string, apiKey?: string, notifyResult?: any) {
+async function traslate_all(nodes: Node[], lang: string, apiKey?: string, notifyResult?: any, useGoogle?: boolean) {
     const batches: Node[][] = [];
     for (let i = 0; i < nodes.length; i += PAGE_SIZE) {
         batches.push(nodes.slice(i, i + PAGE_SIZE));
@@ -48,7 +48,7 @@ async function traslate_all(nodes: Node[], lang: string, apiKey?: string, notify
         let success = false;
         for (let i = 0; i < MAX_RETRY && !success; i++) {
             try {
-                const r = await translate_one_batch(batch, lang, apiKey);
+                const r = await translate_one_batch(batch, lang, apiKey, useGoogle);
                 results.push(...r);
                 success = true;
                 if (notifyResult) {
@@ -69,7 +69,7 @@ async function traslate_all(nodes: Node[], lang: string, apiKey?: string, notify
     return results;
 }
 
-async function translate_one_batch(nodes: Node[], lang: string, apiKey?: string) {
+async function translate_one_batch(nodes: Node[], lang: string, apiKey?: string, useGoogle?: boolean) {
     const sentences = nodes.map(node => node.content);
     // if last sentence ends with ",", remove it
     const lastSentence = sentences[sentences.length - 1];
@@ -90,7 +90,8 @@ async function translate_one_batch(nodes: Node[], lang: string, apiKey?: string)
     };
 
     console.time("request /api/translate");
-    const res = await fetch('/api/translate', options);
+    const url = useGoogle ? '/api/googleTran': '/api/translate';
+    const res = await fetch(url, options);
     console.timeEnd("request /api/translate");
     const jres = await res.json();
     if (jres.errorMessage) {
@@ -120,6 +121,7 @@ export default function Srt() {
     const [transFileStatus, setTransFileStatus] = useState<TranslateFileStatus>({isTranslating: false, transCount: 0});
     const {t} = useTranslation("common");
     const [langs, setLangs] = useState(commonLangZh);
+    const [useGoogle, setUseGoogle] = useState(true);
     const isEnglish = t("English") === "English";
 
     const getUserKey = () => {
@@ -197,7 +199,7 @@ export default function Srt() {
     const translateFile = async () => {
         setTransFileStatus({isTranslating: true, transCount: 0});
         try {
-            const newnodes = await traslate_all(nodes, getLang(), getUserKey(), on_trans_result);
+            const newnodes = await traslate_all(nodes, getLang(), getUserKey(), on_trans_result, useGoogle);
             //download("output.srt", nodesToSrtText(newnodes));
             toast.success(t("translate file successfully"));
         } catch (e) {
@@ -209,7 +211,7 @@ export default function Srt() {
     const translate = async () => {
         setLoading(true);
         try {
-            const newnodes = await translate_one_batch(curPageNodes(nodes, curPage), getLang(), getUserKey());
+            const newnodes = await translate_one_batch(curPageNodes(nodes, curPage), getLang(), getUserKey(), useGoogle);
             setTransNodes(nodes => {
                 const nodesCopy = [...nodes];
                 for (let i = 0; i < PAGE_SIZE; i++) {
@@ -329,8 +331,8 @@ export default function Srt() {
                         <div style={{color: "gray"}}>{filename ? filename : t("No subtitle selected") }</div>
                         <Subtitles nodes={curPageNodes(nodes, curPage)} transNodes={curPageNodes(transNodes, curPage)} />
                         <div style={{width: "100%", display: "flex", justifyContent: "flex-end", marginTop: "20px", marginRight: "50px" }}>
-                            {!transFileStatus.isTranslating ? <button onClick={translateFile} className={styles.genButton} style={{ height: "30px", marginRight: "20px", width: "100px" }}>{t("Translate-File")}</button> :
-                                <button onClick={translateFile} disabled className={styles.genButton} style={{ height: "30px", marginRight: "20px", width: "100px" }}>
+                            {!transFileStatus.isTranslating ? <button onClick={translateFile} className={styles.genButton} style={{ height: "30px", marginRight: "20px", width: "120px" }}>{t("Translate-File")}</button> :
+                                <button onClick={translateFile} disabled className={styles.genButton} style={{ height: "30px", marginRight: "20px", width: "120px" }}>
                                     <Image src="/loading.svg" alt="Loading..." width={20} height={20} />
                                     {t("Progress")}{transFileStatus.transCount}/{get_page_count()}
                                     </button>