可以播放hevc的webPlayer
npm install tmkhevcwebplayerjavascript
var pl=new Player(options);
`
其中,options值为下列表格
----
|键|类型|说明|
|------------------- | -------------| -------------|
|video | Element |video组件,用于定位.可对其进行样式设置,以及定位.在没有硬解接口的浏览器,此控件将被重置.
|pauseCallback | function |暂停后执行的函数
|stopCallback | function |停止后执行的函数
|playCallback | function |播放后执行的函数
|timeChangeCallback | function |播放时间改变后执行的函数,其中参数为当前播放时间(单位:秒)
|loadedCallback | function |视频加载后执行的回调函数,其中参数为视频相关参数.
|decoderJsPath | string |这里设置decoder.Js的路径,方便cdn,不设置则默认当前js路径下的decoder.js
|downloadJsPath | string |这里设置download.Js的路径,方便cdn,不设置则默认当前js路径下的download.js
----
注意:如果html页面中使用了内嵌script则必须传值decoderJsPath与downloadJsPath,并且保持js文件的文件结构(index.js除外,js不建议放在html内嵌中执行.而是单独使用js文件进行执行)
######上表中loadedCallback参数
`javascript
v = { // 视频相关参数
a: { // 音频参数 safari才有此值
f: 0, // 比特率
c: 0, // 声道数
r: 0, // 采样率
},
v: { // 视频参数(分辨率)
w: 0, // 宽度 非容器样式宽度
h: 0// 高度 非容器样式高度
},
duration: 100, // 时长,单位:秒,
canvas: this.canvas // 画布
}
`
注意:
在执行第二步之前且首次手指触控事件时必须执行如下语句,其目的是为了兼容safari,否则在safari不播放
`javascript
GlobalAudioCtx = new (window.AudioContext || window.webkitAudioContext)();
GlobalAudioCtx.suspend();
`
第二步 加载视频
以第一步定义的变量pl作为例子
使用pl的方法loadSource(url,options,callback);
`javascript
const opt = {
preload: "auto",
fluid: true,
language: "zh_CN",
inactivityTimeout: false,
controlBar: {
children: [
{ name: 'playToggle' }, // 播放按钮
{ name: 'currentTimeDisplay' }, // 当前已播放时间
// { name: "timeDivider" },
{ name: 'durationDisplay' }, // 总时间
{ name: 'progressControl' }, // 播放进度条
{ // 倍数播放
name: 'playbackRateMenuButton',
'playbackRates': [0.5, 1, 1.5, 2]
},
{ name: 'FullscreenToggle' }, // 全屏
{
name: 'volumePanel', // 音量控制
inline: false, // 不使用水平方式
},
]
},
};
pl.loadSource("视频url地址(首尾不能有空格,换行符,要是真正的url)", opt, () => {
// pl.play();
}); // 加载视频
`
至此,视频就算是正常加载完毕.
方法
----
|方法名称|说明|
| ------------ | ------------ |
|loadSource|加载视频,参数为 (视频url,options,回调函数)|
|play |播放|
|pause |暂停|
|stop |停止|
|seek |跳转,参数(时间(单位:秒))|
|volume |设置视频声音,参数:百分比,1代表100% 2表示200% 0.5表示50%(页面声音,非设备声音)|
----
#广告 部分使用说明
用法
前置依赖jquery.js
引入文件 mad.js
`javascript
ad = new mad(param);
``