mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-27 09:41:20 -08:00
update getDanmuTop
This commit is contained in:
1 parent
06782590b7
commit
3fe822253a
5 files changed
+56
-69
No files matched your search
@@ -231,26 +231,24 @@ export default class Danmuku {
|
||||
}
|
||||
});
|
||||
|
||||
// this.filter('emit', (danmu) => {
|
||||
// switch (danmu.mode) {
|
||||
// case 0: {
|
||||
// const { left: playerLeft, width: playerWidth } = this.getRect($player);
|
||||
// const { left: danmuLeft } = this.getRect(danmu.$ref);
|
||||
// const translateX = playerWidth - (danmuLeft - playerLeft);
|
||||
// danmu.$ref.style.transform = `translateX(${-translateX}px) translateY(0px) translateZ(0px)`;
|
||||
// break;
|
||||
// }
|
||||
// default:
|
||||
// break;
|
||||
// }
|
||||
// });
|
||||
this.filter('emit', (danmu) => {
|
||||
switch (danmu.mode) {
|
||||
case 0: {
|
||||
const { left: danmuLeft } = this.getRect(danmu.$ref);
|
||||
const translateX = playerWidth - (danmuLeft - playerLeft);
|
||||
danmu.$ref.style.transform = `translateX(${-translateX}px) translateY(0px) translateZ(0px)`;
|
||||
break;
|
||||
}
|
||||
default:
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
this.filter('stop', (danmu) => {
|
||||
switch (danmu.mode) {
|
||||
case 0: {
|
||||
const { left: danmuLeft } = this.getRect(danmu.$ref);
|
||||
const translateX = playerWidth - (danmuLeft - playerLeft);
|
||||
danmu.$ref.style.left = `${playerWidth}px`;
|
||||
danmu.$ref.style.transform = `translateX(${-translateX}px) translateY(0px) translateZ(0px)`;
|
||||
break;
|
||||
}
|
||||
|
||||
@@ -58,23 +58,26 @@ function calculatedTop(danmus) {
|
||||
|
||||
export default function getDanmuTop(ins, danmu) {
|
||||
const [marginTop, marginBottom] = ins.option.margin;
|
||||
const playerData = ins.getRect(ins.art.template.$player);
|
||||
const { $player } = ins.art.template;
|
||||
|
||||
const danmus = ins.queue
|
||||
.filter(
|
||||
(item) =>
|
||||
.filter((item) => {
|
||||
return (
|
||||
item.mode === danmu.mode &&
|
||||
item.$state === 'emit' &&
|
||||
item.$ref &&
|
||||
item.$ref.style.fontSize === danmu.$ref.style.fontSize &&
|
||||
parseFloat(item.$ref.style.top) <= playerData.height - marginBottom,
|
||||
)
|
||||
item.$ref.offsetTop <= $player.clientHeight - marginBottom
|
||||
);
|
||||
})
|
||||
.map((item) => {
|
||||
const danmuData = ins.getRect(item.$ref);
|
||||
const { width, height } = danmuData;
|
||||
const top = danmuData.top - playerData.top;
|
||||
const left = danmuData.left - playerData.left;
|
||||
const right = playerData.width - left - width;
|
||||
return { top, left, height, width, right };
|
||||
return {
|
||||
top: item.$ref.offsetTop,
|
||||
left: item.$ref.offsetLeft,
|
||||
height: item.$ref.clientHeight,
|
||||
width: item.$ref.clientWidth,
|
||||
right: $player.clientWidth - item.$ref.offsetLeft - item.$ref.clientWidth,
|
||||
};
|
||||
})
|
||||
.sort((prev, next) => prev.top - next.top);
|
||||
|
||||
@@ -87,15 +90,15 @@ export default function getDanmuTop(ins, danmu) {
|
||||
left: 0,
|
||||
right: 0,
|
||||
height: marginTop,
|
||||
width: playerData.width,
|
||||
width: $player.clientWidth,
|
||||
});
|
||||
|
||||
danmus.push({
|
||||
top: playerData.height - marginBottom,
|
||||
top: $player.clientHeight - marginBottom,
|
||||
left: 0,
|
||||
right: 0,
|
||||
height: marginBottom,
|
||||
width: playerData.width,
|
||||
width: $player.clientWidth,
|
||||
});
|
||||
|
||||
return calculatedTop(danmus);
|
||||
|
||||
Reference in new issue
Block a user