From 1078f31ad16f3d61e6e92483d7167c5bce8b446a Mon Sep 17 00:00:00 2001
From: Ben Harris <bjh21@bjh21.me.uk>
Date: Sun, 12 Oct 2025 13:54:18 +0100
Subject: [PATCH] webstead: support arrow keys for navigation

---
 webstead.xhtml | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/webstead.xhtml b/webstead.xhtml
index 598b7dc..cf8118a 100644
--- a/webstead.xhtml
+++ b/webstead.xhtml
@@ -98,9 +98,29 @@
         }
         update_glyph();
     }
+    function key_handler(e) {
+        var dx = 0, dy = 0;
+        switch (e.key) {
+        case "ArrowLeft":  dx = -1; break;
+        case "ArrowRight": dx = +1; break;
+        case "ArrowUp":    dy = -1; break;
+        case "ArrowDown":  dy = +1; break;
+        default: return;
+        }
+        var x = this.closest("td").cellIndex;
+        var y = this.closest("tr").rowIndex;
+        x = (x + dx + 5) % 5;
+        y = (y + dy + 9) % 9;
+        var target = document.querySelector('#pixels').rows[y].cells[x]
+                     .querySelector('input');
+        target.focus();
+        e.preventDefault();
+    }
     function init() {
-        for (var e of document.querySelectorAll('#pixels input'))
+        for (var e of document.querySelectorAll('#pixels input')) {
             e.onchange = e => update_glyph(true);
+            e.onkeydown = key_handler;
+        }
         document.querySelector('#c').oninput = function(e) {
             from_c(this.value);
             update_glyph(false);
-- 
2.30.2