84 lines
1.9 KiB
JavaScript
84 lines
1.9 KiB
JavaScript
import React from 'react';
|
|
import { useNavigate } from 'react-router-dom';
|
|
|
|
import { Trans } from '@lingui/macro';
|
|
import Button from '@mui/material/Button';
|
|
import Grid from '@mui/material/Grid';
|
|
import Typography from '@mui/material/Typography';
|
|
|
|
import BoxText from '../BoxText';
|
|
import Checkbox from '../Checkbox';
|
|
|
|
function init(settings) {
|
|
const initSettings = {
|
|
enable: false,
|
|
...settings,
|
|
};
|
|
|
|
return initSettings;
|
|
}
|
|
|
|
export default function Control(props) {
|
|
const navigate = useNavigate();
|
|
const settings = init(props.settings);
|
|
|
|
// Set the defaults
|
|
React.useEffect(() => {
|
|
props.onChange(settings, true);
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
}, []);
|
|
|
|
const handleChange = (what) => (event) => {
|
|
const value = event.target.value;
|
|
|
|
if (['enable'].includes(what)) {
|
|
settings[what] = !settings[what];
|
|
} else {
|
|
settings[what] = value;
|
|
}
|
|
|
|
props.onChange(settings, false);
|
|
};
|
|
|
|
return (
|
|
<Grid container spacing={2}>
|
|
{props.enabled && (
|
|
<Grid item xs={12}>
|
|
<Checkbox
|
|
label={<Trans>Enable</Trans>}
|
|
checked={settings.enable}
|
|
disabled={!props.enabled && settings.enable !== true}
|
|
onChange={handleChange('enable')}
|
|
/>
|
|
<Typography variant="caption">
|
|
<Trans>Make the channel available as an RTMP stream (experimental).</Trans>
|
|
</Typography>
|
|
</Grid>
|
|
)}
|
|
{!props.enabled && (
|
|
<Grid item xs={12}>
|
|
<BoxText textAlign="center">
|
|
<Trans>The RTMP output requires the RTMP Server.</Trans>
|
|
<Button
|
|
variant="outlined"
|
|
size="small"
|
|
style={{ marginTop: 10, marginBottom: 3 }}
|
|
fullWidth
|
|
color="primary"
|
|
onClick={() => navigate('/settings/rtmp')}
|
|
>
|
|
<Trans>Enable now</Trans>
|
|
</Button>
|
|
</BoxText>
|
|
</Grid>
|
|
)}
|
|
</Grid>
|
|
);
|
|
}
|
|
|
|
Control.defaulProps = {
|
|
settings: {},
|
|
enabled: false,
|
|
onChange: function (settings, automatic) {},
|
|
};
|