update danmuku

packages/artplayer-plugin-danmuku/src/danmuku.js

@@ -506,8 +506,7 @@ export default class Danmuku {
         this.art.off('video:playing', this.start);
         this.art.off('video:pause', this.stop);
         this.art.off('video:waiting', this.stop);
-        this.art.off('fullscreen', this.reset);
-        this.art.off('fullscreenWeb', this.reset);
+        this.art.off('resize', this.reset);
         this.art.off('destroy', this.destroy);
         this.art.emit('artplayerPluginDanmuku:destroy');
     }

packages/artplayer-plugin-danmuku/src/setting.js

@@ -9,6 +9,7 @@ export default function setting(art, danmuku) {
     const {
         template: { $controlsCenter, $player },
         constructor: {
+            SETTING_ITEM_WIDTH,
             utils: { removeClass, addClass, append, setStyle, tooltip, query, inverseClass, getIcon },
         },
     } = art;
@@ -198,20 +199,30 @@ export default function setting(art, danmuku) {
                 append($ref, $danmuOff);
                 tooltip($ref, '弹幕开关');
                 setStyle($danmuOff, 'display', 'none');
+
+                art.on('artplayerPluginDanmuku:hide', () => {
+                    setStyle($danmuOn, 'display', 'none');
+                    setStyle($danmuOff, 'display', null);
+                });
+
+                art.on('artplayerPluginDanmuku:show', () => {
+                    setStyle($danmuOn, 'display', null);
+                    setStyle($danmuOff, 'display', 'none');
+                });
             },
         });
     }
 
     function addSetting() {
         art.setting.add({
-            width: 270,
+            width: 260,
             name: 'danmuku',
             html: '弹幕设置',
             tooltip: '更多',
             icon: $danmuConfig,
             selector: [
                 {
-                    width: 200,
+                    width: SETTING_ITEM_WIDTH,
                     html: '播放速度',
                     icon: '',
                     tooltip: '适中',
@@ -246,7 +257,7 @@ export default function setting(art, danmuku) {
                     },
                 },
                 {
-                    width: 200,
+                    width: SETTING_ITEM_WIDTH,
                     html: '字体大小',
                     icon: '',
                     tooltip: '适中',
@@ -281,7 +292,7 @@ export default function setting(art, danmuku) {
                     },
                 },
                 {
-                    width: 200,
+                    width: SETTING_ITEM_WIDTH,
                     html: '不透明度',
                     icon: '',
                     tooltip: '100%',
@@ -316,7 +327,7 @@ export default function setting(art, danmuku) {
                     },
                 },
                 {
-                    width: 200,
+                    width: SETTING_ITEM_WIDTH,
                     html: '显示范围',
                     icon: '',
                     tooltip: '3/4',

packages/artplayer-plugin-danmuku/src/style.less

@@ -1,11 +1,11 @@
 .art-danmuku-emitter {
     position: relative;
     display: flex;
-    height: var(--art-control-icon-size, 32px);
+    height: 32px;
     width: 100%;
     font-size: 12px;
     line-height: 1;
-    border-radius: 3px;
+    border-radius: 5px;
     max-width: 100%;
     background-color: rgb(255 255 255 / 30%);
 
@@ -140,7 +140,7 @@
         justify-content: center;
         cursor: pointer;
         background-color: #00a1d6;
-        border-radius: 0 3px 3px 0;
+        border-radius: 0 5px 5px 0;
 
         &:hover {
             background-color: #00b5e5;

packages/artplayer-plugin-danmuku/types/artplayer-plugin-danmuku.d.ts

@@ -116,6 +116,11 @@ type Option = {
      */
     theme?: 'dark' | 'light';
 
+    /**
+     * 是否开启弹幕热度图
+     */
+    heatmap?: boolean;
+
     /**
      * 发送弹幕前的自定义校验，返回 true 则可以发送
      */