feat(settings/native): start car mode in low bandwidth mode (#12286)
* feat(settings/native): start car mode in low bandwidth mode
This commit is contained in:
parent
d0c22806ec
commit
ad4707c660
|
@ -1010,6 +1010,7 @@
|
|||
"profileSection": "Profile",
|
||||
"serverURL": "Server URL",
|
||||
"showAdvanced": "Show advanced settings",
|
||||
"startCarModeInLowBandwidthMode": "Start car mode in low bandwidth mode",
|
||||
"startWithAudioMuted": "Start with audio muted",
|
||||
"startWithVideoMuted": "Start with video muted",
|
||||
"terms": "Terms",
|
||||
|
|
|
@ -37,6 +37,7 @@ const DEFAULT_STATE: ISettingsState = {
|
|||
soundsTalkWhileMuted: true,
|
||||
soundsReactions: true,
|
||||
startAudioOnly: false,
|
||||
startCarMode: false,
|
||||
startWithAudioMuted: false,
|
||||
startWithVideoMuted: false,
|
||||
userSelectedAudioOutputDeviceId: undefined,
|
||||
|
@ -74,6 +75,7 @@ export interface ISettingsState {
|
|||
soundsReactions?: boolean;
|
||||
soundsTalkWhileMuted?: boolean;
|
||||
startAudioOnly?: boolean;
|
||||
startCarMode?: boolean;
|
||||
startWithAudioMuted?: boolean;
|
||||
startWithVideoMuted?: boolean;
|
||||
userSelectedAudioOutputDeviceId?: string;
|
||||
|
|
|
@ -60,13 +60,18 @@ type Props = AbstractProps & {
|
|||
*/
|
||||
_aspectRatio: Symbol,
|
||||
|
||||
/**
|
||||
* Whether the audio only is enabled or not.
|
||||
*/
|
||||
_audioOnlyEnabled: boolean,
|
||||
|
||||
/**
|
||||
* Branding styles for conference.
|
||||
*/
|
||||
_brandingStyles: Object,
|
||||
|
||||
/**
|
||||
* Wherther the calendar feature is enabled or not.
|
||||
* Whether the calendar feature is enabled or not.
|
||||
*/
|
||||
_calendarEnabled: boolean,
|
||||
|
||||
|
@ -134,6 +139,11 @@ type Props = AbstractProps & {
|
|||
*/
|
||||
_showLobby: boolean,
|
||||
|
||||
/**
|
||||
* Indicates whether the car mode is enabled.
|
||||
*/
|
||||
_startCarMode: boolean,
|
||||
|
||||
/**
|
||||
* The redux {@code dispatch} function.
|
||||
*/
|
||||
|
@ -142,7 +152,12 @@ type Props = AbstractProps & {
|
|||
/**
|
||||
* Object containing the safe area insets.
|
||||
*/
|
||||
insets: Object
|
||||
insets: Object,
|
||||
|
||||
/**
|
||||
* Default prop for navigating between screen components(React Navigation).
|
||||
*/
|
||||
navigation: Object
|
||||
};
|
||||
|
||||
type State = {
|
||||
|
@ -192,7 +207,17 @@ class Conference extends AbstractConference<Props, State> {
|
|||
* @returns {void}
|
||||
*/
|
||||
componentDidMount() {
|
||||
const {
|
||||
_audioOnlyEnabled,
|
||||
_startCarMode,
|
||||
navigation
|
||||
} = this.props;
|
||||
|
||||
BackHandler.addEventListener('hardwareBackPress', this._onHardwareBackPress);
|
||||
|
||||
if (_audioOnlyEnabled && _startCarMode) {
|
||||
navigation.navigate(screen.conference.carmode);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -536,6 +561,8 @@ function _mapStateToProps(state) {
|
|||
const { isOpen } = state['features/participants-pane'];
|
||||
const { aspectRatio, reducedUI } = state['features/base/responsive-ui'];
|
||||
const { backgroundColor } = state['features/dynamic-branding'];
|
||||
const { startCarMode } = state['features/base/settings'];
|
||||
const { enabled: audioOnlyEnabled } = state['features/base/audio-only'];
|
||||
const participantCount = getParticipantCount(state);
|
||||
const brandingStyles = backgroundColor ? {
|
||||
backgroundColor
|
||||
|
@ -544,6 +571,7 @@ function _mapStateToProps(state) {
|
|||
return {
|
||||
...abstractMapStateToProps(state),
|
||||
_aspectRatio: aspectRatio,
|
||||
_audioOnlyEnabled: Boolean(audioOnlyEnabled),
|
||||
_brandingStyles: brandingStyles,
|
||||
_calendarEnabled: isCalendarEnabled(state),
|
||||
_connecting: isConnecting(state),
|
||||
|
@ -556,6 +584,7 @@ function _mapStateToProps(state) {
|
|||
_reducedUI: reducedUI,
|
||||
_shouldEnableAutoKnock: shouldEnableAutoKnock(state),
|
||||
_showLobby: getIsLobbyVisible(state),
|
||||
_startCarMode: startCarMode,
|
||||
_toolboxVisible: isToolboxVisible(state)
|
||||
};
|
||||
}
|
||||
|
|
|
@ -88,6 +88,11 @@ interface State {
|
|||
*/
|
||||
serverURL: string;
|
||||
|
||||
/**
|
||||
* State variable for start car mode.
|
||||
*/
|
||||
startCarMode: boolean;
|
||||
|
||||
/**
|
||||
* State variable for the start with audio muted switch.
|
||||
*/
|
||||
|
@ -135,6 +140,7 @@ interface Props extends WithTranslation {
|
|||
displayName: string;
|
||||
email: string;
|
||||
serverURL: string;
|
||||
startCarMode: boolean;
|
||||
startWithAudioMuted: boolean;
|
||||
startWithVideoMuted: boolean;
|
||||
};
|
||||
|
@ -185,6 +191,7 @@ class SettingsView extends Component<Props, State> {
|
|||
displayName,
|
||||
email,
|
||||
serverURL,
|
||||
startCarMode,
|
||||
startWithAudioMuted,
|
||||
startWithVideoMuted
|
||||
} = props._settings || {};
|
||||
|
@ -197,6 +204,7 @@ class SettingsView extends Component<Props, State> {
|
|||
displayName,
|
||||
email,
|
||||
serverURL,
|
||||
startCarMode,
|
||||
startWithAudioMuted,
|
||||
startWithVideoMuted
|
||||
};
|
||||
|
@ -213,6 +221,8 @@ class SettingsView extends Component<Props, State> {
|
|||
this._onDisableSelfView = this._onDisableSelfView.bind(this);
|
||||
this._onStartAudioMutedChange
|
||||
= this._onStartAudioMutedChange.bind(this);
|
||||
this._onStartCarmodeInLowBandwidthMode
|
||||
= this._onStartCarmodeInLowBandwidthMode.bind(this);
|
||||
this._onStartVideoMutedChange
|
||||
= this._onStartVideoMutedChange.bind(this);
|
||||
this._setURLFieldReference = this._setURLFieldReference.bind(this);
|
||||
|
@ -250,6 +260,7 @@ class SettingsView extends Component<Props, State> {
|
|||
displayName,
|
||||
email,
|
||||
serverURL,
|
||||
startCarMode,
|
||||
startWithAudioMuted,
|
||||
startWithVideoMuted
|
||||
} = this.state;
|
||||
|
@ -325,6 +336,13 @@ class SettingsView extends Component<Props, State> {
|
|||
theme = { textInputTheme }
|
||||
value = { serverURL } />
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
<FormRow label = 'settingsView.startCarModeInLowBandwidthMode'>
|
||||
<Switch
|
||||
checked = { startCarMode }
|
||||
// @ts-ignore
|
||||
onChange = { this._onStartCarmodeInLowBandwidthMode } />
|
||||
</FormRow>
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
<FormRow
|
||||
label = 'settingsView.startWithAudioMuted'>
|
||||
<Switch
|
||||
|
@ -532,6 +550,23 @@ class SettingsView extends Component<Props, State> {
|
|||
});
|
||||
}
|
||||
|
||||
/** .
|
||||
* Handles car mode in low bandwidth mode.
|
||||
*
|
||||
* @param {boolean} startCarMode - The new value.
|
||||
* @private
|
||||
* @returns {void}
|
||||
*/
|
||||
_onStartCarmodeInLowBandwidthMode(startCarMode: boolean) {
|
||||
this.setState({
|
||||
startCarMode
|
||||
});
|
||||
|
||||
this._updateSettings({
|
||||
startCarMode
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles the disable crash reporting change event.
|
||||
*
|
||||
|
|
|
@ -1,11 +1,15 @@
|
|||
// @flow
|
||||
|
||||
import { toggleAudioOnly } from '../../../base/audio-only';
|
||||
import { setAudioOnly, toggleAudioOnly } from '../../../base/audio-only';
|
||||
import { AUDIO_ONLY_BUTTON_ENABLED, getFeatureFlag } from '../../../base/flags';
|
||||
import { translate } from '../../../base/i18n';
|
||||
import { IconAudioOnly, IconAudioOnlyOff } from '../../../base/icons';
|
||||
import { connect } from '../../../base/redux';
|
||||
import { AbstractButton, type AbstractButtonProps } from '../../../base/toolbox/components';
|
||||
import {
|
||||
navigate
|
||||
} from '../../../mobile/navigation/components/conference/ConferenceNavigationContainerRef';
|
||||
import { screen } from '../../../mobile/navigation/routes';
|
||||
|
||||
/**
|
||||
* The type of the React {@code Component} props of {@link AudioOnlyButton}.
|
||||
|
@ -17,6 +21,11 @@ type Props = AbstractButtonProps & {
|
|||
*/
|
||||
_audioOnly: boolean,
|
||||
|
||||
/**
|
||||
* Indicates whether the car mode is enabled.
|
||||
*/
|
||||
_startCarMode: boolean,
|
||||
|
||||
/**
|
||||
* The redux {@code dispatch} function.
|
||||
*/
|
||||
|
@ -41,8 +50,16 @@ class AudioOnlyButton extends AbstractButton<Props, *> {
|
|||
* @returns {void}
|
||||
*/
|
||||
_handleClick() {
|
||||
this.props.dispatch(toggleAudioOnly());
|
||||
const { _audioOnly, _startCarMode, dispatch } = this.props;
|
||||
|
||||
if (!_audioOnly && _startCarMode) {
|
||||
dispatch(setAudioOnly(true));
|
||||
navigate(screen.conference.carmode);
|
||||
} else {
|
||||
dispatch(toggleAudioOnly());
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Indicates whether this button is in toggled state or not.
|
||||
|
@ -70,10 +87,12 @@ class AudioOnlyButton extends AbstractButton<Props, *> {
|
|||
function _mapStateToProps(state, ownProps): Object {
|
||||
const { enabled: audioOnly } = state['features/base/audio-only'];
|
||||
const enabledInFeatureFlags = getFeatureFlag(state, AUDIO_ONLY_BUTTON_ENABLED, true);
|
||||
const { startCarMode } = state['features/base/settings'];
|
||||
const { visible = enabledInFeatureFlags } = ownProps;
|
||||
|
||||
return {
|
||||
_audioOnly: Boolean(audioOnly),
|
||||
_startCarMode: startCarMode,
|
||||
visible
|
||||
};
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue