修改弹幕模式变量

This commit is contained in:
Harvey committed 2020-02-24 11:19:17 +08:00
1 parent 31f8f9fe09
commit a969686d88
6 files changed
+60 -55

No files matched your search

+22 -19
View File
@@ -1,4 +1,5 @@
# artplayer-plugin-danmuku
Danmuku plugin for ArtPlayer
## Demo
@@ -37,24 +38,26 @@ Will expose the global variable to `window.artplayerPluginDanmuku`.
var art = new Artplayer({
container: '.artplayer-app',
url: 'path/to/video.mp4',
plugins: [artplayerPluginDanmuku({
danmuku: [
{
text: '666', // Danmu text
time: 5, // Video time
color: '#fff', // Danmu color
border: false, // Danmu border
mode: 'scroll', // Danmu mode: scroll or static
}
], // Can be an array or return the promised function or danmuku xml url
speed: 5, // Animation time
opacity: 1, // Opacity
color: '#fff', // Font color
size: 25, // Font size
maxlength: 50, // The maximum number of words in the danmu
margin: [10, 20], // Margin top and margin bottom
synchronousPlayback: false, // Synchronous playback speed
})],
plugins: [
artplayerPluginDanmuku({
danmuku: [
{
text: '666', // Danmu text
time: 5, // Video time
color: '#fff', // Danmu color
border: false, // Danmu border
mode: 0, // Danmu mode: 0-scroll or 1-static
},
], // Can be an array or return the promised function or danmuku xml url
speed: 5, // Animation time
opacity: 1, // Opacity
color: '#fff', // Font color
size: 25, // Font size
maxlength: 50, // The maximum number of words in the danmu
margin: [10, 20], // Margin top and margin bottom
synchronousPlayback: false, // Synchronous playback speed
}),
],
});
// Send danmu
@@ -64,7 +67,7 @@ art.plugins.artplayerPluginDanmuku.emit({
color: '#fff', // Danmu color
size: 25, // Danmu size
border: false, // Danmu border
mode: 'scroll', // Danmu mode: scroll or static
mode: 0, // Danmu mode: 0-scroll or 1-static
});
// Hide danmu
@@ -3,12 +3,12 @@ export function getMode(key) {
case 1:
case 2:
case 3:
return 'scroll';
return 0;
case 4:
case 5:
return 'static';
return 1;
default:
return null;
return 0;
}
}
@@ -17,22 +17,22 @@ export function bilibiliDanmuParseFromXml(xmlString) {
const srtList = xmlString.match(/<d([\S ]*?>[\S ]*?)<\/d>/gi);
return srtList.length
? srtList.map(item => {
const [, attrStr, text] = item.match(/<d p="(.+)">(.+)<\/d>/);
const attr = attrStr.split(',');
return attr.length === 8 && text.trim()
? {
text,
time: Number(attr[0]),
mode: getMode(Number(attr[1])),
fontSize: Number(attr[2]),
color: `#${Number(attr[3]).toString(16)}`,
timestamp: Number(attr[4]),
pool: Number(attr[5]),
userID: attr[6],
rowID: Number(attr[7]),
}
: null;
})
const [, attrStr, text] = item.match(/<d p="(.+)">(.+)<\/d>/);
const attr = attrStr.split(',');
return attr.length === 8 && text.trim()
? {
text,
time: Number(attr[0]),
mode: getMode(Number(attr[1])),
fontSize: Number(attr[2]),
color: `#${Number(attr[3]).toString(16)}`,
timestamp: Number(attr[4]),
pool: Number(attr[5]),
userID: attr[6],
rowID: Number(attr[7]),
}
: null;
})
: [];
}
@@ -50,8 +50,10 @@ export function bilibiliDanmuParseFromAv(av) {
.then(res => res.json())
.then(res => {
if (res.code === 0 && res.data && res.data.cid) {
return bilibiliDanmuParseFromUrl(`${corsUrl}https://api.bilibili.com/x/v1/dm/list.so?oid=${res.data.cid}`);
return bilibiliDanmuParseFromUrl(
`${corsUrl}https://api.bilibili.com/x/v1/dm/list.so?oid=${res.data.cid}`,
);
}
throw new Error(`Unable to get data: ${JSON.stringify(res)}`);
});
}
}
@@ -85,7 +85,7 @@ export default class Danmuku {
danmu.$state = 'emit';
danmu.$lastStartTime = Date.now();
switch (danmu.mode) {
case 'scroll':
case 0:
danmu.$ref.style.transform = `translateX(${-danmu.$restWidth}px) translateY(0px) translateZ(0px)`;
danmu.$ref.style.transition = `transform ${danmu.$restTime}s linear 0s`;
break;
@@ -100,7 +100,7 @@ export default class Danmuku {
filter(this.queue, 'emit', danmu => {
danmu.$state = 'stop';
switch (danmu.mode) {
case 'scroll': {
case 0: {
const { left: playerLeft, width: playerWidth } = getRect($player);
const { left: danmuLeft } = getRect(danmu.$ref);
const translateX = playerWidth - (danmuLeft - playerLeft) + 5;
@@ -174,7 +174,7 @@ export default class Danmuku {
const danmuTop = getDanmuTop(this, danmu);
danmu.$state = 'emit';
switch (danmu.mode) {
case 'scroll': {
case 0: {
danmu.$restWidth = danmuLeft + danmuWidth + 5;
danmu.$ref.style.left = `${danmuLeft}px`;
danmu.$ref.style.top = `${danmuTop}px`;
@@ -182,7 +182,7 @@ export default class Danmuku {
danmu.$ref.style.transition = `transform ${danmu.$restTime}s linear 0s`;
break;
}
case 'static':
case 1:
danmu.$ref.style.top = `${danmuTop}px`;
danmu.$ref.style.left = '50%';
danmu.$ref.style.marginLeft = `-${danmuWidth / 2}px`;
@@ -240,7 +240,7 @@ export default class Danmuku {
}
this.queue.push({
mode: 'scroll',
mode: 0,
...danmu,
$state: 'wait',
$ref: null,