From f8091b6d14ff200e38a555a2e11e806d1941e775 Mon Sep 17 00:00:00 2001 From: marcobaobao Date: Thu, 12 Jan 2023 21:37:51 +0100 Subject: [PATCH] enabled custom args --- frontend/src/Home.tsx | 37 +++++++++++++++++-- frontend/src/Settings.tsx | 12 ++++++ frontend/src/assets/i18n.yaml | 16 +++++++- .../src/features/settings/settingsSlice.ts | 25 ++++++++----- 4 files changed, 76 insertions(+), 14 deletions(-) diff --git a/frontend/src/Home.tsx b/frontend/src/Home.tsx index c2311ff..4b0eb4b 100644 --- a/frontend/src/Home.tsx +++ b/frontend/src/Home.tsx @@ -47,6 +47,7 @@ export default function Home({ socket }: Props) { const [pickedAudioFormat, setPickedAudioFormat] = useState(''); const [pickedBestFormat, setPickedBestFormat] = useState(''); + const [customArgs, setCustomArgs] = useState(''); const [downloadPath, setDownloadPath] = useState(0); const [availableDownloadPaths, setAvailableDownloadPaths] = useState([]); @@ -68,6 +69,7 @@ export default function Home({ socket }: Props) { useEffect(() => { socket.onopen = () => { dispatch(connected()) + setCustomArgs(localStorage.getItem('last-input-args') ?? '') } }, []) @@ -84,9 +86,6 @@ export default function Home({ socket }: Props) { useEffect(() => { socket.onmessage = (event) => { const res = client.decode(event.data) - - setShowBackdrop(false) - switch (typeof res.result) { case 'object': setActiveDownloads( @@ -101,6 +100,12 @@ export default function Home({ socket }: Props) { } }, []) + useEffect(() => { + if (activeDownloads.length > 0 && showBackdrop) { + setShowBackdrop(false) + } + }, [activeDownloads, showBackdrop]) + useEffect(() => { client.directoryTree() .then(data => { @@ -121,7 +126,7 @@ export default function Home({ socket }: Props) { client.download( immediate || url || workingUrl, - cliArgs.toString() + toFormatArgs(codes), + `${cliArgs.toString()} ${toFormatArgs(codes)} ${customArgs}`, availableDownloadPaths[downloadPath] ?? '', fileNameOverride ) @@ -173,6 +178,15 @@ export default function Home({ socket }: Props) { setFilenameOverride(e.target.value) } + /** + * Update the custom args state whenever the input value changes + * @param e Input change event + */ + const handleCustomArgsChange = (e: React.ChangeEvent) => { + setCustomArgs(e.target.value) + localStorage.setItem("last-input-args", e.target.value) + } + /** * Abort a specific download if id's provided, other wise abort all running ones. * @param id The download id / pid @@ -257,6 +271,21 @@ export default function Home({ socket }: Props) { /> + { + settings.enableCustomArgs ? + + + : + null + } { settings.fileRenaming ? diff --git a/frontend/src/Settings.tsx b/frontend/src/Settings.tsx index bac849a..5e2faad 100644 --- a/frontend/src/Settings.tsx +++ b/frontend/src/Settings.tsx @@ -26,6 +26,7 @@ import { RPCClient } from "./features/core/rpcClient"; import { LanguageUnion, setCliArgs, + setEnableCustomArgs, setFileRenaming, setFormatSelection, setLanguage, @@ -255,6 +256,17 @@ export default function Settings({ socket }: { socket: WebSocket }) { } label={i18n.t('filenameOverrideOption')} /> + { + dispatch(setEnableCustomArgs(!settings.enableCustomArgs)) + }} + /> + } + label={i18n.t('customArgs')} + /> diff --git a/frontend/src/assets/i18n.yaml b/frontend/src/assets/i18n.yaml index 96fadcb..7bdc5af 100644 --- a/frontend/src/assets/i18n.yaml +++ b/frontend/src/assets/i18n.yaml @@ -25,6 +25,8 @@ languages: filenameOverrideOption: Enable output file name overriding customFilename: Custom filemame (leave blank to use default) customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments italian: urlInput: URL di YouTube o di qualsiasi altro servizio supportato statusTitle: Stato @@ -50,6 +52,8 @@ languages: filenameOverrideOption: Abilita sovrascrittura del nome del file di output customFilename: Custom filemame (leave blank to use default) customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments chinese: urlInput: YouTube 或其他受支持服务的视频网址 statusTitle: 状态 @@ -75,6 +79,8 @@ languages: filenameOverrideOption: Enable output file name overriding customFilename: Custom filemame (leave blank to use default) customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments spanish: urlInput: YouTube or other supported service video url statusTitle: Status @@ -100,6 +106,8 @@ languages: filenameOverrideOption: Enable output file name overriding customFilename: Custom filemame (leave blank to use default) customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments russian: urlInput: YouTube or other supported service video url statusTitle: Status @@ -125,6 +133,8 @@ languages: filenameOverrideOption: Enable output file name overriding customFilename: Custom filemame (leave blank to use default) customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments korean: urlInput: YouTube나 다른 지원되는 사이트의 URL statusTitle: 상태 @@ -150,6 +160,8 @@ languages: filenameOverrideOption: Enable output file name overriding customFilename: Custom filemame (leave blank to use default) customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments japanese: urlInput: YouTubeまたはサポート済み動画のURL statusTitle: 状態 @@ -174,4 +186,6 @@ languages: pathOverrideOption: Enable output path overriding filenameOverrideOption: Enable output file name overriding customFilename: Custom filemame (leave blank to use default) - customPath: Custom path \ No newline at end of file + customPath: Custom path + customArgs: Enable custom yt-dlp args (great power = great responsabilities) + customArgsInput: Custom yt-dlp arguments \ No newline at end of file diff --git a/frontend/src/features/settings/settingsSlice.ts b/frontend/src/features/settings/settingsSlice.ts index e0a7cf8..2dcfdd0 100644 --- a/frontend/src/features/settings/settingsSlice.ts +++ b/frontend/src/features/settings/settingsSlice.ts @@ -4,15 +4,16 @@ export type LanguageUnion = "english" | "chinese" | "russian" | "italian" | "spa export type ThemeUnion = "light" | "dark" export interface SettingsState { - serverAddr: string, - serverPort: string, - language: LanguageUnion, - theme: ThemeUnion, - cliArgs: string, - formatSelection: boolean, - ratelimit: string, - fileRenaming: boolean, - pathOverriding: boolean, + serverAddr: string + serverPort: string + language: LanguageUnion + theme: ThemeUnion + cliArgs: string + formatSelection: boolean + ratelimit: string + fileRenaming: boolean + pathOverriding: boolean + enableCustomArgs: boolean } const initialState: SettingsState = { @@ -25,6 +26,7 @@ const initialState: SettingsState = { ratelimit: localStorage.getItem("rate-limit") ?? "", fileRenaming: localStorage.getItem("file-renaming") === "true", pathOverriding: localStorage.getItem("path-overriding") === "true", + enableCustomArgs: localStorage.getItem("enable-custom-args") === "true", } export const settingsSlice = createSlice({ @@ -67,6 +69,10 @@ export const settingsSlice = createSlice({ state.fileRenaming = action.payload localStorage.setItem("file-renaming", action.payload.toString()) }, + setEnableCustomArgs: (state, action: PayloadAction) => { + state.enableCustomArgs = action.payload + localStorage.setItem("enable-custom-args", action.payload.toString()) + }, } }) @@ -80,6 +86,7 @@ export const { setRateLimit, setFileRenaming, setPathOverriding, + setEnableCustomArgs, } = settingsSlice.actions export default settingsSlice.reducer \ No newline at end of file