Monorepo for Aesthetic.Computer
aesthetic.computer
hud: default-on filled hitbox debug overlay for tap-area inspection
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
+6
-10
+6
-10
system/public/aesthetic.computer/lib/disk.mjs
+6
-10
system/public/aesthetic.computer/lib/disk.mjs
···
15194
15194
};
15195
15195
15196
15196
// DEBUG: Add hitbox visualization overlay
15197
-
if (globalThis.debugHudHitbox && currentHUDButton) {
15197
+
// TEMP: default-on fill visualization to inspect tap area height. Toggle off via `toggleHudHitboxDebug()`.
15198
+
if (globalThis.debugHudHitbox !== false && currentHUDButton) {
15198
15199
const hitboxWidth = currentHUDButton.box.w;
15199
15200
const hitboxHeight = currentHUDButton.box.h;
15200
-
const blinkFrame = Number($api.paintCount || 0n);
15201
-
const blinkOn = (blinkFrame % 30) < 15;
15202
-
const outerAlpha = blinkOn ? 200 : 80;
15203
-
const innerAlpha = blinkOn ? 120 : 40;
15204
15201
15205
15202
const hitboxOverlay = $api.painting(hitboxWidth, hitboxHeight, ($) => {
15206
15203
$.unpan();
15207
15204
$.unmask(); // Ensure hitbox overlay renders without piece mask
15208
-
// Draw a blinking green border to show the hitbox
15209
-
$.ink(0, 255, 0, outerAlpha).box(0, 0, hitboxWidth, hitboxHeight, "outline");
15210
-
if (hitboxWidth > 2 && hitboxHeight > 2) {
15211
-
$.ink(0, 255, 0, innerAlpha).box(1, 1, hitboxWidth - 2, hitboxHeight - 2, "outline");
15212
-
}
15205
+
// Solid translucent magenta fill so the tap area is clearly visible
15206
+
$.ink(255, 0, 180, 90).box(0, 0, hitboxWidth, hitboxHeight);
15207
+
// Bright outline on top for precise edge inspection
15208
+
$.ink(0, 255, 0, 220).box(0, 0, hitboxWidth, hitboxHeight, "outline");
15213
15209
});
15214
15210
15215
15211
sendData.hitboxDebug = {