diff --git a/resources/assets/js/videos/components/settingsTab.vue b/resources/assets/js/videos/components/settingsTab.vue index 1bdc77d05..412937125 100644 --- a/resources/assets/js/videos/components/settingsTab.vue +++ b/resources/assets/js/videos/components/settingsTab.vue @@ -16,6 +16,7 @@ export default { 'showMousePosition', 'showProgressIndicator', 'jumpStep', + 'muteVideo' ], annotationOpacity: 1, showMinimap: true, @@ -25,6 +26,7 @@ export default { playbackRate: 1.0, jumpStep: 5.0, showProgressIndicator: true, + muteVideo: true, }; }, methods: { @@ -52,6 +54,12 @@ export default { handleHideProgressIndicator() { this.showProgressIndicator = false; }, + handleMuteVideo() { + this.muteVideo = true; + }, + handleUnmuteVideo() { + this.muteVideo = false; + }, }, watch: { annotationOpacity(value) { @@ -93,6 +101,10 @@ export default { this.$emit('update', 'showProgressIndicator', show); Settings.set('showProgressIndicator', show); }, + muteVideo(show) { + this.$emit('update', 'muteVideo', show); + Settings.set('muteVideo', show); + }, }, created() { this.restoreKeys.forEach((key) => { diff --git a/resources/assets/js/videos/stores/settings.js b/resources/assets/js/videos/stores/settings.js index aaa1cc71b..d73f14d72 100644 --- a/resources/assets/js/videos/stores/settings.js +++ b/resources/assets/js/videos/stores/settings.js @@ -8,6 +8,7 @@ let defaults = { showMousePosition: false, showProgressIndicator: true, jumpStep: 5.0, + muteVideo: true, }; export default new Settings({ diff --git a/resources/assets/js/videos/videoContainer.vue b/resources/assets/js/videos/videoContainer.vue index 21f659bea..6ba753606 100644 --- a/resources/assets/js/videos/videoContainer.vue +++ b/resources/assets/js/videos/videoContainer.vue @@ -69,6 +69,7 @@ export default { playbackRate: 1.0, jumpStep: 5.0, showProgressIndicator: true, + muteVideo: true, }, openTab: '', urlParams: { @@ -671,6 +672,9 @@ export default { 'settings.playbackRate'(rate) { this.video.playbackRate = rate; }, + 'settings.muteVideo'(mute) { + this.video.muted = mute; + }, urlParams: { deep: true, handler(params) { @@ -697,7 +701,7 @@ export default { this.initAnnotationFilters(); this.restoreUrlParams(); - this.video.muted = true; + this.video.muted = this.settings.muteVideo; this.video.preload = 'auto'; this.video.addEventListener('error', function (e) { if (e.target.error.code === MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED) { diff --git a/resources/views/manual/tutorials/videos/sidebar.blade.php b/resources/views/manual/tutorials/videos/sidebar.blade.php index 303ae22b0..e05c0fa9d 100644 --- a/resources/views/manual/tutorials/videos/sidebar.blade.php +++ b/resources/views/manual/tutorials/videos/sidebar.blade.php @@ -75,5 +75,9 @@
The mouse position switch controls the display of an additional map overlay that shows the current position of the cursor on the video in pixels.
+ ++ The mute video switch enables or disables the audio track of the video. +
@endsection diff --git a/resources/views/videos/show/sidebar-settings.blade.php b/resources/views/videos/show/sidebar-settings.blade.php index ff256c397..a9b06e8df 100644 --- a/resources/views/videos/show/sidebar-settings.blade.php +++ b/resources/views/videos/show/sidebar-settings.blade.php @@ -39,6 +39,10 @@