js: add support to detect media keys in keydown handler

See [0] for all the relevant codes.

[0]: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values#Multimedia_keys

Fixes a regression introduced in e6b4e12689.
Fixes https://github.com/omarroth/invidious/issues/712.
This commit is contained in:
Leon Klingele 2019-08-19 12:10:25 +02:00
parent 856ec03cc7
commit e3593fe197
No known key found for this signature in database
GPG key ID: 0C8AF48831EEC211

View file

@ -228,11 +228,24 @@ function set_time_percent(percent) {
player.currentTime(newTime); player.currentTime(newTime);
} }
function play() {
player.play();
}
function pause() {
player.pause();
}
function stop() {
player.pause();
player.currentTime(0);
}
function toggle_play() { function toggle_play() {
if (player.paused()) { if (player.paused()) {
player.play(); play();
} else { } else {
player.pause(); pause();
} }
} }
@ -338,9 +351,22 @@ window.addEventListener('keydown', e => {
switch (decoratedKey) { switch (decoratedKey) {
case ' ': case ' ':
case 'k': case 'k':
case 'MediaPlayPause':
action = toggle_play; action = toggle_play;
break; break;
case 'MediaPlay':
action = play;
break;
case 'MediaPause':
action = pause;
break;
case 'MediaStop':
action = stop;
break;
case 'ArrowUp': case 'ArrowUp':
if (isPlayerFocused) { if (isPlayerFocused) {
action = increase_volume.bind(this, 0.1); action = increase_volume.bind(this, 0.1);
@ -357,9 +383,11 @@ window.addEventListener('keydown', e => {
break; break;
case 'ArrowRight': case 'ArrowRight':
case 'MediaFastForward':
action = skip_seconds.bind(this, 5); action = skip_seconds.bind(this, 5);
break; break;
case 'ArrowLeft': case 'ArrowLeft':
case 'MediaTrackPrevious':
action = skip_seconds.bind(this, -5); action = skip_seconds.bind(this, -5);
break; break;
case 'l': case 'l':
@ -391,9 +419,11 @@ window.addEventListener('keydown', e => {
break; break;
case 'N': case 'N':
case 'MediaTrackNext':
action = next_video; action = next_video;
break; break;
case 'P': case 'P':
case 'MediaTrackPrevious':
// TODO: Add support to play back previous video. // TODO: Add support to play back previous video.
break; break;