chore: Optimize danmuku plugin performance and update configuration handling

This commit is contained in:
Harvey Zack committed 2024-05-28 10:01:45 +08:00
1 parent a158c5ebdc
commit 6719f516a5
3 files changed
+50 -18

No files matched your search

@@ -474,13 +474,11 @@ export default class Danmuku {
this.$danmuku.appendChild(danmu.$ref);
// 设置初始弹幕样式
danmu.$ref.style.left = `${clientWidth}px`;
danmu.$ref.style.opacity = this.option.opacity;
danmu.$ref.style.fontSize = `${this.fontSize}px`;
danmu.$ref.style.color = danmu.color;
danmu.$ref.style.border = danmu.border ? `1px solid ${danmu.color}` : null;
danmu.$ref.style.backgroundColor = danmu.border ? 'rgb(0 0 0 / 50%)' : null;
danmu.$ref.style.marginLeft = '0px';
// 设置单独弹幕样式
setStyles(danmu.$ref, danmu.style);
@@ -519,6 +517,8 @@ export default class Danmuku {
switch (danmu.mode) {
// 滚动的弹幕
case 0: {
danmu.$ref.style.left = `${clientWidth}px`;
danmu.$ref.style.marginLeft = '0px';
danmu.$ref.style.transform = `translateX(${-distance}px)`;
danmu.$ref.style.transition = `transform ${danmu.$restTime}s linear 0s`;
break;
@@ -557,18 +557,31 @@ export default class Danmuku {
resize() {
const { clientWidth } = this.$player;
function callback(danmu) {
this.filter('stop', (danmu) => {
switch (danmu.mode) {
// 滚动的弹幕
case 0:
danmu.$ref.style.left = `${clientWidth}px`;
break;
default:
break;
}
}
});
this.filter('stop', callback);
this.filter('emit', callback);
this.filter('emit', (danmu) => {
danmu.$lastStartTime = Date.now();
switch (danmu.mode) {
// 滚动的弹幕
case 0:
const distance = clientWidth + danmu.$ref.clientWidth;
danmu.$ref.style.left = `${clientWidth}px`;
danmu.$ref.style.transform = `translateX(${-distance}px)`;
danmu.$ref.style.transition = `transform ${danmu.$restTime}s linear 0s`;
break;
default:
break;
}
});
}
// 继续弹幕
@@ -580,8 +593,8 @@ export default class Danmuku {
switch (danmu.mode) {
// 继续滚动的弹幕
case 0: {
const translateX = clientWidth + danmu.$ref.clientWidth;
danmu.$ref.style.transform = `translateX(${-translateX}px)`;
const distance = clientWidth + danmu.$ref.clientWidth;
danmu.$ref.style.transform = `translateX(${-distance}px)`;
danmu.$ref.style.transition = `transform ${danmu.$restTime}s linear 0s`;
break;
}