// @flow import React, { Component } from 'react'; import { Watermarks } from '../../base/react'; import { Captions } from '../../subtitles/'; import { connect } from '../../base/redux'; declare var interfaceConfig: Object; type Props = { /** * Used to determine the value of the autoplay attribute of the underlying * video element. */ _noAutoPlayVideo: boolean } /** * Implements a React {@link Component} which represents the large video (a.k.a. * the conference participant who is on the local stage) on Web/React. * * @extends Component */ class LargeVideo extends Component { /** * Implements React's {@link Component#render()}. * * @inheritdoc * @returns {React$Element} */ render() { return (
{/* * FIXME: the architecture of elements related to the large * video and the naming. The background is not part of * largeVideoWrapper because we are controlling the size of * the video through largeVideoWrapper. That's why we need * another container for the background and the * largeVideoWrapper in order to hide/show them. */}
{ interfaceConfig.DISABLE_TRANSCRIPTION_SUBTITLES || }
); } } /** * Maps (parts of) the Redux state to the associated LargeVideo props. * * @param {Object} state - The Redux state. * @private * @returns {{ * _noAutoPlayVideo: boolean * }} */ function _mapStateToProps(state) { const testingConfig = state['features/base/config'].testing; return { _noAutoPlayVideo: testingConfig?.noAutoPlayVideo }; } export default connect(_mapStateToProps)(LargeVideo);