Add opacity shortcut for video annotation

Author: lehecht

resources/assets/js/videos/components/settingsTab.vue

@@ -1,6 +1,7 @@
 <script>
 import PowerToggle from '../../core/components/powerToggle';
 import Settings from '../stores/settings';
+import Keyboard from '../../core/keyboard';
 
 export default {
     components: {
@@ -87,6 +88,13 @@ export default {
         handleUnmuteVideo() {
             this.muteVideo = false;
         },
+        toggleAnnotationOpacity() {
+            if (this.annotationOpacity > 0) {
+                this.annotationOpacity = 0;
+            } else {
+                this.annotationOpacity = 1;
+            }
+        },
     },
     watch: {
         annotationOpacity(value) {
@@ -145,6 +153,8 @@ export default {
         this.restoreKeys.forEach((key) => {
             this[key] = Settings.get(key);
         });
+
+        Keyboard.on('o', this.toggleAnnotationOpacity);
     },
 };
 </script>

resources/assets/js/videos/videoContainer.vue

@@ -175,6 +175,9 @@ export default {
         },
         reachedTrackedAnnotationLimit() {
             return this.disableJobTracking;
+        },
+        annotationsAreHidden() {
+            return this.settings.annotationOpacity === 0;
         }
     },
     methods: {

resources/views/videos/show/sidebar-settings.blade.php

@@ -1,4 +1,4 @@
-<sidebar-tab name="settings" icon="cog" title="Settings">
+<sidebar-tab name="settings" icon="cog" title="Settings" :highlight="annotationsAreHidden">
     <settings-tab inline-template
         v-on:update="handleUpdatedSettings"
         :supports-jump-by-frame="supportsJumpByFrame"