x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-08 19:06:15 -08:00
Code Issues Packages Projects Releases Wiki Activity

添加弹幕验证

Browse Source
This commit is contained in:
Harvey committed 2020-04-26 09:36:12 +08:00
1 parent 7f3b116851
commit ae7d87e08b
6 files changed
+52 -25
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

docs/assets/example/danmuku.js
+1 -2
View File
@@ -42,8 +42,7 @@ var art = new Artplayer({
art.plugins.artplayerPluginDanmuku.emit({
text: text,
color: color,
border: color,
time: art.player.currentTime + 0.2,
border: true,
});
},
},
docs/assets/example/github.js
+1 -1
View File
@@ -45,7 +45,7 @@ var art = new Artplayer({
...data,
mode: 0,
time: art.player.currentTime + 0.2,
border: data.color,
border: true,
});
})
.catch(() => {
docs/uncompiled/artplayer-plugin-danmuku.js
+16 -4
View File
@@ -559,8 +559,8 @@
danmu.$ref.style.opacity = _this2.option.opacity;
danmu.$ref.style.fontSize = "".concat(_this2.option.fontSize, "px");
danmu.$ref.innerText = danmu.text;
danmu.$ref.style.color = danmu.color;
danmu.$ref.style.border = danmu.border ? "1px solid ".concat(danmu.color) : 'none';
danmu.$ref.style.color = danmu.color || '#fff';
danmu.$ref.style.border = danmu.border ? "1px solid ".concat(danmu.color || '#fff') : 'none';
danmu.$restTime = _this2.option.synchronousPlayback && player.playbackRate ? _this2.option.speed / Number(player.playbackRate) : _this2.option.speed;
danmu.$lastStartTime = Date.now();
var danmuWidth = getRect(danmu.$ref, 'width');
@@ -629,6 +629,16 @@
notice = _this$art2.notice,
player = _this$art2.player,
i18n = _this$art2.i18n;
var _this$art$constructor2 = this.art.constructor,
clamp = _this$art$constructor2.utils.clamp,
validator = _this$art$constructor2.validator;
validator(danmu, {
text: 'string',
mode: 'number|undefined',
color: 'string|undefined',
time: 'number|undefined',
border: 'boolean|undefined'
});
if (!danmu.text.trim()) {
notice.show = i18n.get('Danmu text cannot be empty');
@@ -640,8 +650,10 @@
return;
}
if (typeof danmu.time !== 'number') {
danmu.time = player.currentTime;
if (danmu.time) {
danmu.time = clamp(danmu.time, 0, Infinity);
} else {
danmu.time = player.currentTime + 0.5;
}
this.queue.push(_objectSpread({
docs/uncompiled/artplayer-plugin-danmuku.js.map
+1 -1
View File
@@ -1 +1 @@
{"version":3,"file":"artplayer-plugin-danmuku.js","sources":["../../node_modules/@babel/runtime/helpers/defineProperty.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;","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 'Danmu speed synchronous playback multiple': '弹幕速度同步播放倍数',\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 'Danmu speed synchronous playback multiple': '彈幕速度同步播放倍數',\n },\n};","export function opacity(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-opacity',\n index: 10,\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\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\nexport function size(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-size',\n index: 11,\n html: `\n <div class=\"art-setting-header\">\n ${i18n.get('Danmu size')}: <span class=\"art-value\">25</span>px\n </div>\n <div class=\"art-setting-range\">\n <input type=\"range\" value=\"25\" min=\"14\" max=\"30\" step=\"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 = value;\n\n art.plugins.artplayerPluginDanmuku.config({\n fLine truncated
{"version":3,"file":"artplayer-plugin-danmuku.js","sources":["../../node_modules/@babel/runtime/helpers/defineProperty.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;","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 'Danmu speed synchronous playback multiple': '弹幕速度同步播放倍数',\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 'Danmu speed synchronous playback multiple': '彈幕速度同步播放倍數',\n },\n};","export function opacity(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-opacity',\n index: 10,\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\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\nexport function size(art) {\n const {\n i18n,\n events: { proxy },\n } = art;\n\n return {\n name: 'danmuku-size',\n index: 11,\n html: `\n <div class=\"art-setting-header\">\n ${i18n.get('Danmu size')}: <span class=\"art-value\">25</span>px\n </div>\n <div class=\"art-setting-range\">\n <input type=\"range\" value=\"25\" min=\"14\" max=\"30\" step=\"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 = value;\n\n art.plugins.artplayerPluginDanmuku.config({\n fLine truncated
packages/artplayer-plugin-danmuku/src/danmuku.js
+27 -12
View File
@@ -26,12 +26,12 @@ export default class Danmuku {
art.on('resize', this.resize.bind(this));
art.on('destroy', this.stop.bind(this));
if (typeof this.option.danmuku === 'function') {
this.option.danmuku().then(danmus => {
this.option.danmuku().then((danmus) => {
danmus.forEach(this.emit.bind(this));
art.emit('artplayerPluginDanmuku:loaded');
});
} else if (typeof this.option.danmuku === 'string') {
bilibiliDanmuParseFromUrl(this.option.danmuku).then(danmus => {
bilibiliDanmuParseFromUrl(this.option.danmuku).then((danmus) => {
danmus.forEach(this.emit.bind(this));
art.emit('artplayerPluginDanmuku:loaded');
});
@@ -82,7 +82,7 @@ export default class Danmuku {
}
continue() {
filter(this.queue, 'stop', danmu => {
filter(this.queue, 'stop', (danmu) => {
danmu.$state = 'emit';
danmu.$lastStartTime = Date.now();
switch (danmu.mode) {
@@ -98,7 +98,7 @@ export default class Danmuku {
suspend() {
const { $player } = this.art.template;
filter(this.queue, 'emit', danmu => {
filter(this.queue, 'emit', (danmu) => {
danmu.$state = 'stop';
switch (danmu.mode) {
case 0: {
@@ -118,7 +118,7 @@ export default class Danmuku {
resize() {
const { $player } = this.art.template;
const danmuLeft = getRect($player, 'width');
filter(this.queue, 'wait', danmu => {
filter(this.queue, 'wait', (danmu) => {
if (danmu.$ref) {
danmu.$ref.style.border = 'none';
danmu.$ref.style.left = `${danmuLeft}px`;
@@ -138,7 +138,7 @@ export default class Danmuku {
if (player.playing && !this.isHide) {
const danmuLeft = getRect($player, 'width');
filter(this.queue, 'emit', danmu => {
filter(this.queue, 'emit', (danmu) => {
danmu.$restTime -= (Date.now() - danmu.$lastStartTime) / 1000;
danmu.$lastStartTime = Date.now();
if (danmu.$restTime <= 0) {
@@ -153,19 +153,19 @@ export default class Danmuku {
this.queue
.filter(
danmu =>
(danmu) =>
player.currentTime + 0.1 >= danmu.time &&
danmu.time >= player.currentTime - 0.1 &&
danmu.$state === 'wait',
)
.forEach(danmu => {
.forEach((danmu) => {
danmu.$ref = getDanmuRef(this.queue);
this.$danmuku.appendChild(danmu.$ref);
danmu.$ref.style.opacity = this.option.opacity;
danmu.$ref.style.fontSize = `${this.option.fontSize}px`;
danmu.$ref.innerText = danmu.text;
danmu.$ref.style.color = danmu.color;
danmu.$ref.style.border = danmu.border ? `1px solid ${danmu.color}` : 'none';
danmu.$ref.style.color = danmu.color || '#fff';
danmu.$ref.style.border = danmu.border ? `1px solid ${danmu.color || '#fff'}` : 'none';
danmu.$restTime =
this.option.synchronousPlayback && player.playbackRate
? this.option.speed / Number(player.playbackRate)
@@ -228,6 +228,19 @@ export default class Danmuku {
emit(danmu) {
const { notice, player, i18n } = this.art;
const {
utils: { clamp },
validator,
} = this.art.constructor;
validator(danmu, {
text: 'string',
mode: 'number|undefined',
color: 'string|undefined',
time: 'number|undefined',
border: 'boolean|undefined',
});
if (!danmu.text.trim()) {
notice.show = i18n.get('Danmu text cannot be empty');
return;
@@ -238,8 +251,10 @@ export default class Danmuku {
return;
}
if (typeof danmu.time !== 'number') {
danmu.time = player.currentTime;
if (danmu.time) {
danmu.time = clamp(danmu.time, 0, Infinity);
} else {
danmu.time = player.currentTime + 0.5;
}
this.queue.push({
packages/artplayer/src/index.js
+6 -5
View File
@@ -25,6 +25,7 @@ import Plugins from './plugins';
import Mobile from './mobile';
let id = 0;
const instances = [];
class Artplayer extends Emitter {
constructor(option) {
super();
@@ -56,7 +57,11 @@ class Artplayer extends Emitter {
id += 1;
this.id = id;
Artplayer.instances.push(this);
instances.push(this);
}
static get instances() {
return instances;
}
static get version() {
@@ -158,10 +163,6 @@ class Artplayer extends Emitter {
}
}
utils.def(Artplayer, 'instances', {
value: [],
});
// eslint-disable-next-line no-console
console.log(
'%c ArtPlayer %c __VERSION__ %c https://artplayer.org',