Noa Player

A simple media player

Use

// noa options
var options = {
  element: document.getElementById('player'),
  title: 'WakabaGirl',
  mediaSource: {
    src: 'https://demo.loacg.com/video/WakabaGirl.m3u8',
    poster: '/poster.png'
  },
  type: Noa.TYPE.NativeHls
}

// init Noa
var noa = new Noa(options)

noa.on(Noa.EVENTS.PLAY, () => {
  console.log('播放器进行播放视频')
})

// button#switchS1
document.querySelector('#switchS1').addEventListener('click', () => {
  console.log('按下了切换视频源1')
  noa.switchSource({
    source: '/cache/wakaba_girl/WakabaGirl.m3u8',
    title: 'WakabaGirl'
  })
})

// button#switchS2
document.querySelector('#switchS2').addEventListener('click', () => {
  console.log('按下了切换视频源2')
  noa.switchSource({
    source: '/cache/shelter/shelter.m3u8',
    title: 'Shelter OVA'
  })
})

Options

| 属性 | 说明 | 类型 | 默认值 | | ----------- | -------------------------------------------- | ----------------- | --------- | | element | 播放器挂载的 DOM 元素 | DocumentElement | #player | | title | 播放器被鼠标激活时，显示在顶部的播放视频标题 | String | - | | mediaSource | 播放媒体元信息 | { MediaSource } | - | | volume | 播放器声音大小 | float(0-1) | 0.4 | | type | 播放器处理媒体类型 | Noa.TYPE | 'auto' | | feedbackUrl | 播放器反馈地址,设置时会显示到菜单 | String | - | | p2pSupport | 支持需要支持 CDNBye 提供的 P2P 功能 | Boolean | false |

{ MediaSource }

| 属性 | 说明 | 类型 | 默认值 | | ------ | -------------- | ------ | ------ | | src | 视频源文件 | String | - | | poster | 视频封面图地址 | String | - | | qa | 视频清晰度标识 | String | - |

ENUM: TYPE

| 属性 | 说明 | | ---------------- | --------------------------- | | NativeDash | DASH 编解码方式 | | NativeHls | HLS (m3u8) 编解码方式 | | NativeFlv | FLV (.flv) 编解码方式 | | HtmlMediaElement | HTML5 (.mp4) 原生 | | HtmlAudioElement | HTML5 (.mp3) 原生 <audio /> |

Function

| 方法名 | 说明 | 响应 | | --------------------------- | ------------------------------------------------- | ---- | | play() | 播放 | - | | pause() | 暂停 | - | | stop() | 停止（进度条回到 0） | - | | seek(time) | 快进或快退到一个时间（Int） | - | | setVolume(volume) | 设置播放器当前音量（浮点数 0 ~ 1） | - | | mute(bool) | 静音（Boolean） | - | | playbackRate(rate) | 播放速度 0.5 | 0.75 | 1 | | 1.25 | 1.5 | 2 | - | | switchSource({ source, title, type = null }) | 切换视频源(切换源 480P,720P...) | - | | on(event, callback, [once]) | 监听播放器事件 | - | | off(event, callback) | 停止一个事件监听 | - | | trigger(event, ...args) | 主动触发一个事件 | - | | notice(text, [time, opacity])| 在播放器内弹出提示 | - | | destroy(force = false) | 立即销毁播放器 | |

Events (Noa.EVENTS)

| 事件名称 | 回调 | 说明 | | --------- | ---------- | -------------------------------------- | | PLAY | - | 播放事件 | | PLAYED | - | 播放结束事件 | | STOP | - | 停止事件 | | MUTED | - | 静音 | | ENDED | - | 播放结束事件 | | SEEK | ({ oldTime, time }) | 快进/快退 | | ERROR | (error) | 加载视频出错事件 | | READY | - | 播放器加载视频帧结束，可以进行播放事件 | | STATS | - | 播放器数据状态更新事件 | | P2P_STATS | - | p2pEngine 数据状态更新事件 |