Create a polished, playable **2D boss-rush action game** for...
Prompt
Create a polished, playable **2D boss-rush action game** for the browser using **HTML5 Canvas, vanilla JavaScript, HTML, and CSS**. The game should be inspired by the fast-paced run-and-gun boss combat, expressive animation, and dodge-focused gameplay associated with classic cartoon boss games such as *Cuphead*, while using **completely original characters, visuals, animations, names, attacks, and assets**. The result should feel like a small but complete game prototype rather than a tech demo. ## Core Goal Build a responsive boss-rush game centered around: * Precise movement * Jumping and dodging * Dash mechanics * Projectile shooting * Weapon switching * Parrying * Multi-phase boss battles * Pattern recognition * Responsive collision detection * Frame-based animation * Clear game-state transitions Prioritize **game feel, responsiveness, readable attacks, and clean architecture** over elaborate artwork. --- ## 1. Project Requirements Use: * HTML5 Canvas * Vanilla JavaScript * HTML/CSS * `requestAnimationFrame()` for the main game loop * Delta-time-aware movement where appropriate * No external game engines * No required external libraries * No copyrighted game assets Organize the code into logical systems/classes such as: * `Game` * `GameStateManager` * `InputManager` * `Player` * `Boss` * `Projectile` * `Particle` * `CollisionManager` * `Animation` * `Level` * `UIManager` Avoid putting the entire game into one massive function. If practical, structure the project into separate files such as: ```text /index.html /styles.css /js/game.js /js/player.js /js/boss.js /js/projectiles.js /js/input.js /js/collision.js /js/particles.js /js/ui.js ``` If a single-file implementation is more appropriate for easy testing, clearly separate each system into labeled sections. --- ## 2. Main Menu and Level Selection Create a polished main menu with: * Game title * Start button * Level/boss selection * Controls/help panel * Selected weapon display Include at least **3 selectable boss encounters**. Each boss should have a distinct theme and attack style, for example: * Boss 1: projectile-heavy * Boss 2: melee/environmental hazards * Boss 3: fast multi-phase bullet-pattern encounter Locked levels are optional. The player should be able to return to the level-selection screen after winning or losing. --- ## 3. Player Controller Create a player character with responsive controls. ### Movement Support: * Move left * Move right * Jump * Optional variable jump height * Gravity * Ground detection * Optional limited air control Example keyboard controls: ```text A / Left Arrow = Move Left D / Right Arrow = Move Right Space = Jump Shift = Dash J / Z = Shoot K / X = Parry Q / C = Switch Weapon Esc = Pause ``` Keep all controls centralized so they can easily be changed. --- ## 4. Dash System Implement a responsive dash mechanic. The dash should include: * Horizontal burst movement * Short duration * Cooldown or reset condition * Temporary change in velocity * Optional brief invulnerability window * Afterimage or trail particles * Visual feedback when the dash begins and ends Prevent accidental infinite dash spam. The dash should feel significantly faster than normal movement. --- ## 5. Shooting System Allow the player to shoot continuously or rapidly while holding the fire button. Include at least **two weapons**. ### Spread Characteristics: * Multiple projectiles fired in a cone * High close-range damage * Shorter range * Several projectile angles ### Chaser Characteristics: * Lower damage * Homing behavior * Searches for the boss or nearest valid target * Smooth steering rather than instant snapping Create weapon definitions/configuration objects so new weapons can easily be added. Example: ```javascript const weapons = { spread: { damage: 4, cooldown: 180, projectileSpeed: 500 }, chaser: { damage: 2, cooldown: 130, projectileSpeed: 380, homing: true } }; ``` Show the currently equipped weapon in the HUD. --- ## 6. Boss System Create a reusable boss architecture. Each boss should support: * Maximum health * Current health * Multiple attack phases * Phase-specific attacks * Animation state * Collision hitbox * Damage reaction * Invulnerability states if needed * Death animation/state * Attack cooldowns * Telegraph animations Boss behavior should be driven by a state machine rather than random uncontrolled behavior. Example states: ```text IDLE INTRO ATTACK MOVE TRANSITION STUNNED DEFEATED ``` --- ## 7. Multi-Phase Boss Battles Each encounter should contain at least **3 phases**. Example: ### Phase 1 — 100% to 70% HP * Basic projectile patterns * Slow movement * Long telegraphs ### Phase 2 — 70% to 35% HP * Faster attacks * Environmental hazards * More movement ### Phase 3 — 35% to 0% HP * Aggressive attack combinations * Faster projectile patterns * Reduced recovery time * More complex dodging requirements Transitions should be visually obvious. During a transition: * Briefly stop normal attacks * Play an animation/effect * Change boss behavior * Introduce the new pattern --- ## 8. Dodgeable Attack Patterns Create several reusable boss attacks. Examples: * Horizontal projectiles requiring a jump * High projectiles requiring the player to stay grounded * Sweeping attacks * Falling hazards * Radial bullet bursts * Tracking projectiles * Ground shockwaves * Charging attacks * Moving walls * Delayed explosions Attacks should have **clear telegraphs** before becoming dangerous. Avoid unavoidable damage. Every attack should have a reasonably readable counterplay such as: * Jump * Dash * Move away * Move underneath * Parry * Position between projectiles --- ## 9. Collision Detection Implement responsive and reliable collision detection. Use clearly defined hitboxes separate from visual sprites where useful. Support collisions between: * Player and platforms * Player and hostile projectiles * Player and boss attacks * Player bullets and bosses * Player and parryable objects * Boss and environment if needed Use AABB, circles, or other simple shapes appropriate for each object. Add optional developer/debug mode capable of displaying hitboxes. Do not tie important collision logic directly to sprite artwork. --- ## 10. Health and Damage Create a central game-state system that tracks: ### Player * Current HP * Maximum HP * Invulnerability frames after taking damage * Death state * Optional flashing effect during invulnerability ### Boss * Current HP * Maximum HP * Current phase * Defeated state Display: * Player health * Boss health bar * Boss phase feedback * Current weapon The player should not take repeated damage every frame while overlapping an enemy hitbox. --- ## 11. Parry Mechanic Implement a parry system. Some enemy objects should be visually distinguished as **parryable**. When the player performs a parry near or while contacting a parryable object: * Cancel or destroy the target * Bounce the player upward or outward * Create particles * Play a strong visual flash * Reward the player Optionally reward successful parries with: * Special meter * Faster weapon recharge * Score * Temporary damage bonus The parry timing window should be intentionally limited but forgiving enough for a prototype. --- ## 12. Animation System Use frame-based animation. Create an animation helper capable of defining: ```javascript { frames: [...], frameDuration: 80, loop: true } ``` Player animation states should include at minimum: * Idle * Run * Jump * Fall * Shoot * Dash * Hurt * Parry * Death Boss animation states should correspond to: * Idle * Attacks * Phase transitions * Damage * Death If sprite sheets are unavailable, use procedural shapes or placeholder sprite frames while keeping the animation architecture ready for sprite-sheet replacement. --- ## 13. Visual Style Use a clean **hand-drawn-cartoon-inspired prototype aesthetic**, but do not reproduce copyrighted characters or assets. Visual goals: * Strong silhouettes * Exaggerated squash/stretch * Slight animation overshoot * Clear projectile colors/shapes * Impact flashes * Dust * Sparks * Dash trails * Screen shake * Hit particles Use Canvas primitives where needed: * Circles * Rectangles * Curves * Lines * Simple procedural character shapes Gameplay clarity is more important than detailed artwork. --- ## 14. Juice and Game Feel Add lightweight polish such as: * Screen shake on strong hits * Impact freeze/hit-stop * Muzzle flashes * Dash particles * Landing particles * Boss damage flashes * Player damage flashing * Parry burst * Phase-transition effects * Smooth health-bar animation * Camera shake Keep these systems configurable so effects can easily be adjusted or disabled. --- ## 15. Game State Manager Implement explicit states such as: ```text MENU LEVEL_SELECT BOSS_INTRO PLAYING PAUSED PLAYER_DEAD BOSS_DEFEATED VICTORY ``` The state manager should determine: * What gets updated * What gets rendered * Which controls are active * When the game restarts * When menus appear Avoid scattered boolean flags such as: ```javascript isPlaying isDead isMenu isPaused isWon ``` when a centralized state machine would be cleaner. --- ## 16. Pause, Restart, Win, and Loss Include: * Pause functionality * Restart current encounter * Return to level select * Victory screen * Defeat screen On boss defeat: * Stop damaging attacks * Trigger a defeat animation/effect * Show victory UI * Allow replay or return to menu On player death: * Stop normal gameplay * Show defeat UI * Allow immediate restart --- ## 17. Performance Use object cleanup and lightweight pooling where useful. Remove projectiles and particles when: * They leave the screen * Their lifespan expires * They collide * Their owning phase ends Avoid unnecessary object creation inside extremely hot loops. The game should remain smooth with dozens or hundreds of projectiles onscreen. --- ## 18. Responsive Canvas Make the game work at different browser sizes. Use: * A fixed logical resolution * Canvas scaling * Correct coordinate conversion * Aspect-ratio preservation For example: ```text Logical resolution: 1280 × 720 ``` Scale the rendered canvas to the available viewport without changing gameplay physics. --- ## 19. Debug Tools Include an optional debug mode toggled with a key such as `F2`. Debug mode may display: * FPS * Player hitbox * Boss hitbox * Projectile hitboxes * Player velocity * Current boss state * Current boss phase * Number of active projectiles * Number of particles Keep debug functionality separate from normal gameplay. --- ## 20. Code Quality Write clear, maintainable code. Requirements: * Use descriptive function and variable names * Add comments around important systems * Avoid unnecessary global variables * Keep rendering separate from update logic * Store balance values in configuration objects * Make weapons, attacks, and bosses data-driven where practical * Avoid unexplained magic numbers * Prevent duplicated collision or input logic Favor code such as: ```javascript player.update(dt); boss.update(dt); projectiles.update(dt); collisionManager.resolve(); renderer.draw(); ``` over one giant game-loop function. --- ## 21. Deliverable Provide a **fully runnable implementation**, not pseudocode. The final answer should include: 1. Complete file/folder structure 2. Full source code for every required file 3. Setup/run instructions 4. Controls 5. Short architecture explanation 6. Explanation of how to add a new weapon 7. Explanation of how to add a new boss phase 8. Any known limitations The project should run by opening `index.html` or through a simple local HTTP server. Do not leave essential systems as: ```javascript // TODO ``` or omit code with statements such as: ```text implement the rest similarly ``` Every essential gameplay system should be functional. --- ## Acceptance Criteria Before presenting the finished implementation, verify that: * The player can move and jump * Dash works and produces a visible trail * Player can shoot * Weapon switching works * Spread behaves differently from Chaser * Bosses can take damage * Boss health is displayed * Boss phases change based on health * Boss attacks require active dodging * Player can take damage * Damage includes invulnerability frames * Parryable attacks exist * Parry works * Win and loss states work * Restart works * Level selection works * At least 3 boss encounters are selectable * Animations update by frame * Projectiles are cleaned up correctly * Collision detection remains responsive * No fatal console errors occur during normal play Build the game incrementally if necessary, but **the final response must contain the complete integrated version** rather than stopping after an initial scaffold.
A system prompt was added to support web rendering