Refactor keyboard event handling

* Replace deprecated KeyboardEvent.keyCode with KeyboardEvent.code * Also use KeyboardEvent.key for non-qwerty users
gmertes · Feb 22, 2023 · 6da0a40 · 6da0a40
1 parent c7f1796
commit 6da0a40
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 8 deletions.
diff --git a/src/nflxmultisubs.js b/src/nflxmultisubs.js
@@ -1413,9 +1413,9 @@ window.__NflxMultiSubs = nflxMultiSubsManager;  // interface between us and the
 const playbackRateController = new PlaybackRateController();
 playbackRateController.activate();
 
-window.addEventListener('keyup', (event) => {
+window.addEventListener('keydown', (event) => {
   // toggle subtitles visibility with 'v'
-  if (event.code === 'KeyV') {
+  if (event.key.toLowerCase() === 'v') {
     const primary = document.querySelector('.nflxmultisubs-primary-wrapper');
     const secondary = document.querySelector('.nflxmultisubs-subtitle-wrapper');
 

diff --git a/src/playback-rate-controller.js b/src/playback-rate-controller.js
@@ -8,22 +8,21 @@ class PlaybackRateController {
   activate() {
     if (this.keyUpHandler) return;
 
-    this.keyUpHandler = window.addEventListener('keyup',
+    this.keyUpHandler = window.addEventListener('keydown',
       this._keyUpHandler.bind(this));
   }
 
 
   deactivate() {
     if (!this.keyUpHandler) return;
 
-    window.removeEventListener('keyup', this.keyUpHandler);
+    window.removeEventListener('keydown', this.keyUpHandler);
     this.keyUpHandler = null;
   }
 
 
   _keyUpHandler(evt) {
-    if (evt.ctrlKey || evt.altKey || evt.shiftKey || evt.metaKey) return;
-    if ((evt.keyCode !== 219 /* [ */) && (evt.keyCode !== 221 /* ] */)) return;
+    if (!['BracketLeft', 'BracketRight'].includes(evt.code) && !['[', ']'].includes(evt.key) ) return;
 
     const playerContainer = document.querySelector('.watch-video');
     if (!playerContainer) return;
@@ -32,8 +31,8 @@ class PlaybackRateController {
     if (!video) return;
 
     let playbackRate = video.playbackRate;
-    if (evt.keyCode === 219) playbackRate -= 0.1; // key [ pressed
-    else if (evt.keyCode == 221) playbackRate += 0.1; // ] pressed
+    if (evt.code === 'BracketLeft' || evt.key === '[') playbackRate -= 0.1;
+    else if (evt.code === 'BracketRight'|| evt.key === ']') playbackRate += 0.1;
 
     playbackRate = Math.max(Math.min(playbackRate, 3.0), 0.1);
     video.playbackRate = playbackRate;