Keep controls table while editing

This commit is contained in:
2024-05-15 22:10:55 +02:00
parent 76decaf203
commit 5f780c751a
7 changed files with 89 additions and 117 deletions

View File

@@ -7,11 +7,12 @@ const IS_INVALID = 'is-invalid';
const currentWord = /** @type {HTMLInputElement} */ (document.getElementById('current-word'));
const wordInput = /** @type {HTMLInputElement} */ (document.getElementById('word-input'));
const buttons = /** @type {HTMLDivElement} */ (document.getElementById('input-buttons'));
const controlsButton = /** @type {HTMLButtonElement} */ (document.getElementById('controls-button'));
const clearButton = /** @type {HTMLButtonElement} */ (document.getElementById('clear-button'));
const light = /** @type {HTMLDivElement} */ (document.getElementById('light'));
const container = /** @type {HTMLDivElement} */ (document.getElementById('state-graph'));
const displayGraphButton = /** @type {HTMLButtonElement} */ (document.getElementById('display-graph'));
const controls = /** @type {HTMLElement} */ (document.getElementById('controls'));
const sidebarToggle = /** @type {HTMLElement} */ (document.getElementById('sidebar-toggle'));
/**
* @param {string} name
@@ -25,11 +26,11 @@ export function openAutomaton(name, states, editable = false) {
const viewer = new GraphEditor();
viewer.readonly = !editable;
if (editable) {
controlsButton.removeAttribute('hidden');
sidebarToggle.removeAttribute('hidden');
container.classList.remove('blurred');
displayGraphButton.setAttribute('hidden', 'hidden');
} else {
controlsButton.setAttribute('hidden', 'hidden');
sidebarToggle.setAttribute('hidden', 'hidden');
container.classList.add('blurred');
displayGraphButton.removeAttribute('hidden');
}
@@ -146,6 +147,11 @@ displayGraphButton.addEventListener('click', () => {
displayGraphButton.setAttribute('hidden', 'hidden');
});
sidebarToggle.addEventListener('click', () => {
console.log('toggle');
controls.classList.toggle('has-sidebar');
});
/**
* @param {import('./examples.js').State[]} states
* @returns {number[]}