From d2e34fedef4f2211ae315a879cd09ed361e35599 Mon Sep 17 00:00:00 2001 From: Pavol Beskid Date: Sun, 15 Oct 2023 18:37:48 +0200 Subject: [PATCH] SubtitleEditor: download button for subtitle; updated some locales for button title and tooltip --- src/i18n/locales/cs-CZ.json | 6 +++++ src/i18n/locales/de-DE.json | 10 ++++---- src/i18n/locales/el-GR.json | 6 +++++ src/i18n/locales/en-US.json | 2 ++ src/i18n/locales/es-ES.json | 6 +++++ src/i18n/locales/fr-FR.json | 6 +++++ src/i18n/locales/nl-NL.json | 6 +++++ src/i18n/locales/zh-CN.json | 6 +++++ src/i18n/locales/zh-TW.json | 6 +++++ src/main/SubtitleEditor.tsx | 47 ++++++++++++++++++++++++++++++++++--- 10 files changed, 94 insertions(+), 7 deletions(-) diff --git a/src/i18n/locales/cs-CZ.json b/src/i18n/locales/cs-CZ.json index 650c68e89..d7fe518b8 100644 --- a/src/i18n/locales/cs-CZ.json +++ b/src/i18n/locales/cs-CZ.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Video duration", "duration-aria": "Duration", "time-aria": "Current time", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "A problem occurred during communication with Opencast.", "loadError-text": "An error has occurred loading this video.", "durationError-text": "Opencast failed to provide the video duration.", @@ -228,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 4f8d3a6e6..84b72029e 100644 --- a/src/i18n/locales/de-DE.json +++ b/src/i18n/locales/de-DE.json @@ -37,10 +37,10 @@ "time-duration-tooltip": "Videodauer", "duration-aria": "Dauer", "time-aria": "Aktuelle Zeit", - "mutebutton-tooltip": "Video stummschalten", - "unmutebutton-tooltip": "Stummschaltung aufheben", - "volume-tooltip": "Lautstärke: {{current}}%", - "volumeSlider-aria": "Anpassen der Videolautstärke.", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "Bei der Kommunikation mit Opencast ist ein Problem aufgetreten.", "loadError-text": "Beim Laden des Videos ist ein Fehler aufgetreten.", "durationError-text": "Opencast konnte die Video-Dauer nicht angeben.", @@ -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 4f82b4521..473026734 100644 --- a/src/i18n/locales/el-GR.json +++ b/src/i18n/locales/el-GR.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Διάρκεια βίντεο", "duration-aria": "Διάρκεια", "time-aria": "Τρέχουσα ώρα", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "Προέκυψε πρόβλημα κατά την επικοινωνία με το Opencast.", "loadError-text": "Παρουσιάστηκε σφάλμα κατά τηn φόρτωση του βίντεο.", "durationError-text": "Opencast failed to provide the video duration.", @@ -228,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 861087f15..ff7eceb65 100644 --- a/src/i18n/locales/es-ES.json +++ b/src/i18n/locales/es-ES.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Duración del vídeo", "duration-aria": "Duración", "time-aria": "Tiempo actual", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "Se ha producido un error al establecer comunicación con Opencast.", "loadError-text": "Ocurrió un error al cargar el video.", "durationError-text": "Opencast falló al proporcionar la duracion del vídeo.", @@ -228,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 2ad8199c7..fbb34ed35 100644 --- a/src/i18n/locales/fr-FR.json +++ b/src/i18n/locales/fr-FR.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Video duration", "duration-aria": "Durée", "time-aria": "Temps actuel", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "Un problème est survenu lors de la communication avec Opencast.", "loadError-text": "Une erreur s'est produite lors du chargement de cette vidéo.", "durationError-text": "Opencast failed to provide the video duration.", @@ -228,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 d8c442d61..fe2d17eb1 100644 --- a/src/i18n/locales/nl-NL.json +++ b/src/i18n/locales/nl-NL.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Video duration", "duration-aria": "Duur", "time-aria": "Actuele tijd", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "Er is een probleem opgetreden tijdens de communicatie met Opencast.", "loadError-text": "Er is een fout opgetreden tijdens het laden van deze video.", "durationError-text": "Opencast failed to provide the video duration.", @@ -228,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 084532152..f8e63508b 100644 --- a/src/i18n/locales/zh-CN.json +++ b/src/i18n/locales/zh-CN.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Video duration", "duration-aria": "Duration", "time-aria": "Current time", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "A problem occurred during communication with Opencast.", "loadError-text": "An error has occurred loading this video.", "durationError-text": "Opencast failed to provide the video duration.", @@ -228,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 807779ab7..54076927c 100644 --- a/src/i18n/locales/zh-TW.json +++ b/src/i18n/locales/zh-TW.json @@ -37,6 +37,10 @@ "time-duration-tooltip": "Video duration", "duration-aria": "持續時間", "time-aria": "目前時間", + "mutebutton-tooltip": "Mute video", + "unmutebutton-tooltip": "Unmute video", + "volume-tooltip": "Adjust volume: {{current}}%", + "volumeSlider-aria": "Adjust the volume level of the video.", "comError-text": "與 Opencast 通訊時出現問題。", "loadError-text": "載入此影片時出現錯誤。", "durationError-text": "Opencast failed to provide the video duration.", @@ -228,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