*

1 files changed, 34 insertions, 1 deletions

diff --git a/html/rogue/js/rogue.js b/html/rogue/js/rogue.js
index 72c53f1..3e8b12e 100644
--- a/html/rogue/js/rogue.js
+++ b/html/rogue/js/rogue.js
@@ -18,12 +18,30 @@ const initGame = () => {
         time: 0,
         player: createPlayer(100, 100), // Starting position
         camera: createCamera(0, 0),
-        world: createWorld()
+        world: createWorld(),
+        debug: {
+            enabled: false,
+            mouseX: 0,
+            mouseY: 0
+        }
     };
     
     // Make gameState globally accessible
     window.gameState = gameState;
 
+    // Add mouse move listener
+    canvas.addEventListener('mousemove', (e) => {
+        gameState.debug.mouseX = e.clientX + gameState.camera.x;
+        gameState.debug.mouseY = e.clientY + gameState.camera.y;
+    });
+
+    // Add debug toggle listener
+    window.addEventListener('keydown', (e) => {
+        if (e.key === 'd') {
+            gameState.debug.enabled = !gameState.debug.enabled;
+        }
+    });
+
     // Game loop
     const gameLoop = (timestamp) => {
         // Calculate delta time
@@ -127,6 +145,21 @@ const render = (ctx, state) => {
         1  // Only render the grass line
     );
 
+    // Render debug information if enabled
+    if (state.debug.enabled) {
+        ctx.restore(); // Restore the original transform for screen-space rendering
+        
+        // Set up debug text style
+        ctx.fillStyle = '#ffffff';
+        ctx.font = '14px monospace';
+        
+        // Display coordinates
+        const text = `x: ${Math.round(state.debug.mouseX)}, y: ${Math.round(state.debug.mouseY)}`;
+        ctx.fillText(text, 10, ctx.canvas.height - 20);
+    } else {
+        ctx.restore(); // Make sure we still restore even when debug is disabled
+    }
+
     ctx.restore();
 };