demostf/frontend
1
0
Fork 0
mirror of https://codeberg.org/demostf/frontend.git synced 2026-06-03 18:24:12 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

move help code

Browse source
This commit is contained in:
Robin Appelman 2024-12-07 19:55:52 +01:00
commit 78f7916bb5
2 changed files with 58 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

46
script/viewer/Analyse/Analyser.tsx
View file

@ -17,6 +17,7 @@ import {Session, StateUpdate} from "./Session";
import {DemoHead} from "../../header";
import {EventSearch} from "./EventSearch";
import {Event} from "./Data/Parser";
import {Help} from "./Help";
export enum ModalState {
Closed,
@ -278,50 +279,7 @@ export const Analyser = (props: AnalyseProps) => {
</div>
<Modal isOpen={modalState() === ModalState.Help} onCloseRequest={() => setModalState(ModalState.Closed)}
closeOnOutsideClick={true} overlayClass="modal-overlay" contentClass="modal-content">
<h4>Keyboard Shortcuts</h4>
<table class="shortcuts">
<tbody>
<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>
</tr>
<tr>
<td><kbd>Esc</kbd></td>
<td>Close dialogs</td>
</tr>
</tbody>
</table>
<Help inShared={inShared}/>
</Modal>
<Modal isOpen={modalState() === ModalState.Goto} onCloseRequest={() => setModalState(ModalState.Closed)}
closeOnOutsideClick={true} overlayClass="modal-overlay" contentClass="modal-content">

56
script/viewer/Analyse/Help.tsx Normal file
View file

@ -0,0 +1,56 @@
import {Show} from "solid-js";
export interface HelpProps {
inShared: boolean;
}
export function Help(props: HelpProps) {
return <>
<h4>Keyboard Shortcuts</h4>
<table className="shortcuts">
<tbody>
<Show when={!props.inShared} fallback={<tr>
<td colSpan={2}>Shortcuts not usable as spectator have been hidden</td>
</tr>}>
<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>Ctrl</kbd> + <kbd>F</kbd></td>
<td>Find Event</td>
</tr>
<tr>
<td><kbd>Spacebar</kbd></td>
<td>Play/Pause</td>
</tr>
</Show>
<tr>
<td><kbd>?</kbd></td>
<td>This help menu</td>
</tr>
<tr>
<td><kbd>Esc</kbd></td>
<td>Close dialogs</td>
</tr>
</tbody>
</table>
<h4>Keyboard Shortcuts</h4>
</>
}