diff --git a/src/i18n/locales/cs-CZ.json b/src/i18n/locales/cs-CZ.json index a4277fd95..d7fe518b8 100644 --- a/src/i18n/locales/cs-CZ.json +++ b/src/i18n/locales/cs-CZ.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Pick a language", "backButton": "Back", "backButton-tooltip": "Return to subtitle selection", + "downloadButton-title": "Download", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Subtitle Editor - {{title}}", "editTitle-loading": "Loading", "generic": "Generic", diff --git a/src/i18n/locales/de-DE.json b/src/i18n/locales/de-DE.json index 4f850368c..84b72029e 100644 --- a/src/i18n/locales/de-DE.json +++ b/src/i18n/locales/de-DE.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Wähle eine Sprache", "backButton": "Zurück", "backButton-tooltip": "Zurück zur Untertitelauswahl", + "downloadButton-title": "Herunterladen", + "downloadButton-tooltip": "Untertitel als VTT-Datei herunterladen", "editTitle": "Untertitel-Editor - {{title}}", "editTitle-loading": "Lädt", "generic": "Unspezifiziert", diff --git a/src/i18n/locales/el-GR.json b/src/i18n/locales/el-GR.json index 124ff2bff..473026734 100644 --- a/src/i18n/locales/el-GR.json +++ b/src/i18n/locales/el-GR.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Επιλέξτε μια γλώσσα", "backButton": "Επιστροφή", "backButton-tooltip": "Επιστροφή στην επιλογή υποτίτλων", + "downloadButton-title": "Κατεβάστε", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Επεξεργαστής υποτίτλων - {{title}}", "editTitle-loading": "Φόρτωση", "generic": "Γενικά", diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json index 3e97194fa..b77a3d038 100644 --- a/src/i18n/locales/en-US.json +++ b/src/i18n/locales/en-US.json @@ -249,6 +249,8 @@ "createSubtitleDropdown-label": "Pick a language", "backButton": "Back", "backButton-tooltip": "Return to subtitle selection", + "downloadButton-title": "Download", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Subtitle Editor - {{title}}", "editTitle-loading": "Loading", "generic": "Generic", diff --git a/src/i18n/locales/es-ES.json b/src/i18n/locales/es-ES.json index 9497ea9e6..ff7eceb65 100644 --- a/src/i18n/locales/es-ES.json +++ b/src/i18n/locales/es-ES.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Seleccione un idioma", "backButton": "Atras", "backButton-tooltip": "Volver a la selección de subtítulos", + "downloadButton-title": "Descargar", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Editor de subtítulos - {{title}}", "editTitle-loading": "Cargando", "generic": "Generico", diff --git a/src/i18n/locales/fr-FR.json b/src/i18n/locales/fr-FR.json index 32ae19a47..fbb34ed35 100644 --- a/src/i18n/locales/fr-FR.json +++ b/src/i18n/locales/fr-FR.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Pick a language", "backButton": "Back", "backButton-tooltip": "Return to subtitle selection", + "downloadButton-title": "Download", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Subtitle Editor - {{title}}", "editTitle-loading": "Loading", "generic": "Generic", diff --git a/src/i18n/locales/nl-NL.json b/src/i18n/locales/nl-NL.json index 67bb8bf69..fe2d17eb1 100644 --- a/src/i18n/locales/nl-NL.json +++ b/src/i18n/locales/nl-NL.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Pick a language", "backButton": "Back", "backButton-tooltip": "Return to subtitle selection", + "downloadButton-title": "Download", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Subtitle Editor - {{title}}", "editTitle-loading": "Loading", "generic": "Generic", diff --git a/src/i18n/locales/zh-CN.json b/src/i18n/locales/zh-CN.json index bd34419f5..f8e63508b 100644 --- a/src/i18n/locales/zh-CN.json +++ b/src/i18n/locales/zh-CN.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Pick a language", "backButton": "Back", "backButton-tooltip": "Return to subtitle selection", + "downloadButton-title": "Download", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Subtitle Editor - {{title}}", "editTitle-loading": "Loading", "generic": "Generic", diff --git a/src/i18n/locales/zh-TW.json b/src/i18n/locales/zh-TW.json index eb2b2cf94..54076927c 100644 --- a/src/i18n/locales/zh-TW.json +++ b/src/i18n/locales/zh-TW.json @@ -232,6 +232,8 @@ "createSubtitleDropdown-label": "Pick a language", "backButton": "Back", "backButton-tooltip": "Return to subtitle selection", + "downloadButton-title": "Download", + "downloadButton-tooltip": "Download subtitle as vtt file", "editTitle": "Subtitle Editor - {{title}}", "editTitle-loading": "Loading", "generic": "Generic", diff --git a/src/main/SubtitleEditor.tsx b/src/main/SubtitleEditor.tsx index c064e313b..8f5f08b74 100644 --- a/src/main/SubtitleEditor.tsx +++ b/src/main/SubtitleEditor.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from "react"; import { css } from "@emotion/react"; import { basicButtonStyle, flexGapReplacementStyle } from "../cssStyles"; -import { LuChevronLeft} from "react-icons/lu"; +import { LuChevronLeft, LuDownload} from "react-icons/lu"; import { selectSubtitlesFromOpencastById, } from '../redux/videoSlice' @@ -17,7 +17,7 @@ import SubtitleVideoArea from "./SubtitleVideoArea"; import SubtitleTimeline from "./SubtitleTimeline"; import { useTranslation } from "react-i18next"; import { useTheme } from "../themes"; -import { parseSubtitle } from "../util/utilityFunctions"; +import { parseSubtitle, serializeSubtitle } from "../util/utilityFunctions"; import { ThemedTooltip } from "./Tooltip"; import { titleStyle, titleStyleBold } from "../cssStyles"; import { generateButtonTitle } from "./SubtitleSelect"; @@ -109,7 +109,7 @@ const SubtitleEditor : React.FC = () => {
{t("subtitles.editTitle", {title: getTitle()})}
-
+
@@ -128,6 +128,47 @@ const SubtitleEditor : React.FC = () => { ); } +const DownloadButton: React.FC = () => { + + const subtitle = useSelector(selectSelectedSubtitleById); + + const downloadSubtitles = () => { + + const vttFile = new Blob([serializeSubtitle(subtitle.cues)], {type: 'text/vtt'}); + + const vttFileLink = window.URL.createObjectURL(vttFile); + const vttHyperLink = document.createElement('a'); + vttHyperLink.setAttribute('href', vttFileLink); + + const vttFileName = generateButtonTitle(subtitle.tags, t).trimEnd(); + vttHyperLink.setAttribute('download', `${vttFileName}.vtt`); + vttHyperLink.click(); + } + + const { t } = useTranslation(); + const theme = useTheme(); + const style = css({ + fontSize: '16px', + height: '10px', + padding: '16px', + justifyContent: 'space-around', + boxShadow: `${theme.boxShadow}`, + background: `${theme.element_bg}`, + }); + + return ( + +
downloadSubtitles()} + > + + {t("subtitles.downloadButton-title")} +
+ + ); +} + /** * Takes you to a different page