neko/src/component/internal/video.ts
2020-11-29 12:06:01 +01:00

32 lines
888 B
TypeScript

import Vue from 'vue'
import { Video } from '../types/state'
export function register(el: HTMLVideoElement, state: Video) {
el.addEventListener('canplaythrough', () => {
Vue.set(state, 'playable', true)
})
el.addEventListener('playing', () => {
Vue.set(state, 'playing', true)
})
el.addEventListener('pause', () => {
Vue.set(state, 'playing', false)
})
el.addEventListener('emptied', () => {
Vue.set(state, 'playable', false)
Vue.set(state, 'playing', false)
})
el.addEventListener('error', () => {
Vue.set(state, 'playable', false)
Vue.set(state, 'playing', false)
})
el.addEventListener('volumechange', (value) => {
Vue.set(state, 'muted', el.muted)
Vue.set(state, 'volume', el.volume)
})
// Initial state
Vue.set(state, 'muted', el.muted)
Vue.set(state, 'volume', el.volume)
Vue.set(state, 'playing', !el.paused)
}