marco/yt-dlp-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

removed --no-mtime and -x switches in settings

Browse Source 
Custom templates are powerful: --no-mtime has been set as default behavior (template named default), -x is another template named "audio only"
This commit is contained in:
marcobaobao
2024-06-07 10:08:32 +02:00
parent acac2f41a5
commit 2f0afe27cc
10 changed files with 27 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/atoms/settings.ts
View File

@@ -64,8 +64,7 @@ export const serverAddressState = atom<string>({
export const serverPortState = atom<number>({
key: 'serverPortState',
default: Number(localStorage.getItem('server-port')) ||
Number(window.location.port),
default: Number(localStorage.getItem('server-port')) || Number(window.location.port),
effects: [
({ onSet }) =>
onSet(a => localStorage.setItem('server-port', a.toString()))
@@ -197,7 +196,7 @@ export const cookiesState = atom({
]
})
export const themeSelector = selector<ThemeNarrowed>({
const themeSelector = selector<ThemeNarrowed>({
key: 'themeSelector',
get: ({ get }) => {
const theme = get(themeState)

10
frontend/src/atoms/status.ts
View File

@@ -6,16 +6,6 @@ export const connectedState = atom({
default: false
})
export const updatedBinaryState = atom({
key: 'updatedBinaryState',
default: false
})
export const isDownloadingState = atom({
key: 'isDownloadingState',
default: false
})
export const freeSpaceBytesState = selector({
key: 'freeSpaceBytesState',
get: async ({ get }) => {

8
frontend/src/components/AppBar.tsx
View File

@@ -1,11 +1,11 @@
import { styled } from '@mui/material';
import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar';
import { styled } from '@mui/material'
import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'
interface AppBarProps extends MuiAppBarProps {
open?: boolean
}
const drawerWidth = 240;
const drawerWidth = 240
const AppBar = styled(MuiAppBar, {
shouldForwardProp: (prop) => prop !== 'open',
@@ -23,6 +23,6 @@ const AppBar = styled(MuiAppBar, {
duration: theme.transitions.duration.enteringScreen,
}),
}),
}));
}))
export default AppBar

24
frontend/src/components/DownloadDialog.tsx
View File

@@ -26,19 +26,17 @@ import {
Suspense,
forwardRef,
useEffect,
useMemo,
useRef,
useState,
useTransition
} from 'react'
import { useRecoilState, useRecoilValue } from 'recoil'
import { customArgsState, downloadTemplateState, filenameTemplateState, savedTemplatesState } from '../atoms/downloadTemplate'
import { latestCliArgumentsState, settingsState } from '../atoms/settings'
import { settingsState } from '../atoms/settings'
import { availableDownloadPathsState, connectedState } from '../atoms/status'
import FormatsGrid from '../components/FormatsGrid'
import { useI18n } from '../hooks/useI18n'
import { useRPC } from '../hooks/useRPC'
import { CliArguments } from '../lib/argsParser'
import type { DLMetadata } from '../types'
import { toFormatArgs } from '../utils'
import ExtraDownloadOptions from './ExtraDownloadOptions'
@@ -71,7 +69,6 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
const [pickedBestFormat, setPickedBestFormat] = useState('')
const [customArgs, setCustomArgs] = useRecoilState(customArgsState)
const [, setCliArgs] = useRecoilState(latestCliArgumentsState)
const [downloadPath, setDownloadPath] = useState('')
@@ -83,10 +80,6 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
const [isPlaylist, setIsPlaylist] = useState(false)
const argsBuilder = useMemo(() =>
new CliArguments().fromString(settings.cliArgs), [settings.cliArgs]
)
const { i18n } = useI18n()
const { client } = useRPC()
@@ -112,7 +105,7 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
await new Promise(r => setTimeout(r, 10))
await client.download({
url: immediate || line,
args: `${argsBuilder.toString()} ${toFormatArgs(codes)} ${downloadTemplate}`,
args: `${toFormatArgs(codes)} ${downloadTemplate}`,
pathOverride: downloadPath ?? '',
renameTo: settings.fileRenaming ? filenameTemplate : '',
playlist: isPlaylist,
@@ -327,19 +320,6 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
label={i18n.t('playlistCheckbox')}
/>
</Grid>
<Grid item>
<FormControlLabel
control={
<Checkbox
onChange={() => setCliArgs(argsBuilder.toggleExtractAudio().toString())}
/>
}
checked={argsBuilder.extractAudio}
onChange={() => setCliArgs(argsBuilder.toggleExtractAudio().toString())}
disabled={settings.formatSelection}
label={i18n.t('extractAudioCheckbox')}
/>
</Grid>
</Grid>
<Grid item>
<Button

6
frontend/src/components/ExtraDownloadOptions.tsx
View File

@@ -15,6 +15,12 @@ const ExtraDownloadOptions: React.FC = () => {
disablePortal
options={customTemplates.map(({ name, content }) => ({ label: name, content }))}
autoHighlight
defaultValue={
customTemplates
.filter(({ id, name }) => id === "0" || name === "default")
.map(({ name, content }) => ({ label: name, content }))
.at(0)
}
getOptionLabel={(option) => option.label}
onChange={(_, value) => {
setCustomArgs(value?.content!)

2
frontend/src/components/HomeSpeedDial.tsx
View File

@@ -1,9 +1,9 @@
import AddCircleIcon from '@mui/icons-material/AddCircle'
import BuildCircleIcon from '@mui/icons-material/BuildCircle'
import DeleteForeverIcon from '@mui/icons-material/DeleteForever'
import FolderZipIcon from '@mui/icons-material/FolderZip'
import FormatListBulleted from '@mui/icons-material/FormatListBulleted'
import ViewAgendaIcon from '@mui/icons-material/ViewAgenda'
import FolderZipIcon from '@mui/icons-material/FolderZip'
import {
SpeedDial,
SpeedDialAction,

3
frontend/src/components/Logout.tsx
View File

@@ -1,13 +1,10 @@
import LogoutIcon from '@mui/icons-material/Logout'
import { ListItemButton, ListItemIcon, ListItemText } from '@mui/material'
import { useNavigate } from 'react-router-dom'
import { useRecoilValue } from 'recoil'
import { serverURL } from '../atoms/settings'
import { useI18n } from '../hooks/useI18n'
export default function Logout() {
const navigate = useNavigate()
const url = useRecoilValue(serverURL)
const logout = async () => {
localStorage.removeItem('token')

66
frontend/src/lib/argsParser.ts
View File

@@ -1,66 +0,0 @@
export class CliArguments {
private _extractAudio: boolean
private _noMTime: boolean
constructor(extractAudio = false, noMTime = true) {
this._extractAudio = extractAudio
this._noMTime = noMTime
}
public get extractAudio(): boolean {
return this._extractAudio
}
public toggleExtractAudio() {
this._extractAudio = !this._extractAudio
return this
}
public disableExtractAudio() {
this._extractAudio = false
return this
}
public get noMTime(): boolean {
return this._noMTime
}
public toggleNoMTime() {
this._noMTime = !this._noMTime
return this
}
public toString(): string {
let args = ''
if (this._extractAudio) {
args += '-x '
}
if (this._noMTime) {
args += '--no-mtime '
}
return args.trim()
}
private reset() {
this._extractAudio = false
this._noMTime = false
}
public fromString(str: string): CliArguments {
this.reset()
if (str) {
if (str.includes('-x')) {
this._extractAudio = true
}
if (str.includes('--no-mtime')) {
this._noMTime = true
}
}
return this
}
}

25
frontend/src/views/Settings.tsx
View File

@@ -37,7 +37,6 @@ import {
formatSelectionState,
languageState,
languages,
latestCliArgumentsState,
pathOverridingState,
servedFromReverseProxyState,
servedFromReverseProxySubDirState,
@@ -49,7 +48,6 @@ import CookiesTextField from '../components/CookiesTextField'
import { useToast } from '../hooks/toast'
import { useI18n } from '../hooks/useI18n'
import { useRPC } from '../hooks/useRPC'
import { CliArguments } from '../lib/argsParser'
import { validateDomain, validateIP } from '../utils'
// NEED ABSOLUTELY TO BE SPLIT IN MULTIPLE COMPONENTS
@@ -64,7 +62,6 @@ export default function Settings() {
const [serverAddr, setServerAddr] = useRecoilState(serverAddressState)
const [serverPort, setServerPort] = useRecoilState(serverPortState)
const [cliArgs, setCliArgs] = useRecoilState(latestCliArgumentsState)
const [pollingTime, setPollingTime] = useRecoilState(rpcPollingTimeState)
const [language, setLanguage] = useRecoilState(languageState)
@@ -79,8 +76,6 @@ export default function Settings() {
const { pushMessage } = useToast()
const argsBuilder = useMemo(() => new CliArguments().fromString(cliArgs), [])
const baseURL$ = useMemo(() => new Subject<string>(), [])
const serverAddr$ = useMemo(() => new Subject<string>(), [])
const serverPort$ = useMemo(() => new Subject<string>(), [])
@@ -296,32 +291,12 @@ export default function Settings() {
<Typography variant="h6" color="primary" sx={{ mt: 2, mb: 0.5 }}>
General download settings
</Typography>
<FormControlLabel
control={
<Switch
defaultChecked={argsBuilder.noMTime}
onChange={() => setCliArgs(argsBuilder.toggleNoMTime().toString())}
/>
}
label={i18n.t('noMTimeCheckbox')}
/>
<FormControlLabel
control={
<Switch
defaultChecked={argsBuilder.extractAudio}
onChange={() => setCliArgs(argsBuilder.toggleExtractAudio().toString())}
disabled={formatSelection}
/>
}
label={i18n.t('extractAudioCheckbox')}
/>
<FormControlLabel
control={
<Switch
defaultChecked={formatSelection}
onChange={() => {
setCliArgs(argsBuilder.disableExtractAudio().toString())
setFormatSelection(!formatSelection)
}}
/>