Briq
/
multiparty-meeting
7
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #15 from torjusti/feature/full-screen-api 

Use browser FullScreen API for FullView
master
Stefan Otto 2018-07-17 08:37:10 +02:00 committed by GitHub
parent 51de7bb33d e35b8759f6
commit 29f45818b6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/lib/components/FullScreenView.jsx
View File

@ -53,6 +53,7 @@ const FullScreenView = (props) =>
videoTrack={consumer ? consumer.track : null}
videoVisible={consumerVisible}
videoProfile={consumerProfile}
toggleFullscreen={() => toggleConsumerFullscreen(consumer)}
/>
</div>
);

29
app/lib/components/FullView.jsx
View File

@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import Spinner from 'react-spinner';
import fscreen from 'fscreen';
export default class FullView extends React.Component
{
@ -12,6 +13,8 @@ export default class FullView extends React.Component
// Latest received video track.
// @type {MediaStreamTrack}
this._videoTrack = null;
this.video = React.createRef();
}
render()
@ -24,7 +27,7 @@ export default class FullView extends React.Component
return (
<div data-component='FullView'>
<video
ref='video'
ref={this.video}
className={classnames({
hidden : !videoVisible,
loading : videoProfile === 'none'
@ -48,11 +51,26 @@ export default class FullView extends React.Component
const { videoTrack } = this.props;
this._setTracks(videoTrack);
if (fscreen.fullscreenEnabled) {
fscreen.addEventListener('fullscreenchange', this.handleExitFullscreen, false);
fscreen.requestFullscreen(this.video.current);
}
}
componentWillReceiveProps(nextProps)
componentWillUnmount() {
fscreen.removeEventListener('fullscreenchange', this.handleExitFullscreen);
}
handleExitFullscreen = () => {
if (!fscreen.fullscreenElement) {
this.props.toggleFullscreen();
}
};
componentDidUpdate()
{
const { videoTrack } = nextProps;
const { videoTrack } = this.props;
this._setTracks(videoTrack);
}
@ -64,15 +82,12 @@ export default class FullView extends React.Component
this._videoTrack = videoTrack;
const { video } = this.refs;
const video = this.video.current;
if (videoTrack)
{
const stream = new MediaStream;
if (videoTrack)
stream.addTrack(videoTrack);
video.srcObject = stream;
}
else