Add hotkeys

This commit is contained in:
kwaroran
2025-03-20 14:37:12 +09:00
parent 4c67ce4410
commit f5f05bdf99
6 changed files with 377 additions and 77 deletions

View File

@@ -0,0 +1,73 @@
<script lang="ts">
import { language } from "src/lang";
import { DBState } from "src/ts/stores.svelte";
</script>
{#if window.innerWidth < 768}
<span class="text-red-500">
{language.screenTooSmall}
</span>
{:else}
<table>
<thead>
<tr>
<th>{language.hotkey}</th>
</tr>
</thead>
<tbody>
{#each DBState.db.hotkeys as hotkey}
<tr>
<td>{language.hotkeyDesc[hotkey.action]}</td>
<td>
<button
class:text-textcolor={hotkey.ctrl}
class:text-textcolor2={!hotkey.ctrl}
onclick={() => {
hotkey.ctrl = !hotkey.ctrl;
}}
>
Ctrl
</button>
</td>
<td>
<button
class:text-textcolor={hotkey.shift}
class:text-textcolor2={!hotkey.shift}
onclick={() => {
hotkey.shift = !hotkey.shift;
}}
>
Shift
</button>
</td>
<td>
<button
class:text-textcolor={hotkey.alt}
class:text-textcolor2={!hotkey.alt}
onclick={() => {
hotkey.alt = !hotkey.alt;
}}
>
Alt
</button>
</td>
<td>
<input
value={hotkey.key === ' ' ? "SPACE" : hotkey.key?.toLocaleUpperCase()}
class="bg-bgcolor border-none w-16"
onkeydown={(e) => {
e.preventDefault();
hotkey.key = e.key;
}}
>
</td>
</tr>
{/each}
</tbody>
</table>
{/if}

View File

@@ -21,6 +21,7 @@
import ThanksPage from "./Pages/ThanksPage.svelte";
import ModuleSettings from "./Pages/Module/ModuleSettings.svelte";
import { isLite } from "src/ts/lite";
import HotkeySettings from "./Pages/HotkeySettings.svelte";
let openLoreList = $state(false)
if(window.innerWidth >= 900 && $SettingsMenuIndex === -1 && !$MobileGUI){
@@ -122,6 +123,15 @@
<UserIcon />
<span>{language.account} & {language.files}</span>
</button>
<button class="flex gap-2 items-center hover:text-textcolor"
class:text-textcolor={$SettingsMenuIndex === 15}
class:text-textcolor2={$SettingsMenuIndex !== 15}
onclick={() => {
$SettingsMenuIndex = 15
}}>
<ActivityIcon />
<span>{language.hotkey}</span>
</button>
{#if !$isLite}
<button class="flex gap-2 items-center hover:text-textcolor"
class:text-textcolor={$SettingsMenuIndex === 6}
@@ -186,6 +196,8 @@
<PromptSettings onGoBack={() => {
$SettingsMenuIndex = 1
}}/>
{:else if $SettingsMenuIndex === 15}
<HotkeySettings/>
{:else if $SettingsMenuIndex === 77}
<ThanksPage/>
{/if}