视频 使用说明

引入js文件夹下的webPlayer.mini.js,与style文件夹下的webPlayer.mini.css

第一步 创建播放器

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参数

    v = { // 视频相关参数
      a: { // 音频参数 safari才有此值
        f: 0, // 比特率
        c: 0, // 声道数
        r: 0, // 采样率
      },
      v: { // 视频参数(分辨率)
        w: 0, // 宽度 非容器样式宽度
        h: 0// 高度 非容器样式高度
      },
      duration: 100, // 时长,单位:秒,
      canvas: this.canvas // 画布
    }

注意: 在执行第二步之前且首次手指触控事件时必须执行如下语句,其目的是为了兼容safari,否则在safari不播放

GlobalAudioCtx = new (window.AudioContext || window.webkitAudioContext)();
GlobalAudioCtx.suspend();

第二步 加载视频

以第一步定义的变量pl作为例子 使用pl的方法loadSource(url,options,callback);

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

ad = new mad(param);

param数据类型为数组.其成员为对象,详情见下表

|键|类型|说明| |------------------- | -------------| -------------| |img | string |广告图片url| |audio | string |广告音频url| |video | string |广告视频url,**注意:**此值添加后,将取缔img与audio的值.| |url | string |点击广告后跳转的url| |style | string |当前广告外框的样式| |class | string |当前广告的class列表,定义广告出现的位置等信息均在此设置| |start | string |自动出现广告的时间.需要配合方法time一起使用.| |createFun | function |广告创建后执行的函数| |closeFun | function |广告关闭后执行的函数|

对象方法

var time="当前播放时间(单位:秒)" ad.time(time); 此方法使用后,当time大于之前设置的start值时,相应的广告将会弹出.

ad.show(index,run) 此方法使用后,将显示param下标index的广告. ad.close(index,run) 此方法使用后,将关闭param下标index的广告. index: 定义广告时,param数组的下标. run为bool型数据,为true时,将会在 show/close 时运行之前定义的函数 createFun/closeFun