LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Added requested event handling changes

Browse source
This commit is contained in:
Akinwale Ariwodola 2017-07-01 22:57:14 +01:00
parent fb3785feed
commit 49900e0cdf
2 changed files with 23 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
ui/js/component/video/internal/play-button.jsx
View file

@ -5,7 +5,12 @@ import Modal from "component/modal";
class VideoPlayButton extends React.PureComponent {
componentDidMount() {
document.addEventListener("keydown", this.onKeyDown.bind(this));
this.keyDownListener = this.onKeyDown.bind(this);
document.addEventListener("keydown", this.keyDownListener);
}
componentWillUnmount() {
document.removeEventListener("keydown", this.keyDownListener);
}
onPurchaseConfirmed() {
@ -15,7 +20,7 @@ class VideoPlayButton extends React.PureComponent {
}
onKeyDown(event) {
if (event.keyCode === 32) {
if ("Space" === event.code) {
event.preventDefault();
this.onWatchClick();
}
@ -56,8 +61,7 @@ class VideoPlayButton extends React.PureComponent {
isLoading ||
fileInfo === undefined ||
(fileInfo === null && (!costInfo || costInfo.cost === undefined));
const icon =
["audio", "video"].indexOf(mediaType) !== -1
const icon = ["audio", "video"].indexOf(mediaType) !== -1
? "icon-play"
: "icon-folder-o";

16
ui/js/component/video/internal/player.jsx
View file

@ -13,6 +13,8 @@ class VideoPlayer extends React.PureComponent {
startedPlaying: false,
unplayable: false,
};
this.togglePlayListener = this.togglePlay.bind(this);
}
componentDidMount() {
@ -33,7 +35,7 @@ class VideoPlayer extends React.PureComponent {
renderMediaCallback.bind(this)
);
document.addEventListener("keydown", this.togglePlay.bind(this));
document.addEventListener("keydown", this.togglePlayListener);
const mediaElement = this.refs.media.children[0];
if (mediaElement) {
mediaElement.addEventListener(
@ -43,13 +45,21 @@ class VideoPlayer extends React.PureComponent {
once: true,
}
);
mediaElement.addEventListener("click", this.togglePlay.bind(this));
mediaElement.addEventListener("click", this.togglePlayListener);
}
}
componentWillUnmount() {
document.removeEventListener("keydown", this.togglePlayListener);
const mediaElement = this.refs.media.children[0];
if (mediaElement) {
mediaElement.removeEventListener("click", this.togglePlayListener);
}
}
togglePlay(event) {
// ignore all events except click and spacebar keydown
if ("keydown" === event.type && event.keyCode !== 32) {
if ("keydown" === event.type && "Space" !== event.code) {
return;
}
event.preventDefault();