From ad0c0e4b3cbd9c9502989d72dd62be5df02fcdb9 Mon Sep 17 00:00:00 2001 From: Thibaud Date: Thu, 6 Aug 2026 14:07:46 +0200 Subject: [PATCH] snake: add mouse control --- snake.ts | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/snake.ts b/snake.ts index de597cf..cdac62d 100644 --- a/snake.ts +++ b/snake.ts @@ -8,6 +8,7 @@ const SEGMENT_SPACING = SNAKE_RADIUS * 2 + SNAKE_PADDING; const HEAD_COLOR = 0xf43f5e; const TAIL_COLOR = 0xf4c3cc; const APPLE_COLOR = 0x58f474; +const MOUSE_DEADZONE = 10; const DIRECTIONS = { up: new Vec2d(0, -1), @@ -27,6 +28,7 @@ let velocity: Vec2d = new Vec2d(0, 0); // unit vector let speed = 200; // px/s let interpolation_factor = 10; let paused = false; +let mouse_control = false; let lastTime: number | undefined = undefined; @@ -113,7 +115,19 @@ function init() { apple = randomApple(bounds); - canvas.onmousemove = () => {}; + canvas.onmousemove = (evt) => { + if (!mouse_control) return; + const { clientX, clientY } = evt; + const rect = ctx.canvas.getBoundingClientRect(); + const target = new Vec2d(clientX - rect.left, clientY - rect.top); + const head = snake[0].wrap(bounds); + const delta = target.sub(head); + // MOUSE_DEADZONE prevents jittery movement when the mouse is close to the head + if (delta.length() > MOUSE_DEADZONE) { + const new_velocity = delta.normalize(); + velocity = new_velocity; + } + }; canvas.onclick = () => {}; @@ -126,6 +140,10 @@ function init() { case "ArrowRight": case "d": new_direction = DIRECTIONS.right; break; case "j": interpolation_factor++; break; case "k": interpolation_factor = Math.max(1, interpolation_factor-1); break; + case "m": + mouse_control = !mouse_control; + setStatusLine(`mouse control: ${mouse_control ? "on" : "off"}`); + break; case "Space": case "p": paused = !paused; setStatusLine(paused ? "paused" : "", null);