feat(keybinds): draw the macropad beside the list

The pad glyph on each row was too small to read. The left fifth of the
overlay now draws the pad at size, each key labelled with its plain
action; hovering a key or an encoder lists everything it does, held
keys and turn direction spelled out. padActions() in Binds.js inverts
the grouped rows into that per-key list, and PAD's turn values became
words for it. The panel is pinned at a fixed height: centred, it moved
whenever the hovered key's list changed length.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

1 files changed, 16 insertions, 4 deletions

diff --git a/keybinds/test_binds.js b/keybinds/test_binds.js
index 08be66a..df1e4b5 100644
--- a/keybinds/test_binds.js
+++ b/keybinds/test_binds.js
@@ -18,7 +18,7 @@ const assert = require("assert");
 
 const src = fs.readFileSync(__dirname + "/Binds.js", "utf8")
     .replace(/^\.pragma library$/m, "");
-const B = new Function(src + "\nreturn { mods, keys, group, PAD };")();
+const B = new Function(src + "\nreturn { mods, keys, group, PAD, padActions };")();
 
 assert.deepStrictEqual(B.mods(0), []);
 assert.deepStrictEqual(B.mods(65), ["Win", "SHIFT"]);
@@ -41,7 +41,7 @@ assert.deepStrictEqual(B.group([
         { keys: "Win + w", label: "Browser", pad: { key: 1 } },
         { keys: "Win + e", label: "Files" },
     ] },
-    { name: "Media", rows: [{ keys: "Mute", label: "Mute", pad: { knob: "top", turn: "●" } }] },
+    { name: "Media", rows: [{ keys: "Mute", label: "Mute", pad: { knob: "top", turn: "Press" } }] },
     { name: "Other", rows: [{ keys: "ALT + x", label: "No colon here" }] },
     { name: "Undescribed", rows: [{ keys: "Win + s", label: "no description" }] },
 ]);
@@ -57,8 +57,20 @@ assert.deepStrictEqual(B.group([
 assert.deepStrictEqual(B.PAD["Win + SHIFT + r"], { key: 2, mod: "Shift" });
 assert.deepStrictEqual(B.PAD["CTRL + ALT + SHIFT + l"], { key: 4, mod: "Alt" });
 assert.deepStrictEqual(B.PAD["CTRL + F1"], { key: 9 });
-assert.deepStrictEqual(B.PAD["Win + CTRL + SHIFT + F4"], { key: 12, mod: "Win Shift" });
-assert.deepStrictEqual(B.PAD["Win + Previous song"], { knob: "bottom", turn: "↺", mod: "Win" });
+assert.deepStrictEqual(B.PAD["Win + CTRL + SHIFT + F4"], { key: 12, mod: "Win + Shift" });
+assert.deepStrictEqual(B.PAD["Win + Previous song"], { knob: "bottom", turn: "Turn left", mod: "Win" });
 assert.strictEqual(B.PAD["toString"], undefined);
 
+// Everything one pad key or encoder does, plain press first as listed.
+assert.deepStrictEqual(B.padActions(B.group([
+    { modmask: 64, key: "w", description: "Apps: Browser" },
+    { modmask: 65, key: "w", description: "Apps: Private browser" },
+    { modmask: 0, key: "XF86AudioRaiseVolume", description: "Media: Volume up" },
+    { modmask: 64, key: "XF86AudioRaiseVolume", description: "Keyboard: Next layout" },
+    { modmask: 64, key: "e", description: "Apps: Files" },
+])), Object.assign(Object.create(null), {
+    k1: [{ how: "Press", label: "Browser" }, { how: "Shift + Press", label: "Private browser" }],
+    top: [{ how: "Turn right", label: "Volume up" }, { how: "Win + Turn right", label: "Next layout" }],
+}));
+
 console.log("ok");