iridium/neko-custom
Archived
2
0
Fork 0
Code Pull Requests Activity

Merge branch 'pu/autoplay'

Browse Source
This commit is contained in:
Miroslav Šedivý 2023-03-25 22:19:43 +01:00
commit e868ad4061
1 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
client/src/components/video.vue
View File

@ -232,7 +232,6 @@
private observer = new ResizeObserver(this.onResize.bind(this)) private observer = new ResizeObserver(this.onResize.bind(this))
private focused = false private focused = false
private fullscreen = false private fullscreen = false
private startsMuted = true
private mutedOverlay = true private mutedOverlay = true
get admin() { get admin() {
@ -364,7 +363,6 @@
onMutedChanged(muted: boolean) { onMutedChanged(muted: boolean) {
if (this._video && this._video.muted != muted) { if (this._video && this._video.muted != muted) {
this._video.muted = muted this._video.muted = muted
this.startsMuted = muted
if (!muted) { if (!muted) {
this.mutedOverlay = false this.mutedOverlay = false
@ -395,7 +393,20 @@
try { try {
await this._video.play() await this._video.play()
} catch (err: any) { } catch (err: any) {
this.$accessor.video.pause() if (!this._video.muted) {
// video.play() can fail if audio is set due restrictive
// browsers autoplay policy -> retry with muted audio
try {
this.$accessor.video.setMuted(true)
this._video.muted = true
await this._video.play()
} catch (err: any) {
// if it still fails, we're not playing anything
this.$accessor.video.pause()
}
} else {
this.$accessor.video.pause()
}
} }
} }
@ -434,11 +445,6 @@
this._video.addEventListener('canplaythrough', () => { this._video.addEventListener('canplaythrough', () => {
this.$accessor.video.setPlayable(true) this.$accessor.video.setPlayable(true)
if (this.autoplay) { if (this.autoplay) {
// start as muted due to restrictive browsers autoplay policy
if (this.startsMuted && (!document.hasFocus() || !this.$accessor.active)) {
this.$accessor.video.setMuted(true)
}
this.$nextTick(() => { this.$nextTick(() => {
this.$accessor.video.play() this.$accessor.video.play()
}) })