bugfix

docs/uncompiled/artplayer-plugin-danmuku.js

@@ -437,24 +437,24 @@
       key: "suspend",
       value: function suspend() {
         var $player = this.art.template.$player;
-
-        var _getRect = getRect($player),
-            playerLeft = _getRect.left,
-            playerWidth = _getRect.width;
-
         filter(this.queue, 'emit', function (danmu) {
           danmu.$state = 'stop';
 
-          var _getRect2 = getRect(danmu.$ref),
-              danmuLeft = _getRect2.left;
-
-          var translateX = playerWidth - (danmuLeft - playerLeft) + 5;
-
           switch (danmu.mode) {
             case 'scroll':
-              danmu.$ref.style.transform = "translateX(".concat(-translateX, "px) translateY(0px) translateZ(0px)");
-              danmu.$ref.style.transition = 'transform 0s linear 0s';
-              break;
+              {
+                var _getRect = getRect($player),
+                    playerLeft = _getRect.left,
+                    playerWidth = _getRect.width;
+
+                var _getRect2 = getRect(danmu.$ref),
+                    danmuLeft = _getRect2.left;
+
+                var translateX = playerWidth - (danmuLeft - playerLeft) + 5;
+                danmu.$ref.style.transform = "translateX(".concat(-translateX, "px) translateY(0px) translateZ(0px)");
+                danmu.$ref.style.transition = 'transform 0s linear 0s';
+                break;
+              }
 
             default:
               break;

docs/uncompiled/artplayer-plugin-danmuku.js.map

@@ -1 +1 @@
-{"version":3,"file":"artplayer-plugin-danmuku.js","sources":["../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../node_modules/@babel/runtime/helpers/classCallCheck.js","../../node_modules/@babel/runtime/helpers/createClass.js","../../packages/artplayer-plugin-danmuku/src/i18n.js","../../packages/artplayer-plugin-danmuku/src/setting.js","../../packages/artplayer-plugin-danmuku/src/utils.js","../../node_modules/@babel/runtime/helpers/arrayWithHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArrayLimit.js","../../node_modules/@babel/runtime/helpers/nonIterableRest.js","../../node_modules/@babel/runtime/helpers/slicedToArray.js","../../packages/artplayer-plugin-danmuku/src/bilibili.js","../../packages/artplayer-plugin-danmuku/src/getDanmuTop.js","../../packages/artplayer-plugin-danmuku/src/danmuku.js","../../packages/artplayer-plugin-danmuku/src/index.js"],"sourcesContent":["function _defineProperty(obj, key, value) {\n  if (key in obj) {\n    Object.defineProperty(obj, key, {\n      value: value,\n      enumerable: true,\n      configurable: true,\n      writable: true\n    });\n  } else {\n    obj[key] = value;\n  }\n\n  return obj;\n}\n\nmodule.exports = _defineProperty;","var defineProperty = require(\"./defineProperty\");\n\nfunction _objectSpread(target) {\n  for (var i = 1; i < arguments.length; i++) {\n    var source = arguments[i] != null ? arguments[i] : {};\n    var ownKeys = Object.keys(source);\n\n    if (typeof Object.getOwnPropertySymbols === 'function') {\n      ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {\n        return Object.getOwnPropertyDescriptor(source, sym).enumerable;\n      }));\n    }\n\n    ownKeys.forEach(function (key) {\n      defineProperty(target, key, source[key]);\n    });\n  }\n\n  return target;\n}\n\nmodule.exports = _objectSpread;","function _classCallCheck(instance, Constructor) {\n  if (!(instance instanceof Constructor)) {\n    throw new TypeError(\"Cannot call a class as a function\");\n  }\n}\n\nmodule.exports = _classCallCheck;","function _defineProperties(target, props) {\n  for (var i = 0; i < props.length; i++) {\n    var descriptor = props[i];\n    descriptor.enumerable = descriptor.enumerable || false;\n    descriptor.configurable = true;\n    if (\"value\" in descriptor) descriptor.writable = true;\n    Object.defineProperty(target, descriptor.key, descriptor);\n  }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n  if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n  if (staticProps) _defineProperties(Constructor, staticProps);\n  return Constructor;\n}\n\nmodule.exports = _createClass;","export default {\n    'zh-cn': {\n        'Danmu opacity': '弹幕透明度',\n        'Danmu speed': '弹幕速度',\n        'Danmu size': '弹幕大小',\n        'Danmu text cannot be empty': '弹幕文本不能为空',\n        'The length of the danmu does not exceed': '弹幕文本字数不能超过',\n    },\n    'zh-tw': {\n        'Danmu opacity': '彈幕透明度',\n        'Danmu speed': '彈幕速度',\n        'Danmu size': '弹幕大小',\n        'Danmu text cannot be empty': '彈幕文本不能為空',\n        'The length of the danmu does not exceed': '彈幕文本字數不能超過',\n    },\n};","export function opacity(art) {\n    const {\n        i18n,\n        events: { proxy },\n    } = art;\n\n    return {\n        name: 'danmuku-opacity',\n        index: 30,\n        html: `\n            <div class=\"art-setting-header\">\n                ${i18n.get('Danmu opacity')}: <span class=\"art-value\">100</span>%\n            </div>\n            <div class=\"art-setting-range\">\n                <input type=\"range\" value=\"1\" min=\"0.1\" max=\"1\" step=\"0.1\">\n            </div>\n        `,\n        mounted: $setting => {\n            const $range = $setting.querySelector('input[type=range]');\n            const $value = $setting.querySelector('.art-value');\n            proxy($range, 'change', () => {\n                const { value } = $range;\n                $value.innerText = Number(value) * 100;\n\n                art.plugins.artplayerPluginDanmuku.config({\n                    opacity: Number(value),\n                });\n\n                art.on('artplayerPluginDanmuku:config', config => {\n                    if ($range.value !== config.opacity) {\n                        $range.value = config.opacity;\n                        $value.innerText = config.opacity * 100;\n                    }\n                });\n            });\n        },\n    };\n}\n\nexport function size(art) {\n    const {\n        i18n,\n        events: { proxy },\n    } = art;\n\n    return {\n        name: 'danmuku-size',\n        index: 50,\n        html: `\n            <div class=\"art-setting-header\">\n                ${i18n.get('Danmu size')}: <span class=\"art-value\">25</span>px\n            </Line truncated
+{"version":3,"file":"artplayer-plugin-danmuku.js","sources":["../../node_modules/@babel/runtime/helpers/defineProperty.js","../../node_modules/@babel/runtime/helpers/objectSpread.js","../../node_modules/@babel/runtime/helpers/classCallCheck.js","../../node_modules/@babel/runtime/helpers/createClass.js","../../packages/artplayer-plugin-danmuku/src/i18n.js","../../packages/artplayer-plugin-danmuku/src/setting.js","../../packages/artplayer-plugin-danmuku/src/utils.js","../../node_modules/@babel/runtime/helpers/arrayWithHoles.js","../../node_modules/@babel/runtime/helpers/iterableToArrayLimit.js","../../node_modules/@babel/runtime/helpers/nonIterableRest.js","../../node_modules/@babel/runtime/helpers/slicedToArray.js","../../packages/artplayer-plugin-danmuku/src/bilibili.js","../../packages/artplayer-plugin-danmuku/src/getDanmuTop.js","../../packages/artplayer-plugin-danmuku/src/danmuku.js","../../packages/artplayer-plugin-danmuku/src/index.js"],"sourcesContent":["function _defineProperty(obj, key, value) {\n  if (key in obj) {\n    Object.defineProperty(obj, key, {\n      value: value,\n      enumerable: true,\n      configurable: true,\n      writable: true\n    });\n  } else {\n    obj[key] = value;\n  }\n\n  return obj;\n}\n\nmodule.exports = _defineProperty;","var defineProperty = require(\"./defineProperty\");\n\nfunction _objectSpread(target) {\n  for (var i = 1; i < arguments.length; i++) {\n    var source = arguments[i] != null ? arguments[i] : {};\n    var ownKeys = Object.keys(source);\n\n    if (typeof Object.getOwnPropertySymbols === 'function') {\n      ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {\n        return Object.getOwnPropertyDescriptor(source, sym).enumerable;\n      }));\n    }\n\n    ownKeys.forEach(function (key) {\n      defineProperty(target, key, source[key]);\n    });\n  }\n\n  return target;\n}\n\nmodule.exports = _objectSpread;","function _classCallCheck(instance, Constructor) {\n  if (!(instance instanceof Constructor)) {\n    throw new TypeError(\"Cannot call a class as a function\");\n  }\n}\n\nmodule.exports = _classCallCheck;","function _defineProperties(target, props) {\n  for (var i = 0; i < props.length; i++) {\n    var descriptor = props[i];\n    descriptor.enumerable = descriptor.enumerable || false;\n    descriptor.configurable = true;\n    if (\"value\" in descriptor) descriptor.writable = true;\n    Object.defineProperty(target, descriptor.key, descriptor);\n  }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n  if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n  if (staticProps) _defineProperties(Constructor, staticProps);\n  return Constructor;\n}\n\nmodule.exports = _createClass;","export default {\n    'zh-cn': {\n        'Danmu opacity': '弹幕透明度',\n        'Danmu speed': '弹幕速度',\n        'Danmu size': '弹幕大小',\n        'Danmu text cannot be empty': '弹幕文本不能为空',\n        'The length of the danmu does not exceed': '弹幕文本字数不能超过',\n    },\n    'zh-tw': {\n        'Danmu opacity': '彈幕透明度',\n        'Danmu speed': '彈幕速度',\n        'Danmu size': '弹幕大小',\n        'Danmu text cannot be empty': '彈幕文本不能為空',\n        'The length of the danmu does not exceed': '彈幕文本字數不能超過',\n    },\n};","export function opacity(art) {\n    const {\n        i18n,\n        events: { proxy },\n    } = art;\n\n    return {\n        name: 'danmuku-opacity',\n        index: 30,\n        html: `\n            <div class=\"art-setting-header\">\n                ${i18n.get('Danmu opacity')}: <span class=\"art-value\">100</span>%\n            </div>\n            <div class=\"art-setting-range\">\n                <input type=\"range\" value=\"1\" min=\"0.1\" max=\"1\" step=\"0.1\">\n            </div>\n        `,\n        mounted: $setting => {\n            const $range = $setting.querySelector('input[type=range]');\n            const $value = $setting.querySelector('.art-value');\n            proxy($range, 'change', () => {\n                const { value } = $range;\n                $value.innerText = Number(value) * 100;\n\n                art.plugins.artplayerPluginDanmuku.config({\n                    opacity: Number(value),\n                });\n\n                art.on('artplayerPluginDanmuku:config', config => {\n                    if ($range.value !== config.opacity) {\n                        $range.value = config.opacity;\n                        $value.innerText = config.opacity * 100;\n                    }\n                });\n            });\n        },\n    };\n}\n\nexport function size(art) {\n    const {\n        i18n,\n        events: { proxy },\n    } = art;\n\n    return {\n        name: 'danmuku-size',\n        index: 50,\n        html: `\n            <div class=\"art-setting-header\">\n                ${i18n.get('Danmu size')}: <span class=\"art-value\">25</span>px\n            </Line truncated

packages/artplayer-plugin-danmuku/README.md

@@ -54,15 +54,9 @@ art.plugins.artplayerPluginDanmuku.emit({
     time: 5, // Video time
     color: '#fff', // Danmu color
     size: 25, // Danmu size
-    border: '#fff' // Danmu border color
+    border: false // Danmu border
 });
 
-// Start danmu
-art.plugins.artplayerPluginDanmuku.start();
-
-// Stop danmu
-art.plugins.artplayerPluginDanmuku.stop();
-
 // Hide danmu
 art.plugins.artplayerPluginDanmuku.hide();
 

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

@@ -94,16 +94,17 @@ export default class Danmuku {
 
     suspend() {
         const { $player } = this.art.template;
-        const { left: playerLeft, width: playerWidth } = getRect($player);
         filter(this.queue, 'emit', danmu => {
             danmu.$state = 'stop';
-            const { left: danmuLeft } = getRect(danmu.$ref);
-            const translateX = playerWidth - (danmuLeft - playerLeft) + 5;
             switch (danmu.mode) {
-                case 'scroll':
+                case 'scroll': {
+                    const { left: playerLeft, width: playerWidth } = getRect($player);
+                    const { left: danmuLeft } = getRect(danmu.$ref);
+                    const translateX = playerWidth - (danmuLeft - playerLeft) + 5;
                     danmu.$ref.style.transform = `translateX(${-translateX}px) translateY(0px) translateZ(0px)`;
                     danmu.$ref.style.transition = 'transform 0s linear 0s';
                     break;
+                }
                 default:
                     break;
             }