AI-Assisted Space Survival Game: Create a standalone HTML file containing CSS and JavaScript to generate an "Avoid the Asteroids" Canvas mini-game rapidly developed with an AI programming assistant (e.g., Trae).
AI-Assisted Space Survival Game: Create a standalone HTML file containing CSS and JavaScript to generate an "Avoid the Asteroids" Canvas mini-game rapidly developed with an AI programming assistant (e.g., Trae). The interface must implement the following core modules through Canvas rendering and keyboard event driving: Player & Asteroid System: Define a player spaceship object (containing coordinates, velocity) and an array of asteroids. Asteroids spawn randomly at the top of the screen with varying sizes, speeds, and colors, descending linearly. Dual-Mode Control & Boundaries: Support spaceship movement in eight directions within the canvas using both WASD and arrow keys, with boundary detection to prevent the ship from exiting the screen. Collision Detection & Game State: Implement Axis-Aligned Bounding Box (AABB) collision detection. The game ends immediately if the spaceship collides with any asteroid. Manage and switch between three states: start, playing, and game over. Scoring & Visual Feedback: Track the score based on the number of asteroids successfully passed (reaching the bottom of the screen). Visually render a triangular spaceship and irregular polygon asteroids using Canvas. Game Loop & Control: Drive the main game loop (containing state updates, collision detection, and drawing) using requestAnimationFrame, and provide start and restart buttons for control. The interface must use a deep-space black theme with neon green accents, with all code consolidated into a single file.
