From 1ef531914ac4a33b6de9f99842d564a3455ce323 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Mon, 23 Mar 2026 13:59:51 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20Fix=20page=20scrollin?=
 =?UTF-8?q?g=20when=20playing=20Mario=20game?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: EiJackGH <172181576+EiJackGH@users.noreply.github.com>
---
 .Jules/palette.md        |  4 ++++
 src/views/mario-game.njk | 10 +++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/.Jules/palette.md b/.Jules/palette.md
index e565b3e..8ee612f 100644
--- a/.Jules/palette.md
+++ b/.Jules/palette.md
@@ -8,3 +8,7 @@
 ## 2024-05-20 - Dynamic Progress Bar for Quiet CLI Tasks
 **Learning:** For long-running CLI processes that suppress verbose logging (e.g., `--quiet`), users lose system status visibility.
 **Action:** Implemented a dynamic progress bar using `\r` and `flush=True`, conditional on `sys.stdout.isatty()`, to provide status feedback without polluting non-interactive logs.
+
+## 2025-03-23 - Game Key Scrolling
+**Learning:** Browsers natively scroll the page when users press Space or Arrow keys. When building a web-based game, this creates a frustrating UX where the game viewport jumps around while playing.
+**Action:** Always call `e.preventDefault()` on keydown events for typical game controls ("Space", "ArrowUp", etc.) when the focus is on a game container or the body.
diff --git a/src/views/mario-game.njk b/src/views/mario-game.njk
index 45c251a..8a3c1fd 100644
--- a/src/views/mario-game.njk
+++ b/src/views/mario-game.njk
@@ -72,7 +72,15 @@
   let score = 0;
 
   // Jump mechanic
-  document.addEventListener("keydown", () => {
+  document.addEventListener("keydown", (e) => {
+    // Prevent default page scrolling for typical game keys
+    if (["Space", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(e.code)) {
+      e.preventDefault();
+    }
+
+    // Only jump on Space or Up Arrow
+    if (e.code !== "Space" && e.code !== "ArrowUp") return;
+
     if (jumping) return;
 
     jumping = true;