119 lines
3.1 KiB
TypeScript
119 lines
3.1 KiB
TypeScript
import './styles.css'
|
|
import { CustomKeyboard, CustomKeyboardOptions } from "./keyboard";
|
|
import { AutoCorrect } from './autocorrect';
|
|
import { WebTTSOutput } from "audiogame-tools/engine/tts/outputs/webtts";
|
|
import { TTS } from "audiogame-tools/engine/tts";
|
|
import Resonator from "audiogame-tools/engine/resonator";
|
|
import { UIWindow, Button, Text, List, ListItem, Checkbox } from "./ui";
|
|
import { DOMNavigator } from './dom-nav';
|
|
import { ItemFocusEvent } from './eventing/events';
|
|
import { RadioGroup } from './ui/radio-group';
|
|
|
|
|
|
const tts = new TTS(new WebTTSOutput());
|
|
const sound = new Resonator();
|
|
const keyChar = sound.loadImmediate(`keyChar.wav`);
|
|
const keyFocus = sound.loadImmediate(`keyDelete.wav`);
|
|
const sfxCorrect = sound.loadImmediate(`macroSet.wav`);
|
|
|
|
|
|
|
|
let corrector: AutoCorrect;
|
|
|
|
let currentWord = '';
|
|
|
|
setupAutoCorrect();
|
|
|
|
|
|
const keyboardContainer = document.getElementById('custom-keyboard') as HTMLElement;
|
|
const keyboardLayout: CustomKeyboardOptions = {
|
|
leftKeys: [
|
|
['q', 'w', 'e', 'r', 't'],
|
|
['a', 's', 'd', 'f', 'g'],
|
|
['z', 'x', 'c', 'v'],
|
|
['⇧', '⌫', ' '],
|
|
],
|
|
rightKeys: [
|
|
['y', 'u', 'i', 'o', 'p'],
|
|
['h', 'j', 'k', 'l', ';'],
|
|
['b', 'n', 'm', ', ', '.'],
|
|
[' ', '↩', '⇩'],
|
|
],
|
|
};
|
|
|
|
const customKeyboard = new CustomKeyboard(keyboardContainer, keyboardLayout);
|
|
customKeyboard.on('keyDown', (event: CustomEvent) => {
|
|
keyFocus.play();
|
|
speak(event.detail.key);
|
|
});
|
|
customKeyboard.on('keyUp', (event: CustomEvent) => {
|
|
keyChar.play();
|
|
// speak(event.detail.key);
|
|
speak(currentWord);
|
|
if (event.detail.key !== " ") {
|
|
currentWord += event.detail.key;
|
|
} else {
|
|
if (!corrector) return;
|
|
const corrected = corrector.correct(currentWord, 4);
|
|
if (corrected) {
|
|
speak(corrected);
|
|
sfxCorrect.play();
|
|
}
|
|
currentWord = '';
|
|
}
|
|
});
|
|
|
|
customKeyboard.show();
|
|
|
|
|
|
async function setupAutoCorrect() {
|
|
const res = await fetch(`dictionary.json`);
|
|
const dictionary = await res.json();
|
|
corrector = new AutoCorrect(dictionary);
|
|
sfxCorrect.play();
|
|
}
|
|
|
|
function speak(text: string) {
|
|
tts.stop();
|
|
tts.speak(text);
|
|
}
|
|
|
|
/**
|
|
|
|
const win = new UIWindow("Test window");
|
|
const btn = new Button("Here is a button");
|
|
btn.onClick(() => speak(`Button clicked`));
|
|
win.add(btn);
|
|
win.add(new Button("Here is another button"));
|
|
win.add(new Text("Here is some text"));
|
|
win.add(new Text("And some more text"));
|
|
const list = new List("A list view");
|
|
list.add(new ListItem("Entry one"));
|
|
list.add(new ListItem("Entry two"));
|
|
win.add(list);
|
|
const radio = new RadioGroup("Select one", [{
|
|
key: "meow", value: "Meow"
|
|
},
|
|
{ key: "woof", value: "Woof" },
|
|
{ key: "rawr", value: "Rawr" }]);
|
|
win.add(radio);
|
|
const checkbox = new Checkbox("Toggle me");
|
|
win.add(checkbox);
|
|
document.getElementById("app")?.appendChild(win.show() as any);
|
|
|
|
const nav = new DOMNavigator(document.body);
|
|
|
|
nav.registerHandler<ItemFocusEvent>("ItemFocusEvent", (ev) => {
|
|
keyFocus.play();
|
|
speak(ev.data?.friendlyName!);
|
|
if (nav.hasSiblings()) {
|
|
sfxCorrect.play();
|
|
}
|
|
})
|
|
*/
|
|
|
|
const testTTS = document.createElement("button");
|
|
testTTS.addEventListener("click", e => {
|
|
speak(`Meow`);
|
|
});
|
|
document.getElementById("app")?.appendChild(testTTS); |