diff --git a/src/misc/coders/settings/Video.js b/src/misc/coders/settings/Video.js index 5aacc1c..71b786d 100644 --- a/src/misc/coders/settings/Video.js +++ b/src/misc/coders/settings/Video.js @@ -219,10 +219,6 @@ function Height(props) { { value: '360', label: '360' }, ]; - if (props.allowNone === true) { - height.unshift({ value: 'none', label: 'none' }); - } - if (props.allowCustom === true) { height.push({ value: 'custom', label: i18n._(t`Custom ...`) }); } @@ -235,7 +231,6 @@ function Height(props) { value={props.value} onChange={props.onChange} variant={props.variant} - allowNone={props.allowNone} allowCustom={props.allowCustom} /> ); @@ -250,6 +245,49 @@ Height.defaultProps = { onChange: function (event) {}, }; +function Width(props) { + const { i18n } = useLingui(); + const width = [ + { value: '7680', label: '7680' }, + { value: '5120', label: '5120' }, + { value: '4096', label: '4096' }, + { value: '3840', label: '3840' }, + { value: '3200', label: '3200' }, + { value: '2560', label: '2560' }, + { value: '2048', label: '2048' }, + { value: '1920', label: '1920' }, + { value: '1600', label: '1600' }, + { value: '1280', label: '1280' }, + { value: '960', label: '960' }, + { value: '640', label: '640' }, + ]; + + if (props.allowCustom === true) { + width.push({ value: 'custom', label: i18n._(t`Custom ...`) }); + } + + return ( + + ); +} + +Width.defaultProps = { + allowNone: false, + allowCustom: false, + variant: 'outlined', + label: Width, + customLabel: Custom size, + onChange: function (event) {}, +}; + function Format(props) { const { i18n } = useLingui(); const sizes = [ @@ -295,6 +333,7 @@ export default { Framerate, Profile, Size, + Width, Height, Format, }; diff --git a/src/misc/filters/video/Scale.js b/src/misc/filters/video/Scale.js index 49f7859..482ef9d 100644 --- a/src/misc/filters/video/Scale.js +++ b/src/misc/filters/video/Scale.js @@ -2,7 +2,9 @@ import React from 'react'; import { Trans } from '@lingui/macro'; import Grid from '@mui/material/Grid'; +import MenuItem from '@mui/material/MenuItem'; +import Select from '../../Select'; import Video from '../../coders/settings/Video'; // Scale Filter @@ -10,7 +12,10 @@ import Video from '../../coders/settings/Video'; function init(initialState) { const state = { - value: 'none', + mode: 'none', + fix: '1280x720', + width: '1280', + height: '720', ...initialState, }; @@ -22,13 +27,33 @@ function createGraph(settings) { const mapping = []; - if (settings.value !== 'none') { - mapping.push(`scale=-1:${settings.value}`); + if (settings.mode === 'height') { + mapping.push(`scale=-1:${settings.height}`); + } else if (settings.mode === 'width') { + mapping.push(`scale=${settings.width}:-1`); + } else if (settings.mode === 'fix') { + mapping.push(`scale=${settings.fix}`); } return mapping.join(','); } +function Mode(props) { + return ( + + ); +} + +Mode.defaultProps = { + value: '', + onChange: function (event) {}, +}; + function Filter(props) { const settings = init(props.settings); @@ -58,9 +83,24 @@ function Filter(props) { return ( - - Scale by height} value={settings.value} onChange={update('value')}> + + Scale} value={settings.mode} onChange={update('mode')}> + {settings.mode === 'fix' && ( + + Scale size} value={settings.fix} onChange={update('fix')}> + + )} + {settings.mode === 'width' && ( + + Scale size} value={settings.width} onChange={update('width')}> + + )} + {settings.mode === 'height' && ( + + Scale size} value={settings.height} onChange={update('height')}> + + )} ); } @@ -76,7 +116,13 @@ const type = 'video'; const hwaccel = false; function summarize(settings) { - return `${name} (-1:${settings.value})`; + if (settings.mode === 'height') { + return `${name} (-1:${settings.height})`; + } else if (settings.mode === 'width') { + return `${name} (${settings.width}:-1)`; + } else if (settings.mode === 'fix') { + return `${name} (${settings.fix})`; + } } function defaults() {