diff --git a/client/src/components/video.vue b/client/src/components/video.vue index a2466312..f30b5052 100644 --- a/client/src/components/video.vue +++ b/client/src/components/video.vue @@ -332,8 +332,10 @@ @Watch('volume') onVolumeChanged(volume: number) { - if (this._video) { - this._video.volume = this.volume / 100 + volume /= 100 + + if (this._video && this._video.volume != volume) { + this._video.volume = volume } } @@ -342,10 +344,10 @@ if (this._video && this._video.muted != muted) { this._video.muted = muted this.startsMuted = muted - } - if (!muted) { - this.mutedOverlay = false + if (!muted) { + this.mutedOverlay = false + } } } @@ -365,9 +367,11 @@ @Watch('playing') onPlayingChanged(playing: boolean) { - if (playing) { + if (this._video && this._video.paused && playing) { this.play() - } else { + } + + if (this._video && !this._video.paused && !playing) { this.pause() } } @@ -382,6 +386,7 @@ mounted() { this._container.addEventListener('resize', this.onResise) this.onVolumeChanged(this.volume) + this.onMutedChanged(this.muted) this.onStreamChanged(this.stream) this.onResise() @@ -415,6 +420,19 @@ this.$accessor.video.setPlayable(false) }) + this._video.addEventListener('volumechange', (event) => { + this.$accessor.video.setMuted(this._video.muted) + this.$accessor.video.setVolume(this._video.volume * 100) + }) + + this._video.addEventListener('playing', () => { + this.$accessor.video.play() + }) + + this._video.addEventListener('pause', () => { + this.$accessor.video.pause() + }) + document.addEventListener('focusin', this.onFocus.bind(this)) /* Initialize Guacamole Keyboard */ diff --git a/docs/changelog.md b/docs/changelog.md index 0138c945..acd7bab9 100644 --- a/docs/changelog.md +++ b/docs/changelog.md @@ -17,6 +17,7 @@ - Add japanese characters support. - Sanitize display name and markdown codeblock input to prevent xss. - Display unmute overlay when joined. +- Sync player play/pause/mute/umpute/volume state with store (beneficial for mobiles when using fullscreen mode). ## [n.eko v2.4](https://github.com/m1k1o/neko/releases/tag/v2.4)