80 lines
2.0 KiB
JavaScript
80 lines
2.0 KiB
JavaScript
// @flow
|
|
|
|
import React, { PureComponent } from 'react';
|
|
|
|
import { AudioSettingsButton, VideoSettingsButton } from '../../../../toolbox';
|
|
|
|
import CopyMeetingUrl from './CopyMeetingUrl';
|
|
import Preview from './Preview';
|
|
|
|
type Props = {
|
|
|
|
/**
|
|
* Children component(s) to be rendered on the screen.
|
|
*/
|
|
children: React$Node,
|
|
|
|
/**
|
|
* Footer to be rendered for the page (if any).
|
|
*/
|
|
footer?: React$Node,
|
|
|
|
/**
|
|
* The name of the participant.
|
|
*/
|
|
name?: string,
|
|
|
|
/**
|
|
* Title of the screen.
|
|
*/
|
|
title: string,
|
|
|
|
/**
|
|
* True if the preview overlay should be muted, false otherwise.
|
|
*/
|
|
videoMuted?: boolean,
|
|
|
|
/**
|
|
* The video track to render as preview (if omitted, the default local track will be rendered).
|
|
*/
|
|
videoTrack?: Object
|
|
}
|
|
|
|
/**
|
|
* Implements a pre-meeting screen that can be used at various pre-meeting phases, for example
|
|
* on the prejoin screen (pre-connection) or lobby (post-connection).
|
|
*/
|
|
export default class PreMeetingScreen extends PureComponent<Props> {
|
|
/**
|
|
* Implements {@code PureComponent#render}.
|
|
*
|
|
* @inheritdoc
|
|
*/
|
|
render() {
|
|
const { name, title, videoMuted, videoTrack } = this.props;
|
|
|
|
return (
|
|
<div
|
|
className = 'premeeting-screen'
|
|
id = 'lobby-screen'>
|
|
<Preview
|
|
name = { name }
|
|
videoMuted = { videoMuted }
|
|
videoTrack = { videoTrack } />
|
|
<div className = 'content'>
|
|
<div className = 'title'>
|
|
{ title }
|
|
</div>
|
|
<CopyMeetingUrl />
|
|
{ this.props.children }
|
|
<div className = 'media-btn-container'>
|
|
<AudioSettingsButton visible = { true } />
|
|
<VideoSettingsButton visible = { true } />
|
|
</div>
|
|
{ this.props.footer }
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|