概念
为了支持对播放器根据场景进行插件管理,我们提出Preset概念,Preset可以简单理解为“一组插件”,当一个项目中有多种播放场景时,Preset将成为你管理插件的好帮手
使用
在Player的配置中,可以传入config.presets为播放器提供Preset能力
import Player from 'xgplayer';
import MyPreset from './myPreset'
new Player({
presets: [MyPreset]
})
播放器提供点播、直播、移动端三套内置Preset,根据大家使用场景的频率,将点播Preset默认安装在播放器上,当我们按照默认方式使用播放器时,我们就在使用点播Preset:
import Player from 'xgplayer';
new Player(options)
而当我们希望使用直播Preset时,我们可以这样来引用:
import Player from 'xgplayer/es/player.js';
import LivePreset from 'xgplayer/es/presets/live';
Player.defaultPreset = LivePreset;
new Player(options)
当我们希望使用移动Preset时,我们可以这样来引用:
import Player from 'xgplayer/es/player.js';
import LivePreset from 'xgplayer/es/presets/mobile';
Player.defaultPreset = LivePreset;
new Player(options)
值得一提的时,播放器在使用传入config.presets时会禁用掉Player.defaultPreset,如果希望保留Player.defaultPreset,可以通过传入'default':
import Player from 'xgplayer';
import MyPreset from './myPreset'
new Player({
presets: ['default', MyPreset] // 将保留默认Preset
})
如果希望对preset中的插件进行禁用,依然可以参照config.ignores来配置。
开发
与Preset的概念一样,开发一个Preset是非常简单的:
import PluginA from './pluginA'
import PluginB from './pluginB'
class MyPreset {
constructor () {
this.plugins = [PluginA, PluginB]; // 使用的插件
this.ignores: ['PluginC'] // 当MyPreset启用时,需要禁用的插件
}
}
内置Preset说明
点播Preset包含如下插件:
- Replay
- Poster
- Start
- Enter
- Miniscreen
- PC
- Keyboard
- Loading
- Progress
- Play
- FullScreen
- Time
- Volume
- Rotate
- PIP
- PlayNext
- DownLoad
- ScreenShot
- Definition
- PlaybackRate
- CssFullScreen
直播Preset包含如下插件:
- Poster
- Start
- Enter
- PC
- Mobile
- Keyboard
- Loading
- Play
- FullScreen
- Time
- Volume
- RotateIcon
- PIP
- CssFullScreen
- Definition
- PlaybackRate