jiti-meet/react/features/overlay/components/OverlayContainer.js

289 lines
8.0 KiB
JavaScript

/* global interfaceConfig */
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { CallOverlay } from '../../base/jwt';
import PageReloadFilmstripOnlyOverlay from './PageReloadFilmstripOnlyOverlay';
import PageReloadOverlay from './PageReloadOverlay';
import SuspendedFilmstripOnlyOverlay from './SuspendedFilmstripOnlyOverlay';
import SuspendedOverlay from './SuspendedOverlay';
import UserMediaPermissionsFilmstripOnlyOverlay
from './UserMediaPermissionsFilmstripOnlyOverlay';
import UserMediaPermissionsOverlay from './UserMediaPermissionsOverlay';
/**
* Implements a React Component that will display the correct overlay when
* needed.
*/
class OverlayContainer extends Component {
/**
* OverlayContainer component's property types.
*
* @static
*/
static propTypes = {
/**
* The browser which is used currently.
*
* NOTE: Used by UserMediaPermissionsOverlay only.
*
* @private
* @type {string}
*/
_browser: PropTypes.string,
/**
* The indicator which determines whether the {@link CallOverlay} is
* displayed/visible.
*
* @private
* @type {boolean}
*/
_callOverlayVisible: PropTypes.bool,
/**
* The indicator which determines whether the status of the
* JitsiConnection object has been "established" or not.
*
* NOTE: Used by PageReloadOverlay only.
*
* @private
* @type {boolean}
*/
_connectionEstablished: PropTypes.bool,
/**
* The indicator which determines whether a critical error for reload
* has been received.
*
* NOTE: Used by PageReloadOverlay only.
*
* @private
* @type {boolean}
*/
_haveToReload: PropTypes.bool,
/**
* The indicator which determines whether the GUM permissions prompt is
* displayed or not.
*
* NOTE: Used by UserMediaPermissionsOverlay only.
*
* @private
* @type {boolean}
*/
_isMediaPermissionPromptVisible: PropTypes.bool,
/**
* The indicator which determines whether the reload was caused by
* network failure.
*
* NOTE: Used by PageReloadOverlay only.
*
* @private
* @type {boolean}
*/
_isNetworkFailure: PropTypes.bool,
/**
* The reason for the error that will cause the reload.
*
* NOTE: Used by PageReloadOverlay only.
*
* @private
* @type {string}
*/
_reason: PropTypes.string,
/**
* The indicator which determines whether the GUM permissions prompt is
* displayed or not.
*
* NOTE: Used by SuspendedOverlay only.
*
* @private
* @type {string}
*/
_suspendDetected: PropTypes.bool
};
/**
* Initializes a new ReloadTimer instance.
*
* @param {Object} props - The read-only properties with which the new
* instance is to be initialized.
* @public
*/
constructor(props) {
super(props);
this.state = {
/**
* The indicator which determines whether filmstrip-only mode is
* enabled.
*
* @type {boolean}
*/
filmstripOnly:
typeof interfaceConfig === 'object'
&& interfaceConfig.filmStripOnly
};
}
/**
* Implements React's {@link Component#render()}.
*
* @inheritdoc
* @returns {ReactElement|null}
* @public
*/
render() {
const { filmstripOnly } = this.state;
let overlayComponent, props;
if (this.props._connectionEstablished && this.props._haveToReload) {
overlayComponent
= filmstripOnly
? PageReloadFilmstripOnlyOverlay
: PageReloadOverlay;
props = {
isNetworkFailure: this.props._isNetworkFailure,
reason: this.props._reason
};
} else if (this.props._suspendDetected) {
overlayComponent
= filmstripOnly
? SuspendedFilmstripOnlyOverlay
: SuspendedOverlay;
} else if (this.props._isMediaPermissionPromptVisible) {
overlayComponent
= filmstripOnly
? UserMediaPermissionsFilmstripOnlyOverlay
: UserMediaPermissionsOverlay;
props = {
browser: this.props._browser
};
} else if (this.props._callOverlayVisible) {
overlayComponent = CallOverlay;
}
return (
overlayComponent
? React.createElement(overlayComponent, props)
: null);
}
}
/**
* Maps (parts of) the redux state to the associated OverlayContainer's props.
*
* @param {Object} state - The redux state.
* @returns {{
* _browser: string,
* _callOverlayVisible: boolean,
* _connectionEstablished: boolean,
* _haveToReload: boolean,
* _isNetworkFailure: boolean,
* _isMediaPermissionPromptVisible: boolean,
* _reason: string,
* _suspendDetected: boolean
* }}
* @private
*/
function _mapStateToProps(state) {
const stateFeaturesOverlay = state['features/overlay'];
return {
/**
* The browser which is used currently.
*
* NOTE: Used by {@link UserMediaPermissionsOverlay} only.
*
* @private
* @type {string}
*/
_browser: stateFeaturesOverlay.browser,
/**
* The indicator which determines whether the {@link CallOverlay} is
* displayed/visible.
*
* @private
* @type {boolean}
*/
_callOverlayVisible:
Boolean(state['features/base/jwt'].callOverlayVisible),
/**
* The indicator which determines whether the status of the
* JitsiConnection object has been "established" or not.
*
* NOTE: Used by {@link PageReloadOverlay} only.
*
* @private
* @type {boolean}
*/
_connectionEstablished: stateFeaturesOverlay.connectionEstablished,
/**
* The indicator which determines whether a critical error for reload
* has been received.
*
* NOTE: Used by {@link PageReloadOverlay} only.
*
* @private
* @type {boolean}
*/
_haveToReload: stateFeaturesOverlay.haveToReload,
/**
* The indicator which determines whether the GUM permissions prompt is
* displayed or not.
*
* NOTE: Used by {@link UserMediaPermissionsOverlay} only.
*
* @private
* @type {boolean}
*/
_isMediaPermissionPromptVisible:
stateFeaturesOverlay.isMediaPermissionPromptVisible,
/**
* The indicator which determines whether the reload was caused by
* network failure.
*
* NOTE: Used by {@link PageReloadOverlay} only.
*
* @private
* @type {boolean}
*/
_isNetworkFailure: stateFeaturesOverlay.isNetworkFailure,
/**
* The reason for the error that will cause the reload.
*
* NOTE: Used by {@link PageReloadOverlay} only.
*
* @private
* @type {string}
*/
_reason: stateFeaturesOverlay.reason,
/**
* The indicator which determines whether the GUM permissions prompt is
* displayed or not.
*
* NOTE: Used by {@link SuspendedOverlay} only.
*
* @private
* @type {string}
*/
_suspendDetected: stateFeaturesOverlay.suspendDetected
};
}
export default connect(_mapStateToProps)(OverlayContainer);