diff --git a/CHANGELOG_CN.md b/CHANGELOG_CN.md index 936e8256c..417b6698d 100644 --- a/CHANGELOG_CN.md +++ b/CHANGELOG_CN.md @@ -6,6 +6,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] ### Added +- 添加弹幕库 d.ts ## [4.4.5] - 2022-65-2 diff --git a/package.json b/package.json index e0f6c09eb..3cd5ea53f 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "@parcel/transformer-inline-string": "^2.5.0", "@parcel/transformer-less": "^2.5.0", "@parcel/transformer-vue": "^2.5.0", + "artplayer": "^4.4.5", "chai": "^4.3.6", "cpy": "^9.0.1", "cross-env": "^7.0.3", @@ -53,4 +54,4 @@ "servor": "^4.0.2", "workbox-build": "^6.5.3" } -} \ No newline at end of file +} diff --git a/packages/artplayer-plugin-danmuku/package.json b/packages/artplayer-plugin-danmuku/package.json index 929f5f6d8..5634cc589 100644 --- a/packages/artplayer-plugin-danmuku/package.json +++ b/packages/artplayer-plugin-danmuku/package.json @@ -1,7 +1,8 @@ { "license": "MIT", - "version": "4.4.3", + "version": "4.4.6", "name": "artplayer-plugin-danmuku", + "types": "types/artplayer-plugin-danmuku.d.ts", "description": "Danmuku plugin for ArtPlayer", "main": "dist/artplayer-plugin-danmuku.js", "author": "Harvey Zack ", @@ -18,8 +19,5 @@ "html5", "video", "player" - ], - "dependencies": { - "vue": "^3.2.33" - } -} + ] +} \ No newline at end of file diff --git a/packages/artplayer-plugin-danmuku/types/artplayer-plugin-danmuku.d.ts b/packages/artplayer-plugin-danmuku/types/artplayer-plugin-danmuku.d.ts new file mode 100644 index 000000000..549d8ed9b --- /dev/null +++ b/packages/artplayer-plugin-danmuku/types/artplayer-plugin-danmuku.d.ts @@ -0,0 +1,164 @@ +import type Artplayer from 'artplayer'; + +export = artplayerPluginDanmuku; +export as namespace artplayerPluginDanmuku; + +type Danmu = { + /** + * 弹幕文本 + */ + text: string; + + /** + * 弹幕发送模式，0为滚动，1为静止 + */ + mode?: 0 | 1; + + /** + * 弹幕颜色 + */ + color?: string; + + /** + * 弹幕出现的时间，单位为秒 + */ + time?: number; + + /** + * 弹幕是否有描边 + */ + border?: boolean; +}; + +type Option = { + /** + * 弹幕源，可以是弹幕数组，xml 地址或者一个返回 Promise 的函数 + */ + danmuku: Danmu[] | string | (() => Promise) | Promise; + + /** + * 弹幕持续时间，单位秒，范围在[1 ~ 10] + */ + speed?: number; + + /** + * 弹幕上下边距，支持数字和百分比 + */ + margin?: [number | `${number}%`, number | `${number}%`]; + + /** + * 弹幕透明度，范围在[0 ~ 1] + */ + opacity?: number; + + /** + * 默认字体颜色 + */ + color?: string; + + /** + * 默认弹幕发送模式，0为滚动，1为静止 + */ + mode?: 0 | 1; + + /** + * 字体大小，支持数字和高度的百分比 + */ + fontSize?: number | `${number}%`; + + /** + * 弹幕过滤函数，返回 true 则可以发送 + */ + filter?: (danmu: Danmu) => boolean; + + /** + * 是否防重叠 + */ + antiOverlap?: boolean; + + /** + * 是否使用 web worker + */ + useWorker?: boolean; + + /** + * 是否同步到播放速度 + */ + synchronousPlayback?: boolean; + + /** + * 输入框锁定时间，单位秒，范围在[1 ~ 60] + */ + lockTime?: number; + + /** + * 输入框最大可输入的字数，范围在[0 ~ 500] + */ + maxLength?: number; + + /** + * 输入框最小宽度，范围在[0 ~ 500]，填 0 则为无限制 + */ + minWidth?: number; + + /** + * 输入框最大宽度，范围在[0 ~ Infinity]，填 0 则为 100% 宽度 + */ + maxWidth?: number; + + /** + * 通过 mount 选项可以自定义输入框挂载的位置，默认挂载于播放器底部，仅在当宽度小于最小值时生效 + */ + mount?: Element; + + /** + * 输入框自定义挂载时的主题色，默认为 dark，可以选填亮色 light + */ + theme?: 'dark' | 'light'; + + /** + * 发送弹幕前的自定义校验，返回 true 则可以发送 + */ + beforeEmit?: (danmu: Danmu) => boolean; +}; + +type danmuku = { + name: 'artplayerPluginDanmuku'; + + /** + * 发送一条实时弹幕 + */ + emit: (danmu: Danmu) => danmuku; + + /** + * 重载弹幕源，或者切换新弹幕 + */ + load: () => Promise; + + /** + * 实时改变弹幕配置 + */ + config: (option: Option) => danmuku; + + /** + * 隐藏弹幕层 + */ + hide: () => danmuku; + + /** + * 显示弹幕层 + */ + show: () => danmuku; + + /** + * 是否隐藏弹幕层 + */ + isHide: boolean; + + /** + * 是否弹幕层停止状态 + */ + isStop: boolean; +}; + +declare const artplayerPluginDanmuku: (option: Option) => (art: Artplayer) => danmuku; diff --git a/packages/artplayer/package.json b/packages/artplayer/package.json index 704ee1e0a..05248b283 100644 --- a/packages/artplayer/package.json +++ b/packages/artplayer/package.json @@ -1,7 +1,7 @@ { "license": "MIT", "name": "artplayer", - "version": "4.4.5", + "version": "4.4.6", "main": "dist/artplayer.js", "types": "types/artplayer.d.ts", "homepage": "https://artplayer.org", diff --git a/packages/artplayer/types/artplayer.d.ts b/packages/artplayer/types/artplayer.d.ts index 19c670b31..093a024c0 100644 --- a/packages/artplayer/types/artplayer.d.ts +++ b/packages/artplayer/types/artplayer.d.ts @@ -375,7 +375,7 @@ type Option = { /** * Custom plugin list */ - plugins?: PluginFunction[]; + plugins?: PluginFunction[] | (() => any); /** * Custom mobile whitelist @@ -731,6 +731,7 @@ declare class Artplayer extends Player { readonly plugins: { readonly id: number; add(plugin: PluginFunction): Artplayer['plugins']; + [pluginName: string]: any; }; readonly i18n: { diff --git a/test/types.test.ts b/test/types.test.ts index c8a90d6c7..b1c6e52e6 100644 --- a/test/types.test.ts +++ b/test/types.test.ts @@ -1,6 +1,22 @@ -import Artplayer from '../packages/artplayer/types/artplayer'; +import Artplayer from '../packages/artplayer'; +import artplayerPluginDanmuku from '../packages/artplayer-plugin-danmuku'; const art = new Artplayer({ container: '.artplayer-app', url: './assets/sample/video.mp4', + plugins: [ + artplayerPluginDanmuku({ + danmuku: '', + margin: [0, '10%'], + theme: 'light', + }), + ], }); + +art.plugins.add( + artplayerPluginDanmuku({ + danmuku: '', + margin: [0, '10%'], + theme: 'light', + }), +);