mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-08-14 23:57:27 +00:00
parent
fff5316fa7
commit
783698de15
3 changed files with 48 additions and 38 deletions
|
@ -14,6 +14,7 @@
|
|||
"@fortawesome/vue-fontawesome": "^3.0.0-4",
|
||||
"core-js": "^3.13.1",
|
||||
"css-loader": "^5.2.6",
|
||||
"hotkeys-js": "^3.8.5",
|
||||
"register-service-worker": "^1.7.1",
|
||||
"shaka-player": "3.1.0",
|
||||
"uikit": "3.6.22",
|
||||
|
|
|
@ -115,53 +115,57 @@ export default {
|
|||
ui.configure(config);
|
||||
});
|
||||
},
|
||||
onKeyPress(e) {
|
||||
if (document.activeElement.tagName === "INPUT" && document.activeElement.type === "text") return;
|
||||
const videoEl = this.$refs.videoEl;
|
||||
switch (e.code) {
|
||||
case "KeyF":
|
||||
if (document.fullscreenElement) document.exitFullscreen();
|
||||
else this.$refs.container.requestFullscreen();
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "KeyM":
|
||||
videoEl.muted = !videoEl.muted;
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "Space":
|
||||
if (videoEl.paused) videoEl.play();
|
||||
else videoEl.pause();
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "ArrowUp":
|
||||
videoEl.volume = Math.min(videoEl.volume + 0.05, 1);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "ArrowDown":
|
||||
videoEl.volume = Math.max(videoEl.volume - 0.05, 0);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "ArrowLeft":
|
||||
videoEl.currentTime = Math.max(videoEl.currentTime - 5, 0);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "ArrowRight":
|
||||
videoEl.currentTime = videoEl.currentTime + 5;
|
||||
e.preventDefault();
|
||||
break;
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
document.addEventListener("keydown", this.onKeyPress);
|
||||
import("hotkeys-js")
|
||||
.then(mod => mod.default)
|
||||
.then(hotkeys => {
|
||||
this.hotkeys = hotkeys;
|
||||
var self = this;
|
||||
hotkeys("f,m,space,up,down,left,right", function(e, handler) {
|
||||
const videoEl = self.$refs.videoEl;
|
||||
switch (handler.key) {
|
||||
case "f":
|
||||
if (document.fullscreenElement) document.exitFullscreen();
|
||||
else self.$refs.container.requestFullscreen();
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "m":
|
||||
videoEl.muted = !videoEl.muted;
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "space":
|
||||
if (videoEl.paused) videoEl.play();
|
||||
else videoEl.pause();
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "up":
|
||||
videoEl.volume = Math.min(videoEl.volume + 0.05, 1);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "down":
|
||||
videoEl.volume = Math.max(videoEl.volume - 0.05, 0);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "left":
|
||||
videoEl.currentTime = Math.max(videoEl.currentTime - 5, 0);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "right":
|
||||
videoEl.currentTime = videoEl.currentTime + 5;
|
||||
e.preventDefault();
|
||||
break;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
beforeUnmount() {
|
||||
document.removeEventListener("keydown", this.onKeyPress);
|
||||
if (this.player) {
|
||||
this.player.destroy();
|
||||
this.player = undefined;
|
||||
this.ui = undefined;
|
||||
}
|
||||
if (this.hotkeys) this.hotkeys.unbind();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -4511,6 +4511,11 @@ hosted-git-info@^2.1.4:
|
|||
resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.9.tgz#dffc0bf9a21c02209090f2aa69429e1414daf3f9"
|
||||
integrity sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==
|
||||
|
||||
hotkeys-js@^3.8.5:
|
||||
version "3.8.5"
|
||||
resolved "https://registry.yarnpkg.com/hotkeys-js/-/hotkeys-js-3.8.5.tgz#a66030c48b75ceb2f3fc48fd39e7a0b3473a4b19"
|
||||
integrity sha512-beJJ2Y4J6XkSlXlLPOG29BRKxZx3bV0gVi3eUpYdjrecN1i25iqndM/+X1eIDPSeG0XdqSv7Ksek43j5tQrmPQ==
|
||||
|
||||
hpack.js@^2.1.6:
|
||||
version "2.1.6"
|
||||
resolved "https://registry.yarnpkg.com/hpack.js/-/hpack.js-2.1.6.tgz#87774c0949e513f42e84575b3c45681fade2a0b2"
|
||||
|
|
Loading…
Reference in a new issue