From 82744e6a4adf5f3fe0551f81286eb8ccb1d5e3e9 Mon Sep 17 00:00:00 2001 From: Adam French Date: Fri, 21 Nov 2025 23:42:52 +0000 Subject: [PATCH] copy states first --- html/js/mobile-automata.mjs | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/html/js/mobile-automata.mjs b/html/js/mobile-automata.mjs index 6e3c7c2..8e2caa5 100644 --- a/html/js/mobile-automata.mjs +++ b/html/js/mobile-automata.mjs @@ -295,16 +295,30 @@ export function renderToCanvas(canvas, width, height, sn = 0, dn = 0) { const img = ctx.createImageData(width, height); const data = img.data; + for (let y = 0; y < height; y++) { + for (let x = 0; x < width; x++) { + const idx = (y * width + x) * 4; + const color = states[y][x] ? colorOn : colorOff; + + data[idx] = color[0]; // R + data[idx + 1] = color[1]; // G + data[idx + 2] = color[2]; // B + data[idx + 3] = 255; // A + } + } + const colorOn = [0, 0, 139]; // dark blue (active cell) const colorOff = [0, 0, 70]; // darker blue (inactive cell) + ctx.putImageData(img); + function step() { // calculate new state let [newState, newHead] = cyclicMaStep(rules, [states[row_num], head], r); states[row_num] = newState; - // write row to ImageData - for (let x = 0; x < width; x++) { + // write changed cells to ImageData + for (let x = head - r; x <= head + r; x++) { const idx = (row_num * width + x) * 4; const val = newState[x] ? colorOn : colorOff; data[idx] = val[0]; // R