imtaotao / danmu

Collision detection, highly customized danmu screen styles, you deserve it. (碰撞检测,高度自定义的弹幕样式,你值得拥有) 😘
https://imtaotao.github.io/danmu/
MIT License
319 stars 30 forks source link

关于视频弹幕时间的疑问 #21

Closed CodyTseng closed 1 month ago

CodyTseng commented 2 months ago

这个项目做了很好的抽象,很是喜欢,想将我的一个小项目的弹幕引擎替换成这个。但仔细看了下文档,弹幕好像没有时间属性。manager 也不要求传入 media element。如果需要实现弹幕在视频指定时间出现的话,是不是需要自行监听视频时间和播放状态,然后适时调用 push 方法显示弹幕?感觉很复杂,对于这个实现您有什么思路和建议吗?谢谢🙏

imtaotao commented 1 month ago

对的,你得监听视频的播放时间和状态,这个库没有和音视频相关的功能有耦合。或者你搞个定时器检查视频的播放时间,来 push 当前视频播放时间的弹幕。其实就是一个观察者模式,实现起来应该很简单。由于有插件机制,后面有空我看能不能整个和视频功能相关的插件,发个单独的包。

// 代码上大概就这样
const video = document.getElementById('myVideo');

video.addEventListener('timeupdate', () => {
    const time = video.currentTime.toFixed(2);
    if (time === 'xxx') {
       manager.push('弹幕内容');
    }
});
CodyTseng commented 1 month ago

非常期待!昨天想尝试实现,但也遇到了 #19 的问题哈哈

imtaotao commented 1 month ago

非常期待!昨天想尝试实现,但也遇到了 #19 的问题哈哈

也是遇到了 csp 的问题?eval 这个如果站点不是特殊的配置,应该不会阻止才对,现在的微前端,webpack 的一些运行时代码对都会用到 eval。换一套实现估计得国庆后了,最近几天有点忙。

CodyTseng commented 1 month ago

我也是在写浏览器插件哈哈哈,和他的情况一样。不着急慢慢来

imtaotao commented 1 month ago

我也是在写浏览器插件哈哈哈,和他的情况一样。不着急慢慢来

去掉了 eval,写了一个数学表达式的 parser,可以更新版本再看看。

CodyTseng commented 1 month ago

可以的!