Toggle video fullscreen on doubleclick.
This commit is contained in:
parent
f0c2fd1f1e
commit
67874045ac
1 changed files with 13 additions and 0 deletions
|
@ -19,6 +19,7 @@ class VideoPlayer extends React.PureComponent {
|
||||||
};
|
};
|
||||||
|
|
||||||
this.togglePlayListener = this.togglePlay.bind(this);
|
this.togglePlayListener = this.togglePlay.bind(this);
|
||||||
|
this.toggleFullScreenVideo = this.toggleFullScreen.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps(nextProps) {
|
componentWillReceiveProps(nextProps) {
|
||||||
|
@ -77,6 +78,7 @@ class VideoPlayer extends React.PureComponent {
|
||||||
changeVolume(mediaElement.volume);
|
changeVolume(mediaElement.volume);
|
||||||
});
|
});
|
||||||
mediaElement.volume = volume;
|
mediaElement.volume = volume;
|
||||||
|
mediaElement.addEventListener('dblclick', this.toggleFullScreenVideo);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -112,6 +114,17 @@ class VideoPlayer extends React.PureComponent {
|
||||||
this.props.doPause();
|
this.props.doPause();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleFullScreen(event) {
|
||||||
|
const mediaElement = this.media.children[0];
|
||||||
|
if (mediaElement) {
|
||||||
|
if (document.webkitIsFullScreen) {
|
||||||
|
document.webkitExitFullscreen();
|
||||||
|
} else {
|
||||||
|
mediaElement.webkitRequestFullScreen();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
togglePlay(event) {
|
togglePlay(event) {
|
||||||
// ignore all events except click and spacebar keydown, or input events in a form control
|
// ignore all events except click and spacebar keydown, or input events in a form control
|
||||||
if (
|
if (
|
||||||
|
|
Loading…
Reference in a new issue