Update app.py

app.py

@@ -312,46 +312,63 @@ def _inject_sprites(html_code: str, sprite_map: dict) -> str:
 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. Declare sprites at the very top of the script BEFORE anything else: "
+    "CRITICAL RULES - follow every one exactly, copy the patterns EXACTLY as written: "
+    "1. Declare at the very top of script: "
     "   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. Use Promise.all to wait for ALL images before starting: "
+    "   const bullets = []; "
+    "   const enemies = []; "
+    "2. Use Promise.all to wait for images: "
     "   function loadImg(img) { return new Promise(r => { img.onload = r; }); } "
     "   Promise.all([loadImg(playerImg), loadImg(bgImg), loadImg(enemyImg)]).then(startGame); "
-    "3. function startGame() sets up listeners and starts the loop: "
+    "3. startGame() MUST look exactly like this: "
     "   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 functions at TOP LEVEL not inside startGame or .then(). "
-    "5. FOR TOP-DOWN SHOOTER - STRICT RULES: "
-    "   a. NO gravity, NO velY += 0.5, NO grounded variable. "
-    "   b. Player starts at CENTER of canvas: player = {x: canvas.width/2 - 24, y: canvas.height/2 - 24, w: 48, h: 48, speed: 4}. "
-    "   c. 4-direction WASD movement - clamp inside canvas after each move. "
-    "   d. BULLETS travel straight UPWARD at constant speed -10 px/frame: "
-    "      function onShoot(e) { bullets.push({x: player.x + player.w/2 - 4, y: player.y, w: 8, h: 16, vy: -10}); } "
-    "      Each frame: b.y += b.vy; remove bullet when b.y + b.h < 0. "
-    "      NEVER use mouse position to set bullet direction - bullets ALWAYS go straight up. "
-    "   e. Enemies spawn at top (y=0), fall straight down: e.y += e.speed each frame. "
-    "      Remove enemy when e.y > canvas.height. "
-    "   f. Draw enemies: ctx.drawImage(enemyImg, e.x, e.y, e.w, e.h). "
-    "   g. RESTART: define a reset() function that resets ALL game variables to initial values "
-    "      and calls requestAnimationFrame(gameLoop). "
-    "      Show restart button on canvas game-over screen that calls reset() when clicked. "
-    "6. FOR PLATFORMER - STRICT RULES: "
-    "   a. Gravity: velY += 0.5 every frame AFTER updating position. "
-    "   b. Set grounded=false BEFORE platform loop. Inside loop set grounded=true and velY=0 on landing. "
-    "   c. Jump only when grounded: ArrowUp/W/Space sets velY=-12. "
-    "   d. Always include full-width ground platform at y=420. "
-    "   e. RESTART: define reset() that resets player position and lives, calls requestAnimationFrame(gameLoop). "
-    "7. Draw bgImg FIRST each frame: ctx.drawImage(bgImg, 0, 0, canvas.width, canvas.height). "
-    "8. Draw player: ctx.drawImage(playerImg, player.x, player.y, player.w, player.h). "
-    "9. Keep player inside canvas at all times. "
-    "Output ONLY the raw HTML - no markdown fences, no explanation, nothing else."
+    "     window.addEventListener('keydown', e => keys.add(e.key)); "
+    "     window.addEventListener('keyup', e => keys.delete(e.key)); "
+    "     canvas.addEventListener('click', onShoot); "
+    "     requestAnimationFrame(gameLoop); } "
+    "4. Define ALL functions at TOP LEVEL not inside startGame or .then(). "
+    "5. FOR TOP-DOWN SHOOTER ONLY - copy this EXACT player setup and movement: "
+    "   let player = {x: canvas.width/2 - 24, y: canvas.height/2 - 24, w: 48, h: 48, speed: 4}; "
+    "   Inside gameLoop() move player like this EXACTLY: "
+    "   if (keys.has('w') || keys.has('W') || keys.has('ArrowUp'))    { player.y -= player.speed; } "
+    "   if (keys.has('s') || keys.has('S') || keys.has('ArrowDown'))  { player.y += player.speed; } "
+    "   if (keys.has('a') || keys.has('A') || keys.has('ArrowLeft'))  { player.x -= player.speed; } "
+    "   if (keys.has('d') || keys.has('D') || keys.has('ArrowRight')) { player.x += player.speed; } "
+    "   player.x = Math.max(0, Math.min(canvas.width - player.w, player.x)); "
+    "   player.y = Math.max(0, Math.min(canvas.height - player.h, player.y)); "
+    "6. FOR TOP-DOWN SHOOTER ONLY - bullet fires on MOUSE CLICK, travels straight UP: "
+    "   function onShoot(e) { "
+    "     bullets.push({x: player.x + player.w/2 - 4, y: player.y - 16, w: 8, h: 16, vy: -10}); } "
+    "   Inside gameLoop() update bullets: "
+    "   for (let i = bullets.length-1; i >= 0; i--) { "
+    "     bullets[i].y += bullets[i].vy; "
+    "     ctx.fillStyle='yellow'; ctx.fillRect(bullets[i].x, bullets[i].y, 8, 16); "
+    "     if (bullets[i].y + 16 < 0) { bullets.splice(i, 1); continue; } "
+    "     for check enemy collision and remove both bullet and enemy if hit } "
+    "7. FOR TOP-DOWN SHOOTER ONLY - enemies spawn every 120 FRAMES (use a frameCount variable): "
+    "   let frameCount = 0; "
+    "   Inside gameLoop(): frameCount++; "
+    "   if (frameCount % 120 === 0) spawn ONE new enemy at random x, y=0. "
+    "   Enemy size 32x32, speed 1.5. Draw with ctx.drawImage(enemyImg, e.x, e.y, 32, 32). "
+    "   Each frame: e.y += e.speed. Remove enemy if e.y > canvas.height. "
+    "   If enemy overlaps player: health -= 1, remove enemy. "
+    "8. FOR TOP-DOWN SHOOTER ONLY - RESTART: "
+    "   function reset() { "
+    "     player.x = canvas.width/2-24; player.y = canvas.height/2-24; "
+    "     bullets.length=0; enemies.length=0; "
+    "     score=0; health=3; frameCount=0; "
+    "     requestAnimationFrame(gameLoop); } "
+    "   When health <= 0: stop loop, draw GAME OVER text on canvas, "
+    "   draw a clickable RESTART button on canvas, "
+    "   add ONE-TIME canvas click listener that calls reset() and removes itself. "
+    "9. FOR PLATFORMER ONLY: gravity velY+=0.5, jump ArrowUp/W/Space velY=-12 when grounded. "
+    "   Set grounded=false BEFORE platform loop. Set grounded=true and velY=0 only on landing. "
+    "   Always include full-width ground platform at y=420. "
+    "10. Draw bgImg FIRST each frame: ctx.drawImage(bgImg, 0, 0, canvas.width, canvas.height). "
+    "Output ONLY the raw HTML - no markdown fences, no explanation."
 )
 
 def generate_game_code(game_type: str, theme: str, temperature: float, max_new_tokens: int):