|
|
@ -6,6 +6,7 @@ const IS_INVALID = 'is-invalid';
|
|
|
|
|
|
|
|
|
|
|
|
const wordInput = /** @type {HTMLInputElement} */ (document.getElementById('word-input'));
|
|
|
|
const wordInput = /** @type {HTMLInputElement} */ (document.getElementById('word-input'));
|
|
|
|
const buttons = /** @type {HTMLDivElement} */ (document.getElementById('input-buttons'));
|
|
|
|
const buttons = /** @type {HTMLDivElement} */ (document.getElementById('input-buttons'));
|
|
|
|
|
|
|
|
const clearButton = /** @type {HTMLButtonElement} */ (document.getElementById('clear-button'));
|
|
|
|
const light = /** @type {HTMLDivElement} */ (document.getElementById('light'));
|
|
|
|
const light = /** @type {HTMLDivElement} */ (document.getElementById('light'));
|
|
|
|
|
|
|
|
|
|
|
|
mermaid.initialize({
|
|
|
|
mermaid.initialize({
|
|
|
@ -80,7 +81,6 @@ for (const letter of alphabet) {
|
|
|
|
// Reacts to input in the text box
|
|
|
|
// Reacts to input in the text box
|
|
|
|
wordInput.addEventListener('input', () => {
|
|
|
|
wordInput.addEventListener('input', () => {
|
|
|
|
const value = wordInput.value;
|
|
|
|
const value = wordInput.value;
|
|
|
|
console.log(value);
|
|
|
|
|
|
|
|
builder = '';
|
|
|
|
builder = '';
|
|
|
|
state = 0;
|
|
|
|
state = 0;
|
|
|
|
for (const letter of value) {
|
|
|
|
for (const letter of value) {
|
|
|
@ -91,4 +91,11 @@ wordInput.addEventListener('input', () => {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
clearButton.addEventListener('click', () => {
|
|
|
|
|
|
|
|
wordInput.value = '';
|
|
|
|
|
|
|
|
builder = '';
|
|
|
|
|
|
|
|
state = 0;
|
|
|
|
|
|
|
|
updateUIState();
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
updateUIState();
|
|
|
|
updateUIState();
|
|
|
|