╭ changed ───────────╮ │src/assets/script.js│ ╰────────────────────╯ ╭───────────╮ │← all files│ ╰───────────╯ ╭─────────────────────────────────────────────────────────────────────────────╮ │ 7 │ │ 8 const MIN_COLS = 30; │ │ 9 │ │10 -// measured once after the font is loaded. recomputed lazily if they ever│ │11 -// read back as zero (e.g. measured before the font was actually ready). │ │10 +// measured once after the font is loaded. recomputed lazily if it ever │ │11 +// reads back as zero (e.g. measured before the font was actually ready).│ │12 let cellWidth = null; │ │13 -let cellHeight = null; │ │13 │ │15 -function measureCellSize() { │ │14 +function measureCellWidth() { │ │15 const probe = document.createElement("span"); │ │16 probe.style.position = "absolute"; │ │17 probe.style.visibility = "hidden"; │ ╰─────────────────────────────────────────────────────────────────────────────╯ ╭────────────────────────────────────────────────────────────╮ │18 probe.style.whiteSpace = "pre"; │ │19 probe.textContent = "X".repeat(100); │ │20 grid.appendChild(probe); │ │22 - const rect = probe.getBoundingClientRect(); │ │21 + const w = probe.getBoundingClientRect().width / 100;│ │22 probe.remove(); │ │24 - cellWidth = rect.width / 100; │ │25 - cellHeight = rect.height; │ │23 + return w; │ │24 } │ │25 │ │26 function maxCols() { │ ╰────────────────────────────────────────────────────────────╯ ╭─────────────────────────────────────────────────────────────────────────────────────╮ │29 - if (!cellWidth) measureCellSize(); │ │27 + if (!cellWidth) cellWidth = measureCellWidth(); │ │28 return Math.max(MIN_COLS, Math.floor(document.body.clientWidth / cellWidth));│ │29 } │ │30 │ ╰─────────────────────────────────────────────────────────────────────────────────────╯ ╭──────────────────────────────────────────────────────────────────────────────────────────────╮ │74 }); │ │75 │ │76 grid.addEventListener("click", (event) => { │ │79 - // ensure cellWidth/cellHeight are measured before converting pixels to grid cells│ │80 - maxCols(); │ │81 - const rect = grid.getBoundingClientRect(); │ │82 - const col = Math.floor((event.clientX - rect.left) / cellWidth); │ │83 - const row = Math.floor((event.clientY - rect.top) / cellHeight); │ │84 - if (col < 0 || row < 0) return; │ │85 - wasmInstance.exports._onMouseClick(col, row); │ │77 + const span = event.target.closest(".clickable"); │ │78 + if (!span) return; │ │79 + const focusId = Number(span.dataset.focusId); │ │80 + wasmInstance.exports._onMouseClick(focusId); │ │81 wasmInstance.exports._tick(maxCols()); │ │82 }); │ │83 │ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯