Refactor player mode listener & fix empty token

the1812 · May 28, 2023 · 1a12667 · 1a12667
1 parent fcfcc18
commit 1a12667
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 9 deletions.
diff --git a/registry/lib/components/style/player-on-top-new/index.ts b/registry/lib/components/style/player-on-top-new/index.ts
@@ -1,5 +1,5 @@
 import { defineComponentMetadata } from '@/components/define'
-import { playerModeChange } from '@/components/video/player-adaptor'
+import { createPlayerModeChangeEvent } from '@/components/video/player-adaptor'
 import { getComponentSettings, addComponentListener } from '@/core/settings'
 import { playerReady, getNumberValidator } from '@/core/utils'
 import { videoUrls } from '@/core/utils/urls'
@@ -47,7 +47,7 @@ function sideEffect() {
   let currentMode = 'normal'
 
   // 监听播放器宽屏模式 调整UP信息与弹幕列表样式
-  window.addEventListener('playerModeChange', (ev: ReturnType<typeof playerModeChange>) => {
+  window.addEventListener('playerModeChange', (ev: ReturnType<typeof createPlayerModeChangeEvent>) => {
     const { mode } = ev.detail
 
     currentMode = mode

diff --git a/src/components/video/player-adaptor/bpx.ts b/src/components/video/player-adaptor/bpx.ts
@@ -1,7 +1,7 @@
 import { attributes } from '@/core/observer'
 import { select } from '@/core/spin-query'
 import { playerReady, preventEvent } from '@/core/utils'
-import { playerModeChange, PlayerMode } from './events'
+import { createPlayerModeChangeEvent, PlayerMode } from './events'
 
 const playerModePolyfill = async () => {
   await playerReady()
@@ -10,20 +10,27 @@ const playerModePolyfill = async () => {
     console.warn('[bpx player polyfill] bpxContainer not found')
     return
   }
-  let lastScreen = 'normal' as PlayerMode
+  let lastScreen = PlayerMode.Normal
   attributes(bpxContainer, () => {
     const dataScreen = bpxContainer.getAttribute('data-screen') as PlayerMode
     const prefix = 'player-mode-'
-    const enumList = ['normal', 'wide', 'web', 'full'].map(it => `${prefix}${it}`)
+    const enumList = [
+      PlayerMode.Normal,
+      PlayerMode.WideScreen,
+      PlayerMode.WebFullscreen,
+      PlayerMode.Fullscreen,
+    ].map(it => `${prefix}${it}`)
 
     // clear all class
     document.body.classList.remove(...enumList)
 
     // add class
-    document.body.classList.add(dataScreen !== 'normal' ? `${prefix}${dataScreen}` : '')
+    if (dataScreen !== PlayerMode.Normal) {
+      document.body.classList.add(`${prefix}${dataScreen}`)
+    }
 
     if (dataScreen !== lastScreen) {
-      window.dispatchEvent(playerModeChange(dataScreen))
+      window.dispatchEvent(createPlayerModeChangeEvent(dataScreen))
       lastScreen = dataScreen
     }
   })

diff --git a/src/components/video/player-adaptor/events.ts b/src/components/video/player-adaptor/events.ts
@@ -1,6 +1,11 @@
-export type PlayerMode = 'normal' | 'wide' | 'web' | 'full'
+export enum PlayerMode {
+  Normal = 'normal',
+  WideScreen = 'wide',
+  WebFullscreen = 'web',
+  Fullscreen = 'full',
+}
 
-export const playerModeChange = (mode: PlayerMode) =>
+export const createPlayerModeChangeEvent = (mode: PlayerMode) =>
   new CustomEvent('playerModeChange', {
     detail: { mode, bubbles: true, cancelable: true },
   })