From 9d4be2cb55193e217c451226a1fad5f4e1ed82bb Mon Sep 17 00:00:00 2001 From: Jorrin Date: Mon, 8 Apr 2024 16:32:33 +0200 Subject: [PATCH 1/4] Select default audio language based on setting --- src/components/player/display/base.ts | 9 ++++++++- src/stores/player/slices/source.ts | 2 ++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/src/components/player/display/base.ts b/src/components/player/display/base.ts index b1eb616f..ebaa12da 100644 --- a/src/components/player/display/base.ts +++ b/src/components/player/display/base.ts @@ -12,6 +12,7 @@ import { } from "@/components/player/display/displayInterface"; import { handleBuffered } from "@/components/player/utils/handleBuffered"; import { getMediaErrorDetails } from "@/components/player/utils/mediaErrorDetails"; +import { useLanguageStore } from "@/stores/language"; import { LoadableSource, SourceQuality, @@ -83,7 +84,13 @@ export function makeVideoElementDisplayInterface(): DisplayInterface { function reportAudioTracks() { if (!hls) return; - const currentTrack = hls.audioTracks?.[hls.audioTrack ?? 0]; + const currentLanguage = useLanguageStore.getState().language; + const audioTracks = hls.audioTracks; + const languageTrack = audioTracks.find((v) => v.lang === currentLanguage); + if (languageTrack) { + hls.audioTrack = audioTracks.indexOf(languageTrack); + } + const currentTrack = audioTracks?.[hls.audioTrack ?? 0]; if (!currentTrack) return; emit("changedaudiotrack", { id: currentTrack.id.toString(), diff --git a/src/stores/player/slices/source.ts b/src/stores/player/slices/source.ts index eb2ce9e1..5cbfc6db 100644 --- a/src/stores/player/slices/source.ts +++ b/src/stores/player/slices/source.ts @@ -169,6 +169,8 @@ export const createSourceSlice: MakeSlice = (set, get) => ({ s.captionList = captions; s.interface.error = undefined; s.status = playerStatus.PLAYING; + s.audioTracks = []; + s.currentAudioTrack = null; }); const store = get(); store.redisplaySource(startAt); From 2722a7db96e8da69d7a5dd8ae42173986ac87b60 Mon Sep 17 00:00:00 2001 From: Vijay <74645268+vijaysingh2219@users.noreply.github.com> Date: Wed, 10 Apr 2024 21:24:29 +0530 Subject: [PATCH 2/4] Fix keyboard event handling in KeyboardEvents component - Changed the condition from 'k' to 'keyL' for 'j', 'l', 'm', 'f', 'c', 'r' keys to handle uppercase keys properly. - Fixed the condition for toggling play/pause to work with both ' ' and 'k' keys. This commit addresses issues with keyboard event handling and ensures proper functionality with both uppercase and lowercase keys. --- .../player/internals/KeyboardEvents.tsx | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/src/components/player/internals/KeyboardEvents.tsx b/src/components/player/internals/KeyboardEvents.tsx index 3a833e76..af2724c9 100644 --- a/src/components/player/internals/KeyboardEvents.tsx +++ b/src/components/player/internals/KeyboardEvents.tsx @@ -71,9 +71,10 @@ export function KeyboardEvents() { return; const k = evt.key; + const keyL = evt.key.toLowerCase(); // Volume - if (["ArrowUp", "ArrowDown", "m"].includes(k)) { + if (["ArrowUp", "ArrowDown", "m", "M"].includes(k)) { dataRef.current.setShowVolume(true); if (volumeDebounce.current) clearTimeout(volumeDebounce.current); @@ -89,7 +90,7 @@ export function KeyboardEvents() { dataRef.current.setVolume( (dataRef.current.mediaPlaying?.volume || 0) - 0.15, ); - if (k === "m") dataRef.current.toggleMute(); + if (keyL === "m") dataRef.current.toggleMute(); // Video playback speed if (k === ">" || k === "<") { @@ -106,9 +107,9 @@ export function KeyboardEvents() { dataRef.current.display?.setTime(dataRef.current.time + 5); if (k === "ArrowLeft") dataRef.current.display?.setTime(dataRef.current.time - 5); - if (k === "j") + if (keyL === "j") dataRef.current.display?.setTime(dataRef.current.time - 10); - if (k === "l") + if (keyL === "l") dataRef.current.display?.setTime(dataRef.current.time + 10); if (k === "." && dataRef.current.mediaPlaying?.isPaused) dataRef.current.display?.setTime(dataRef.current.time + 1); @@ -116,18 +117,18 @@ export function KeyboardEvents() { dataRef.current.display?.setTime(dataRef.current.time - 1); // Utils - if (k === "f") dataRef.current.display?.toggleFullscreen(); - if (k === " ") + if (keyL === "f") dataRef.current.display?.toggleFullscreen(); + if (k === " " || keyL === "k") dataRef.current.display?.[ dataRef.current.mediaPlaying.isPaused ? "play" : "pause" ](); if (k === "Escape") dataRef.current.router.close(); // captions - if (k === "c") dataRef.current.toggleLastUsed().catch(() => {}); // ignore errors + if (keyL === "c") dataRef.current.toggleLastUsed().catch(() => {}); // ignore errors // Do a barrell roll! - if (k === "r") { + if (keyL === "r") { if (dataRef.current.isRolling || evt.ctrlKey || evt.metaKey) return; dataRef.current.setIsRolling(true); From 5275c56725f07f7f2d5b4e2628b942bca068b87d Mon Sep 17 00:00:00 2001 From: Vijay <74645268+vijaysingh2219@users.noreply.github.com> Date: Wed, 10 Apr 2024 22:26:18 +0530 Subject: [PATCH 3/4] Implement functionality to open URL in new tab on middle click Added handleClick function to check for middle mouse button (event.button === 1), opening the URL in a new tab using window.open. Improves user experience by offering an alternative method to open URLs without leaving the current page. --- src/components/player/base/BackLink.tsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/components/player/base/BackLink.tsx b/src/components/player/base/BackLink.tsx index a965751f..23bcb668 100644 --- a/src/components/player/base/BackLink.tsx +++ b/src/components/player/base/BackLink.tsx @@ -1,3 +1,4 @@ +import React from "react"; import { useTranslation } from "react-i18next"; import { useNavigate } from "react-router-dom"; @@ -7,11 +8,23 @@ export function BackLink(props: { url: string }) { const { t } = useTranslation(); const navigate = useNavigate(); + const handleClick = (event: React.MouseEvent) => { + event.preventDefault(); + // Check if center mouse button is clicked + if (event.button === 1) { + // Open the URL in a new tab + window.open(props.url, "_blank"); + } else { + // Navigate normally for other clicks + navigate(props.url); + } + }; return (
+
); }