175 lines
4.0 KiB
JavaScript

import React from 'react';
import Grid from '@mui/material/Grid';
import MenuItem from '@mui/material/MenuItem';
import TextField from '@mui/material/TextField';
import { Trans } from '@lingui/macro';
import Select from '../../../Select';
import Video from '../../settings/Video';
function init(initialState) {
const state = {
bitrate: '4096',
fps: '25',
gop: '2',
profile: '77',
rc_mode: '1',
quality: '-1',
...initialState,
};
return state;
}
function createMapping(settings) {
const global = [];
const local = [];
// https://trac.ffmpeg.org/wiki/Hardware/VAAPI
global.push(['-vaapi_device', '/dev/dri/renderD128']);
local.push(
'-vf',
'format=nv12,hwupload',
'-codec:v',
'vp9_vaapi',
'-profile:v',
`${settings.profile}`,
'-quality',
`${settings.quality}`,
'-b:v',
`${settings.bitrate}k`,
'-maxrate',
`${settings.bitrate}k`,
'-bufsize',
`${settings.bitrate}k`,
'-r',
`${settings.fps}`,
'-g',
`${settings.gop}`
);
if (settings.gop !== 'auto') {
local.push('-g', `${Math.round(parseInt(settings.fps) * parseInt(settings.gop)).toFixed(0)}`);
}
return {
global: global,
local: local,
};
}
function RateControl(props) {
return (
<Select label={<Trans>Rate control</Trans>} value={props.value} onChange={props.onChange}>
<MenuItem value="0">auto</MenuItem>
<MenuItem value="1">Constant-quality</MenuItem>
<MenuItem value="2">Constant-bitrate</MenuItem>
<MenuItem value="3">Variable-bitrate</MenuItem>
<MenuItem value="4">Intelligent constant-quality</MenuItem>
<MenuItem value="5">Quality-defined variable-bitrate</MenuItem>
<MenuItem value="6">Average variable-bitrate</MenuItem>
</Select>
);
}
RateControl.defaultProps = {
value: '',
onChange: function (event) {},
};
function Profile(props) {
return (
<Select label={<Trans>Profile</Trans>} value={props.value} onChange={props.onChange}>
<MenuItem value="578">baseline (constrained)</MenuItem>
<MenuItem value="77">main</MenuItem>
<MenuItem value="100">high</MenuItem>
</Select>
);
}
Profile.defaultProps = {
value: '',
onChange: function (event) {},
};
function Coder(props) {
const settings = init(props.settings);
const handleChange = (newSettings) => {
let automatic = false;
if (!newSettings) {
newSettings = settings;
automatic = true;
}
props.onChange(newSettings, createMapping(newSettings), automatic);
};
const update = (what) => (event) => {
const newSettings = {
...settings,
[what]: event.target.value,
};
handleChange(newSettings);
};
React.useEffect(() => {
handleChange(null);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return (
<Grid container spacing={2}>
<Grid item xs={12}>
<RateControl value={settings.rc_mode} onChange={update('rc_mode')} />
</Grid>
<Grid item xs={12} md={6}>
<Video.Bitrate value={settings.bitrate} onChange={update('bitrate')} allowCustom />
</Grid>
<Grid item xs={12} md={6}>
<Video.Framerate value={settings.fps} onChange={update('fps')} allowCustom />
</Grid>
<Grid item xs={12} md={6}>
<Video.GOP value={settings.gop} onChange={update('gop')} allowAuto allowCustom />
</Grid>
<Grid item xs={6}>
<TextField variant="outlined" fullWidth label={<Trans>Quality</Trans>} type="number" value={settings.quality} onChange={update('quality')} />
</Grid>
<Grid item xs={6}>
<Profile value={settings.profile} onChange={update('profile')} />
</Grid>
</Grid>
);
}
Coder.defaultProps = {
stream: {},
settings: {},
onChange: function (settings, mapping) {},
};
const coder = 'vp9_vaapi';
const name = 'VP9 (Intel VAAPI)';
const codec = 'vp9';
const type = 'video';
const hwaccel = true;
function summarize(settings) {
return `${name}, ${settings.bitrate} kbit/s, ${settings.fps} FPS, Profile: ${settings.profile}`;
}
function defaults() {
const settings = init({});
return {
settings: settings,
mapping: createMapping(settings),
};
}
export { coder, name, codec, type, hwaccel, summarize, defaults, Coder as component };