diff options
Diffstat (limited to 'html/rogue/js')
-rw-r--r-- | html/rogue/js/rogue.js | 35 |
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(); }; |