Support player hotkeys when it is not focused

diff --git a/client/src/app/+videos/+video-watch/video-watch.component.ts b/client/src/app/+videos/+video-watch/video-watch.component.ts
index 5b0b34c803264b16a834fb44ae1913a8df589d4a..933e6c51fbcd756695e7a22efb8c1b1477f3717e 100644 (file)
--- a/client/src/app/+videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/+videos/+video-watch/video-watch.component.ts
@@ -467,7 +467,6 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
 
     this.zone.runOutsideAngular(async () => {
       this.player = await PeertubePlayerManager.initialize(playerMode, playerOptions, player => this.player = player)
-      this.player.focus()
 
       this.player.on('customError', ({ err }: { err: any }) => this.handleError(err))
 

diff --git a/client/src/assets/player/peertube-player-manager.ts b/client/src/assets/player/peertube-player-manager.ts
index ebb1e454aee2bfe5155b5316d99d43165e2476b5..630eebbca0002326580b414b2efb78cbaa7564ea 100644 (file)
--- a/client/src/assets/player/peertube-player-manager.ts
+++ b/client/src/assets/player/peertube-player-manager.ts
@@ -452,6 +452,13 @@ export class PeertubePlayerManager {
   private static addHotkeysOptions (plugins: VideoJSPluginOptions) {
     Object.assign(plugins, {
       hotkeys: {
+        skipInitialFocus: true,
+        enableInactiveFocus: false,
+        captureDocumentHotkeys: true,
+        documentHotkeysFocusElementFilter: (e: HTMLElement) => {
+          return e.id === 'content' || e.tagName.toLowerCase() === 'body'
+        },
+
         enableVolumeScroll: false,
         enableModifiersForNumbers: false,