Japanese to Hindi Subtitle Translator

🚨 Oops! Something went wrong.

Please try reloading the page or check your internet connection.

\n );\n }\n\n return <>{children};\n}\n\nfunction VideoTranslatorApp() {\n const [videoUrl, setVideoUrl] = useState(\"https://youtu.be/SRa3c5_PajA\");\n const [translatedSubtitles, setTranslatedSubtitles] = useState([]);\n const [originalSubtitles, setOriginalSubtitles] = useState([]);\n const [sourceLanguage, setSourceLanguage] = useState<\"ja\" | \"en\">(\"ja\");\n const [isLoading, setIsLoading] = useState(false);\n const [error, setError] = useState(null);\n\n const handleTranslate = async () => {\n if (!videoUrl) {\n setError(\"Please enter a valid video URL\");\n return;\n }\n\n const { type, id } = extractVideoInfo(videoUrl);\n if (!id) {\n setError(\"Invalid video URL. Please provide a valid YouTube or Vimeo link.\");\n return;\n }\n\n setIsLoading(true);\n setError(null);\n\n try {\n const { subtitles, language } = await fetchSubtitles(videoUrl);\n setSourceLanguage(language);\n setOriginalSubtitles(subtitles);\n\n const translated = await translateSubtitles(subtitles, language);\n setTranslatedSubtitles(translated);\n } catch (err) {\n console.error(\"Translation error:\", err);\n setError(\"Translation failed. Using default translations.\");\n setTranslatedSubtitles(originalSubtitles);\n } finally {\n setIsLoading(false);\n }\n };\n\n const downloadSubtitles = (type: \"translated\" | \"original\") => {\n const subtitlesToDownload = type === \"translated\" ? translatedSubtitles : originalSubtitles;\n const subtitlesText = subtitlesToDownload.join(\"\\n\\n\");\n const blob = new Blob([subtitlesText], { type: \"text/plain\" });\n const url = URL.createObjectURL(blob);\n const link = document.createElement(\"a\");\n link.href = url;\n link.download = `${type}_subtitles.txt`;\n link.click();\n };\n\n // Trigger translation on initial load\n useEffect(() => {\n handleTranslate();\n }, []);\n\n return (\n \n \n \n \n 🎬 Japanese to Hindi Video Subtitle Translator\n \n\n

\n setVideoUrl(e.target.value)}\n placeholder=\"Enter YouTube or Vimeo Video URL\"\n style={{\n flex: 1,\n padding: \"10px\",\n fontSize: \"16px\",\n borderRadius: \"5px\",\n border: \"1px solid #ddd\",\n }}\n />\n\n \n {isLoading ? \"Translating...\" : \"Translate Subtitles\"}\n \n

\n\n {error && (\n \n {error}\n \n )}\n\n {originalSubtitles.length > 0 && (\n \n \n

\n {sourceLanguage === \"ja\" ? \"🇯🇵 Original Japanese Subtitles\" : \"🇬🇧 Original English Subtitles\"}\n

\n downloadSubtitles(\"original\")}\n style={{\n backgroundColor: \"#2196F3\",\n color: \"white\",\n border: \"none\",\n padding: \"5px 10px\",\n borderRadius: \"5px\",\n cursor: \"pointer\",\n }}\n >\n Download\n \n \n {originalSubtitles.map((subtitle, index) => (\n

{subtitle}

\n ))}\n \n )}\n\n {translatedSubtitles.length > 0 && (\n \n \n

🇮🇳 Translated Hindi Subtitles

\n downloadSubtitles(\"translated\")}\n style={{\n backgroundColor: \"#FF9800\",\n color: \"white\",\n border: \"none\",\n padding: \"5px 10px\",\n borderRadius: \"5px\",\n cursor: \"pointer\",\n }}\n >\n Download\n \n \n {translatedSubtitles.map((subtitle, index) => (\n

{subtitle}

\n ))}\n \n )}\n\n \n 🚨 Note: Subtitle translation is AI-powered and may not be 100% accurate.\n
\n Supports Japanese and English to Hindi translation\n
\n \n View Source Code\n \n

\n \n \n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request) {\n return new Response(\n `\n \n \n Japanese to Hindi Subtitle Translator\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}","deleted","label",[98],"permalink","https://www.val.town/x/GAURAV0182/autoSubtitleApp/code/main.tsx","extension","actionData","errors"]