diff --git a/bun.lock b/bun.lock index 309a3e2..106d2d4 100644 --- a/bun.lock +++ b/bun.lock @@ -17,6 +17,7 @@ "mongodb": "^7.0.0", "openai": "^6.9.0", "sass": "^1.94.0", + "scope-extensions-js": "^1.1.0", "unocss-preset-animations": "^1.3.0", }, "devDependencies": { @@ -894,6 +895,8 @@ "sax": ["sax@1.4.3", "", {}, "sha512-yqYn1JhPczigF94DMS+shiDMjDowYO6y9+wB/4WgO0Y19jWYk0lQ4tuG5KI7kj4FTp1wxPj5IFfcrz/s1c3jjQ=="], + "scope-extensions-js": ["scope-extensions-js@1.1.0", "", {}, "sha512-SbxLXgaw2R04te1dfviB0HHzD2dPcOQh/CFSn0JiJ9EHTFCqA0rOOMfIwqi/oN2cQlaiWR/zQLCwSCtJ0bYF5Q=="], + "secure-json-parse": ["secure-json-parse@2.7.0", "", {}, "sha512-6aU+Rwsezw7VR8/nyvKTx8QpWH9FrcYiXXlqC4z5d5XQBDRqtbfsRjnwGyqbi3gddNtWHuEk9OANUotL26qKUw=="], "semver": ["semver@7.7.3", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q=="], diff --git a/package.json b/package.json index 067751f..a13cce6 100644 --- a/package.json +++ b/package.json @@ -45,6 +45,7 @@ "mongodb": "^7.0.0", "openai": "^6.9.0", "sass": "^1.94.0", + "scope-extensions-js": "^1.1.0", "unocss-preset-animations": "^1.3.0" } } diff --git a/src/routes/song/[slug]/+page.svelte b/src/routes/song/[slug]/+page.svelte index dc96df6..702cbc1 100644 --- a/src/routes/song/[slug]/+page.svelte +++ b/src/routes/song/[slug]/+page.svelte @@ -7,6 +7,7 @@ import { isKana, isKanji, toHiragana, toKatakana } from "wanakana"; import { composeList, fuzzyEquals } from "./IMEHelper.ts"; import MenuItem from "../../../components/material3/MenuItem.svelte"; + import "scope-extensions-js"; let { data }: PageProps = $props() @@ -16,11 +17,13 @@ let hiddenInput: HTMLInputElement let inp = $state("") - // TODO: Persist settings - let settings = $state({ + + // Settings stored in localStorage + let settings = $state(localStorage.getItem('kashi-dash-settings')?.let(it => JSON.parse(it)) ?? { isFuri: true, allKata: false }) + $effect(() => localStorage.setItem('kashi-dash-settings', JSON.stringify(settings))) const preprocessKana = (kana: string) => settings.allKata ? toKatakana(kana) : kana // Process each line into segments with swi (start word index) and kanji/kana @@ -52,9 +55,16 @@ let now = $state(Date.now()) onMount(() => { - hiddenInput.focus() // TODO: auto focus when focus lost + // Auto focus & refocus + hiddenInput.focus() + const onBlur = () => setTimeout(() => hiddenInput?.focus(), 10) + hiddenInput.addEventListener('blur', onBlur) + const interval = setInterval(() => { if (startTime) now = Date.now() }, 1000) - return () => clearInterval(interval) + return () => { + clearInterval(interval) + hiddenInput?.removeEventListener('blur', onBlur) + } }) // On input changed: Convert to hiragana, compare with current position, update states