fix(xgplayer): 全局多实例快捷键同时生效异常问题修复

l0rem1psum · Nov 22, 2023 · 1c790dc · 1c790dc
1 parent e57d13a
commit 1c790dc
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 14 deletions.
diff --git a/fixtures/xgplayer/index.html b/fixtures/xgplayer/index.html
@@ -60,7 +60,7 @@
 
   <body>
     <div id="video0" style="margin: 0 auto"></div>
-    <div class="pannel">
+    <!-- <div class="pannel">
       <div class="tool">
         <button type="submit" class="btn" id="js-destroy0" onclick="window.destroy(0)">
           销毁
@@ -97,7 +97,46 @@ <h4>current lang:</h4>
           <h4>log info:</h4>
         </div>
       </div>
-    </div>
+    </div> -->
+    <div id="video1" style="margin: 0 auto"></div>
+    <!-- <div class="pannel">
+      <div class="tool">
+        <button type="submit" class="btn" id="js-destroy0" onclick="window.destroy(0)">
+          销毁
+        </button>
+        <button type="submit" class="btn" id="js-reinit0" onclick="window.init(0)">
+          重新初始化
+        </button>
+        <button type="submit" class="btn" id="js-playnext0" onclick="window.playNext(0)">
+          播放下一个
+        </button>
+        <button
+          type="submit"
+          class="btn"
+          id="js-changelang0"
+          onclick="window.changeLang(0)"
+        >
+          切换语言
+        </button>
+        <button
+          type="submit"
+          class="btn"
+          id="js-changelang0"
+          onclick="window.createDot(0)"
+        >
+          添加预览点
+        </button>
+      </div>
+      <div class="message-pannel">
+        <div class="message-info" id="js-show-lang0">
+          <h4>current lang:</h4>
+        </div>
+
+        <div class="message-info" id="js-show-log0">
+          <h4>log info:</h4>
+        </div>
+      </div>
+    </div> -->
     <script></script>
     <script type="module" defer src="./index.js"></script>
     <script>

diff --git a/fixtures/xgplayer/index.js b/fixtures/xgplayer/index.js
@@ -39,10 +39,10 @@ function init(index = 0, config = {}) {
     preProcessUrl: (url, ext) => {
       console.log('>>>preProcessUrl', url, ext)
       return {
-        url: `${url}&_test=1111`
+        url: url
       }
     },
-    url: 'xx',
+    url: "xx",
     DynamicBg: {
       disable: false
     },
@@ -75,6 +75,13 @@ function init(index = 0, config = {}) {
     rotate: {
       innerRotate: false
     },
+    Keyboard: {
+      // isGlobalTrigger: false, // Whether the shortcut key needs to be triggered globally
+      // disableBodyTrigger: false,
+      // disable: false,
+      // playbackRate: 2, // 长按倍速限制
+      isIgnoreUserActive: true // 是否忽略用户激活状态
+    },
     mobile: {
       // gestureX: false
     },
@@ -123,7 +130,7 @@ function init(index = 0, config = {}) {
       defaultDefinition: '360p',
       isItemClickHide: false
     },
-    height: 700,
+    height: 300,
     miniprogress: true,
     ...config
   })
@@ -140,9 +147,6 @@ function init(index = 0, config = {}) {
     // window[p].play()
   })
 
-  window[p].on('timeupdate', (data) => {
-    console.log('cumulateTime', window[p].cumulateTime)
-  })
   window[p].on('source_error', (data) => {
     console.error('source_error', data)
   })
@@ -209,6 +213,7 @@ function init(index = 0, config = {}) {
 }
 
 init()
+init(1)
 
 // init(1, {
 //   i18n: [

diff --git a/packages/xgplayer/src/plugins/keyboard/index.js b/packages/xgplayer/src/plugins/keyboard/index.js
@@ -42,11 +42,11 @@ class Keyboard extends BasePlugin {
       checkVisible: false, // Whether to check the visibility when the shortcut key takes effect
       disableBodyTrigger: false, // Whether to monitor the shortcut keys on the body
       disableRootTrigger: false, // 是否在player.root上做快捷键监听
-      isGlobalTrigger: false, // Whether the shortcut key needs to be triggered globally
+      isGlobalTrigger: true, // Whether the shortcut key needs to be triggered globally
       keyCodeMap: {},
       disable: false,
       playbackRate: 2, // 长按倍速限制
-      isIgnoreUserActive: false // 是否忽略用户激活状态
+      isIgnoreUserActive: true // 是否忽略用户激活状态
     }
   }
 
@@ -280,7 +280,7 @@ class Keyboard extends BasePlugin {
     const { _keyState, player } = this
     const { disable, disableBodyTrigger, isIgnoreUserActive } = this.config
     // 以下条件不响应
-    if (disable || disableBodyTrigger || (!player.isUserActive && !isIgnoreUserActive) || isDisableTag(e.target) || !this.checkIsVisible() || e.metaKey || e.altKey || e.ctrlKey) {
+    if (disable || disableBodyTrigger || !(player.isUserActive || isIgnoreUserActive) || isDisableTag(e.target) || !this.checkIsVisible() || e.metaKey || e.altKey || e.ctrlKey) {
       _keyState.isBodyKeyDown = false
       return
     }
@@ -313,9 +313,6 @@ class Keyboard extends BasePlugin {
       if (this.config.disable || this.config.disableRootTrigger || e.metaKey || e.altKey || e.ctrlKey) {
         return
       }
-      if (!this.player.isUserActive && !this.config.isIgnoreUserActive) {
-        return
-      }
       if (e && (e.keyCode === 37 || this.checkCode(e.keyCode)) && (e.target === this.player.root || e.target === this.player.video || e.target === this.player.controls.el)) {
         _keyState.isKeyDown = true
       }