add video mute event.

This commit is contained in:
Miroslav Šedivý 2020-11-29 12:06:01 +01:00
parent 0d5a447e13
commit 6fa8c3c1f8
3 changed files with 13 additions and 1 deletions

View File

@ -20,10 +20,12 @@ export function register(el: HTMLVideoElement, state: Video) {
Vue.set(state, 'playing', false) Vue.set(state, 'playing', false)
}) })
el.addEventListener('volumechange', (value) => { el.addEventListener('volumechange', (value) => {
Vue.set(state, 'muted', el.muted)
Vue.set(state, 'volume', el.volume) Vue.set(state, 'volume', el.volume)
}) })
// Initial state // Initial state
Vue.set(state, 'muted', el.muted)
Vue.set(state, 'volume', el.volume) Vue.set(state, 'volume', el.volume)
Vue.set(state, 'playing', !el.paused) Vue.set(state, 'playing', !el.paused)
} }

View File

@ -83,6 +83,7 @@
playable: false, playable: false,
playing: false, playing: false,
volume: 0, volume: 0,
muted: false,
fullscreen: false, fullscreen: false,
}, },
control: { control: {
@ -156,6 +157,14 @@
this._video.pause() this._video.pause()
} }
public mute() {
this._video.muted = true
}
public unmute() {
this._video.muted = false
}
public setVolume(value: number) { public setVolume(value: number) {
if (value < 0 || value > 1) { if (value < 0 || value > 1) {
throw new Error('Out of range. Value must be between 0 and 1.') throw new Error('Out of range. Value must be between 0 and 1.')

View File

@ -26,6 +26,7 @@ export interface Video {
playable: boolean playable: boolean
playing: boolean playing: boolean
volume: number volume: number
muted: boolean
fullscreen: boolean fullscreen: boolean
} }