cc-player
v1.0.2
Published
对 CC 视频播放器的二次封装,提供一些常用的 API 接口,方便使用
Downloads
4
Readme
CC Player
对 CC 视频播放器的二次封装,提供一些常用的 API 接口,方便使用
主要功能
- 支持通过视频 ID 来播放视频
- 支持监听播放器事件
- 支持调用 CC 视频原生播放器的方法
如何安装
1. 使用 npm 安装(推荐)
npm install cc-player --save
2. 通过 <script>
直接引用
<script src="path/to/cc-player.min.js"></script>
使用方法
// 通过 npm 安装的方式
var CCPlayer = require('cc-player');
var player = CCPlayer.init('#video-container', {
width: 600,
height: 400
});
player.play(vid);
// 通过直接引用的方式会在 `window` 上添加一个变量 `CCPlayer`
// 直接使用该变量即可。
var player = CCPlayer.init('#video-container', {
width: 600,
height: 400
});
player.play(vid);
API 文档
CCPlayer.init(container, options)
初始化一个视频播放器。
参数:
container (DOMElement|jQuery|string)
: 必填。播放器的容器,可以是一个 DOM 节点元素,可以是一个 jQuery 的对象, 也可以是一个 DOM 选择器。options (object)
: 必选。播放器的配置选项,请至少提供siteid
,否则导致移动端错误siteid
: 必选,站点 id,但是建议配置成各自的siteid
,有利于 CC 视频的统计播放信息playerid
: 可选,播放器的皮肤类型,请根据自身需要进行设置width
: 可选,视频宽度,默认是auto
height
: 可选,视频高度,默认是auto
playertype
: 可选,暂不确定代表什么意思,默认值是1
autoStart
: 可选,是否自动播放,默认值是false
vid
: 可选,视频的 id,默认为空
返回值:
播放器的实例。
player.play(vid)
加载视频。
参数:
vid (string)
: 可选,如果设置了vid
,则播放 id 为vid
的视频,如果没有指定vid
,则 根据init(container, options)
中options
配置的vid
来加载视频
返回值:
播放器的实例。
player.on(eventName, handler)
给播放器添加事件处理函数。具体支持的事件请参考下面的事件列表。
player.start()
开始播放
player.pause()
暂停播放
player.resume()
恢复播放
player.seek(time)
定位至指定时间,参数 time
(单位:秒)
player.getDuration()
获取视频片长(单位:秒)
player.getPosition()
获取当前播放时间(单位:秒)
player.getQualities()
获取当前视频可⽤清晰度列表
返回类型:Array
eg. [{ value: "0", label: "普通" }, { value: "1", label: "清晰" }]
player.setQuality(quality)
设置清晰度
参数 quality
为 getQualities
方法获取的 value
值
player.setVolume(volume)
设置音量
参数 volume
取值范围:[0-1]. eg. setVolume(0.5)
player.normalScreen()
退出全屏
player.setConfig(config)
配置播放器
参数 config
为配置对象,详细参照播放器配置
player.getSWF()
获取播放器的 flash object 对象
事件列表
ready
播放器准备就绪后触发的事件
start
开始播放时触发的事件
pause
暂停播放时触发的事件
resume
暂停后继续播放时触发的事件
stop
播放结束后触发的事件
seek
拖动播放时触发的事件。
事件处理函数的参数为 from
, to
。
from
: 定位之前的时间点(单位 秒)to
: 定位指定的时间点(单位 秒)
buffering
缓冲开始或结束时触发的事件
事件处理函数的参数:flag
flag
,是否缓冲中; 取值:0, 否;1, 是
setquality
清晰度改变时触发的事件
事件处理函数的参数:quality
quality
,当前清晰度;取值:0, 普通;1, 清晰;2, 高清
volumechange
音量改变时触发的事件
事件处理函数的参数:vol
vol
,当前音量;取值范围:0 - 1
playerror
当播放失败时的触发的事件
事件处理函数的参数:code
fullscreen
全屏或退出全屏时触发的事件
事件处理函数的参数:flag
。
flag
,是否全屏;取值:0, 否;1, 是