lint; clean up; advanced audio settings switch

auto_join_3.3
Stefan Otto 2020-05-19 15:01:38 +02:00
parent d4759ba7fa
commit f17deb2589
4 changed files with 118 additions and 117 deletions

View File

@ -53,6 +53,12 @@ export const toggleShowNotifications = () =>
type : 'TOGGLE_SHOW_NOTIFICATIONS'
});
export const setShowAdvancedAudio = (showAdvancedAudio) =>
({
type : 'SET_SHOW_ADVANCED_AUDIO',
payload : { showAdvancedAudio }
});
export const setEchoCancellation = (echoCancellation) =>
({
type : 'SET_ECHO_CANCELLATION',
@ -73,14 +79,14 @@ export const setNoiseSuppression = (noiseSuppression) =>
export const setVoiceActivatedUnmute = (voiceActivatedUnmute) =>
({
type: 'SET_VOICE_ACTIVATED_UNMUTE',
payload: { voiceActivatedUnmute }
type : 'SET_VOICE_ACTIVATED_UNMUTE',
payload : { voiceActivatedUnmute }
});
export const setNoiseThreshold = (noiseThreshold) =>
({
type: 'SET_NOISE_THRESHOLD',
payload: { noiseThreshold }
type : 'SET_NOISE_THRESHOLD',
payload : { noiseThreshold }
});
export const setDefaultAudio = (audio) =>
@ -89,21 +95,6 @@ export const setDefaultAudio = (audio) =>
payload : { audio }
});
export const toggleEchoCancellation = () =>
({
type : 'TOGGLE_ECHO_CANCELLATION'
});
export const toggleAutoGainControl = () =>
({
type : 'TOGGLE_AUTO_GAIN_CONTROL'
});
export const toggleNoiseSuppression = () =>
({
type : 'TOGGLE_NOISE_SUPPRESSION'
});
export const toggleHiddenControls = () =>
({
type : 'TOGGLE_HIDDEN_CONTROLS'

View File

@ -494,8 +494,10 @@ const Me = (props) =>
>
{ micState === 'on' ?
<MicIcon
color={me.isAutoMuted && settings.voiceActivatedUnmute ? 'secondary' : 'primary'}
style={me.isAutoMuted && settings.voiceActivatedUnmute ? { opacity: noiseVolume }
color={me.isAutoMuted && settings.voiceActivatedUnmute ?
'secondary' : 'primary'}
style={me.isAutoMuted && settings.voiceActivatedUnmute ?
{ opacity: noiseVolume }
: { opacity: 1 }}
/>
:

View File

@ -59,6 +59,7 @@ const styles = (theme) => ({
});
const MediaSettings = ({
setShowAdvancedAudio,
setEchoCancellation,
setAutoGainControl,
setNoiseSuppression,
@ -291,86 +292,105 @@ const MediaSettings = ({
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.echoCancellation} onChange={
<Checkbox checked={settings.showAdvancedAudio} onChange={
(event) =>
{
setEchoCancellation(event.target.checked);
roomClient.changeAudioDevice(settings.selectedAudioDevice);
setShowAdvancedAudio(event.target.checked);
}}
/>}
label={intl.formatMessage({
id : 'settings.echoCancellation',
defaultMessage : 'Echo cancellation'
id : 'settings.showAdvancedAudio',
defaultMessage : 'Show advanced audio settings'
})}
/>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.autoGainControl} onChange={
(event) =>
{
setAutoGainControl(event.target.checked);
roomClient.changeAudioDevice(settings.selectedAudioDevice);
}}
/>}
label={intl.formatMessage({
id : 'settings.autoGainControl',
defaultMessage : 'Auto gain control'
})}
/>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.noiseSuppression} onChange={
(event) =>
{
setNoiseSuppression(event.target.checked);
roomClient.changeAudioDevice(settings.selectedAudioDevice);
}}
/>}
label={intl.formatMessage({
id : 'settings.noiseSuppression',
defaultMessage : 'Noise suppression'
})}
/>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.voiceActivatedUnmute} onChange={
(event) =>
{
setVoiceActivatedUnmute(event.target.checked);
}}
/>}
label={intl.formatMessage({
id : 'settings.voiceActivatedUnmute',
defaultMessage : 'Voice activated unmute'
})}
/>
<div className={classes.margin} />
<Typography gutterBottom>
{
intl.formatMessage({
id : 'settings.noiseThreshold',
defaultMessage : 'Noise threshold:'
})
}
</Typography>
<NoiseSlider className={classnames(classes.slider, classnames.setting)}
key={'noise-threshold-slider'}
min={-100}
value={settings.noiseThreshold}
max={0}
valueLabelDisplay={'off'}
onChange={
(event, value) =>
{
roomClient._setNoiseThreshold(value);
}}
marks={[ { value: volume, label: 'level' } ]}
/>
<div className={classes.margin} />
</form>
{settings.showAdvancedAudio ?
<form className={classes.setting} autoComplete='off'>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.echoCancellation} onChange={
(event) =>
{
setEchoCancellation(event.target.checked);
roomClient.changeAudioDevice(settings.selectedAudioDevice);
}}
/>}
label={intl.formatMessage({
id : 'settings.echoCancellation',
defaultMessage : 'Echo cancellation'
})}
/>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.autoGainControl} onChange={
(event) =>
{
setAutoGainControl(event.target.checked);
roomClient.changeAudioDevice(settings.selectedAudioDevice);
}}
/>}
label={intl.formatMessage({
id : 'settings.autoGainControl',
defaultMessage : 'Auto gain control'
})}
/>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.noiseSuppression} onChange={
(event) =>
{
setNoiseSuppression(event.target.checked);
roomClient.changeAudioDevice(settings.selectedAudioDevice);
}}
/>}
label={intl.formatMessage({
id : 'settings.noiseSuppression',
defaultMessage : 'Noise suppression'
})}
/>
<FormControlLabel
className={classes.setting}
control={
<Checkbox checked={settings.voiceActivatedUnmute} onChange={
(event) =>
{
setVoiceActivatedUnmute(event.target.checked);
}}
/>}
label={intl.formatMessage({
id : 'settings.voiceActivatedUnmute',
defaultMessage : 'Voice activated unmute'
})}
/>
<div className={classes.margin} />
<Typography gutterBottom>
{
intl.formatMessage({
id : 'settings.noiseThreshold',
defaultMessage : 'Noise threshold:'
})
}
</Typography>
<NoiseSlider className={classnames(classes.slider, classnames.setting)}
key={'noise-threshold-slider'}
min={-100}
value={settings.noiseThreshold}
max={0}
valueLabelDisplay={'off'}
onChange={
(event, value) =>
{
roomClient._setNoiseThreshold(value);
}}
marks={[ { value: volume, label: 'level' } ]}
/>
<div className={classes.margin} />
</form>
: null
}
</React.Fragment>
);
};
@ -378,6 +398,7 @@ const MediaSettings = ({
MediaSettings.propTypes =
{
roomClient : PropTypes.any.isRequired,
setShowAdvancedAudio : PropTypes.func.isRequired,
setEchoCancellation : PropTypes.func.isRequired,
setAutoGainControl : PropTypes.func.isRequired,
setNoiseSuppression : PropTypes.func.isRequired,
@ -398,9 +419,10 @@ const mapStateToProps = (state) =>
};
const mapDispatchToProps = {
setShowAdvancedAudio : settingsActions.setShowAdvancedAudio,
setEchoCancellation : settingsActions.setEchoCancellation,
setAutoGainControl : settingsActions.toggleAutoGainControl,
setNoiseSuppression : settingsActions.toggleNoiseSuppression,
setAutoGainControl : settingsActions.setAutoGainControl,
setNoiseSuppression : settingsActions.setNoiseSuppression,
setVoiceActivatedUnmute : settingsActions.setVoiceActivatedUnmute
};

View File

@ -7,6 +7,7 @@ const initialState =
sampleRate : 48000,
channelCount : 1,
volume : 1.0,
showAdvancedAudio : false,
autoGainControl : false,
echoCancellation : true,
noiseSuppression : true,
@ -44,7 +45,7 @@ const settings = (state = initialState, action) =>
{
return { ...state, selectedAudioOutputDevice: action.payload.deviceId };
}
case 'SET_DISPLAY_NAME':
{
const { displayName } = action.payload;
@ -79,6 +80,12 @@ const settings = (state = initialState, action) =>
return { ...state, volume };
}
case 'SET_SHOW_ADVANCED_AUDIO':
{
const { showAdvancedAudio } = action.payload;
return { ...state, showAdvancedAudio };
}
case 'SET_AUTO_GAIN_CONTROL':
{
@ -122,27 +129,6 @@ const settings = (state = initialState, action) =>
return { ...state, audio };
}
case 'TOGGLE_AUTO_GAIN_CONTROL':
{
const autoGainControl = !state.autoGainControl;
return { ...state, autoGainControl };
}
case 'TOGGLE_ECHO_CANCELLATION':
{
const echoCancellation = !state.echoCancellation;
return { ...state, echoCancellation };
}
case 'TOGGLE_NOISE_SUPPRESSION':
{
const noiseSuppression = !state.noiseSuppression;
return { ...state, noiseSuppression };
}
case 'SET_SAMPLE_SIZE':
{
const { sampleSize } = action.payload;