Update app.py

app.py

@@ -309,25 +309,42 @@ CODE_SYSTEM = (
     "You are an expert HTML5 game developer. "
     "Write a complete, working, single-file HTML5 game using canvas and vanilla JavaScript. "
     "CRITICAL RULES - follow every one exactly: "
-    "1. SPRITES: Declare these at the very top of the script, BEFORE anything else: "
+    "1. SPRITES: Declare these at the very top of the script BEFORE anything else: "
     "   const playerImg = new Image(); playerImg.src = 'sprite_player.png'; "
     "   const bgImg = new Image(); bgImg.src = 'sprite_background.png'; "
     "   const enemyImg = new Image(); enemyImg.src = 'sprite_enemy.png'; "
     "   const keys = new Set(); "
-    "2. IMAGE LOADING: After declaring sprites, use Promise.all: "
+    "2. IMAGE LOADING: After declaring sprites use Promise.all to start the game: "
     "   function loadImg(img) { return new Promise(r => { img.onload = r; }); } "
     "   Promise.all([loadImg(playerImg), loadImg(bgImg), loadImg(enemyImg)]).then(startGame); "
-    "3. startGame function: function startGame() { "
+    "3. startGame function sets up listeners and calls gameLoop: "
+    "   function startGame() { "
     "   window.addEventListener('keydown', e => keys.add(e.key)); "
     "   window.addEventListener('keyup', e => keys.delete(e.key)); "
+    "   canvas.addEventListener('click', onShoot); "
     "   requestAnimationFrame(gameLoop); } "
-    "4. Define gameLoop() and all game logic functions at TOP LEVEL - NOT inside startGame or Promise.then. "
-    "5. GRAVITY: every frame do velY += 0.5 AFTER updating position. "
-    "6. PLATFORMS: set grounded=false BEFORE the loop. Set grounded=true and velY=0 only when player lands. "
-    "7. JUMP: if (grounded && (keys.has('ArrowUp') || keys.has('w') || keys.has(' '))) { velY=-12; grounded=false; } "
-    "8. Always include a full-width ground platform at y=420. "
-    "9. Each frame: FIRST draw background with ctx.drawImage(bgImg, 0, 0, canvas.width, canvas.height). "
-    "10. Draw player/enemies with ctx.drawImage(playerImg, x, y, w, h). "
+    "4. Define gameLoop() and ALL game logic functions at TOP LEVEL - NOT inside startGame or Promise.then. "
+    "5. MOVEMENT RULES DEPEND ON GAME TYPE: "
+    "   FOR TOP-DOWN SHOOTER: NO gravity, NO velY += 0.5, NO grounded variable. "
+    "   Player moves in ALL 4 directions with WASD: "
+    "   if (keys.has('w') || keys.has('ArrowUp')) player.y -= speed; "
+    "   if (keys.has('s') || keys.has('ArrowDown')) player.y += speed; "
+    "   if (keys.has('a') || keys.has('ArrowLeft')) player.x -= speed; "
+    "   if (keys.has('d') || keys.has('ArrowRight')) player.x += speed; "
+    "   FOR TOP-DOWN SHOOTER: Enemies move TOWARD the player each frame: "
+    "   const dx = player.x - enemy.x; const dy = player.y - enemy.y; "
+    "   const dist = Math.sqrt(dx*dx + dy*dy); "
+    "   enemy.x += (dx/dist) * enemy.speed; enemy.y += (dy/dist) * enemy.speed; "
+    "   FOR TOP-DOWN SHOOTER: Left click shoots a bullet toward the mouse position: "
+    "   function onShoot(e) { const rect = canvas.getBoundingClientRect(); "
+    "   const mx = e.clientX - rect.left; const my = e.clientY - rect.top; "
+    "   const dx = mx - player.x; const dy = my - player.y; "
+    "   const dist = Math.sqrt(dx*dx+dy*dy); "
+    "   bullets.push({x: player.x, y: player.y, vx: dx/dist*10, vy: dy/dist*10}); } "
+    "   FOR PLATFORMER: use gravity velY += 0.5, grounded checks, jump with ArrowUp. "
+    "6. Draw background FIRST each frame: ctx.drawImage(bgImg, 0, 0, canvas.width, canvas.height). "
+    "7. Draw player/enemies with ctx.drawImage(playerImg, x, y, w, h). "
+    "8. Always keep player inside canvas boundaries. "
     "Output ONLY the raw HTML - no markdown fences, no explanation, nothing else."
 )