BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Prevent viewers from playing before video has loaded for presenter

Browse Source
This commit is contained in:
Lucas Zawacki 2019-10-07 15:42:01 -03:00
parent 290cd481e5
commit ec88bd24e4
1 changed files with 33 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
bigbluebutton-html5/imports/ui/components/external-video-player/component.jsx
View File

@ -56,6 +56,7 @@ class VideoPlayer extends Component {
this.registerVideoListeners = this.registerVideoListeners.bind(this); this.registerVideoListeners = this.registerVideoListeners.bind(this);
this.autoPlayBlockDetected = this.autoPlayBlockDetected.bind(this); this.autoPlayBlockDetected = this.autoPlayBlockDetected.bind(this);
this.clearVideoListeners = this.clearVideoListeners.bind(this); this.clearVideoListeners = this.clearVideoListeners.bind(this);
this.handleFirstPlay = this.handleFirstPlay.bind(this);
this.handleResize = this.handleResize.bind(this); this.handleResize = this.handleResize.bind(this);
this.handleOnReady = this.handleOnReady.bind(this); this.handleOnReady = this.handleOnReady.bind(this);
this.handleOnPlay = this.handleOnPlay.bind(this); this.handleOnPlay = this.handleOnPlay.bind(this);
@ -100,6 +101,19 @@ class VideoPlayer extends Component {
this.setState({autoPlayBlocked: true}); this.setState({autoPlayBlocked: true});
} }
handleFirstPlay() {
const isPresenter = this.props;
if (!this.state.hasPlayedBefore) {
this.setState({ hasPlayedBefore: true, autoPlayBlocked: false });
clearTimeout(this.autoPlayTimeout);
if (isPresenter) {
sendMessage('presenterReady');
}
}
}
getCurrentPlaybackRate() { getCurrentPlaybackRate() {
const intPlayer = this.player.getInternalPlayer(); const intPlayer = this.player.getInternalPlayer();
@ -146,6 +160,13 @@ class VideoPlayer extends Component {
sendMessage('playerUpdate', { rate, time: curTime, state: this.state.playing }); sendMessage('playerUpdate', { rate, time: curTime, state: this.state.playing });
}, SYNC_INTERVAL_SECONDS * 1000); }, SYNC_INTERVAL_SECONDS * 1000);
onMessage('viewerJoined', () => {
logger.debug({ logCode: 'external_video_viewer_joined' }, 'Viewer joined external video');
if (this.state.hasPlayedBefore) {
sendMessage('presenterReady');
}
});
} else { } else {
onMessage('play', ({ time }) => { onMessage('play', ({ time }) => {
if (!this.player || !this.state.hasPlayedBefore) { if (!this.player || !this.state.hasPlayedBefore) {
@ -168,6 +189,14 @@ class VideoPlayer extends Component {
logger.debug({ logCode: 'external_video_client_stop' }, 'Stop external video'); logger.debug({ logCode: 'external_video_client_stop' }, 'Stop external video');
}); });
onMessage('presenterReady', (data) => {
logger.debug({ logCode: 'external_video_presenter_ready' }, 'Presenter is ready to sync');
if (!this.state.hasPlayedBefore) {
this.setState({playing: true});
}
});
onMessage('playerUpdate', (data) => { onMessage('playerUpdate', (data) => {
if (!this.player || !this.state.hasPlayedBefore) { if (!this.player || !this.state.hasPlayedBefore) {
return; return;
@ -205,13 +234,13 @@ class VideoPlayer extends Component {
if (!isPresenter) { if (!isPresenter) {
sendMessage('viewerJoined'); sendMessage('viewerJoined');
} else {
this.setState({ playing: true });
} }
this.handleResize(); this.handleResize();
this.autoPlayTimeout = setTimeout(this.autoPlayBlockDetected, AUTO_PLAY_BLOCK_DETECTION_TIMEOUT_SECONDS * 1000); this.autoPlayTimeout = setTimeout(this.autoPlayBlockDetected, AUTO_PLAY_BLOCK_DETECTION_TIMEOUT_SECONDS * 1000);
this.setState({ playing: true });
} }
handleOnPlay() { handleOnPlay() {
@ -223,10 +252,7 @@ class VideoPlayer extends Component {
} }
this.setState({ playing: true }); this.setState({ playing: true });
if (!this.state.hasPlayedBefore) { this.handleFirstPlay();
this.setState({ hasPlayedBefore: true, autoPlayBlocked: false });
clearTimeout(this.autoPlayTimeout);
}
} }
handleOnPause() { handleOnPause() {
@ -238,10 +264,7 @@ class VideoPlayer extends Component {
} }
this.setState({ playing: false }); this.setState({ playing: false });
if (!this.state.hasPlayedBefore) { this.handleFirstPlay();
this.setState({ hasPlayedBefore: true, autoPlayBlocked: false });
clearTimeout(this.autoPlayTimeout);
}
} }
render() { render() {