js: add support to detect alt, meta and control key in keydown handler (#704)

This fixes a quite severe user experience issue where pressing the
'alt', 'meta' and/or 'ctrl' key along with one of the supported keys
(e.g. 'f' to enter video fullscreen mode) would overwrite the default
browser behavior. In the case of 'f+meta' we would enter fullscreen
mode, and not open the browser search panel as one might expect.

This change is required to stay consistent with the way YouTube
handles keydown events.

1 files changed, 8 insertions, 3 deletions

diff --git a/assets/js/player.js b/assets/js/player.js
index 4a61258c..0d0ecebd 100644
--- a/assets/js/player.js
+++ b/assets/js/player.js
@@ -327,8 +327,13 @@ window.addEventListener('keydown', e => {
     let action = null;
 
     const code = e.keyCode;
-    const key = e.key;
-    switch (key) {
+    const decoratedKey =
+        e.key
+        + (e.altKey  ? '+alt'  : '')
+        + (e.ctrlKey ? '+ctrl' : '')
+        + (e.metaKey ? '+meta' : '')
+    ;
+    switch (decoratedKey) {
     case ' ':
     case 'k':
         action = toggle_play;
@@ -405,7 +410,7 @@ window.addEventListener('keydown', e => {
         break;
 
     default:
-        console.info('Unhandled key down event: %s:', key, e);
+        console.info('Unhandled key down event: %s:', decoratedKey, e);
         break;
     }