From 213d2c6753da8a3ea177a437ba1832baca723d9f Mon Sep 17 00:00:00 2001
From: Robin Appelman <robin@icewind.nl>
Date: Mon, 2 Dec 2024 23:56:52 +0100
Subject: [PATCH] hide shortcuts for spectators

---
 script/viewer/Analyse/Analyser.tsx | 55 +++++++++++++++++-------------
 style/pages/viewer/Analyser.css    |  4 +++
 2 files changed, 35 insertions(+), 24 deletions(-)

diff --git a/script/viewer/Analyse/Analyser.tsx b/script/viewer/Analyse/Analyser.tsx
index 36c1ccc..ddbcb5d 100644
--- a/script/viewer/Analyse/Analyser.tsx
+++ b/script/viewer/Analyse/Analyser.tsx
@@ -266,30 +266,37 @@ export const Analyser = (props: AnalyseProps) => {
                 <h4>Keyboard Shortcuts</h4>
                 <table class="shortcuts">
                     <tbody>
-                    <tr>
-                        <td><kbd>.</kbd></td>
-                        <td>Next tick</td>
-                    </tr>
-                    <tr>
-                        <td><kbd>,</kbd></td>
-                        <td>Previous tick</td>
-                    </tr>
-                    <tr>
-                        <td><kbd>⇒</kbd></td>
-                        <td>0.5s forward</td>
-                    </tr>
-                    <tr>
-                        <td><kbd>⇐</kbd></td>
-                        <td>0.5s backwards</td>
-                    </tr>
-                    <tr>
-                        <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
-                        <td>Goto tick</td>
-                    </tr>
-                    <tr>
-                        <td><kbd>Spacebar</kbd></td>
-                        <td>Play/Pause</td>
-                    </tr>
+                    <Show when={!inShared}>
+                        <tr>
+                            <td><kbd>.</kbd></td>
+                            <td>Next tick</td>
+                        </tr>
+                        <tr>
+                            <td><kbd>,</kbd></td>
+                            <td>Previous tick</td>
+                        </tr>
+                        <tr>
+                            <td><kbd>⇒</kbd></td>
+                            <td>0.5s forward</td>
+                        </tr>
+                        <tr>
+                            <td><kbd>⇐</kbd></td>
+                            <td>0.5s backwards</td>
+                        </tr>
+                        <tr>
+                            <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
+                            <td>Goto tick</td>
+                        </tr>
+                        <tr>
+                            <td><kbd>Spacebar</kbd></td>
+                            <td>Play/Pause</td>
+                        </tr>
+                    </Show>
+                    <Show when={inShared}>
+                        <tr>
+                            <td colspan={2}>Shortcuts no usable as spectator have been hidden</td>
+                        </tr>
+                    </Show>
                     <tr>
                         <td><kbd>?</kbd></td>
                         <td>This help menu</td>
diff --git a/style/pages/viewer/Analyser.css b/style/pages/viewer/Analyser.css
index e22ffca..2eb8753 100644
--- a/style/pages/viewer/Analyser.css
+++ b/style/pages/viewer/Analyser.css
@@ -127,6 +127,10 @@ kbd {
     overflow: auto;
     max-height: 90%;
     max-width: 90%;
+
+    &:focus-visible {
+        outline: none;
+    }
 }
 
 .modal-content input[type="text"] {