Skip to content

feat: Add Main Menu, Character Selection, and Pause Menu#262

Merged
r4pt0s merged 5 commits into
zero-to-mastery:mainfrom
EXE901:feat/main-menu-system
Oct 24, 2025
Merged

feat: Add Main Menu, Character Selection, and Pause Menu#262
r4pt0s merged 5 commits into
zero-to-mastery:mainfrom
EXE901:feat/main-menu-system

Conversation

@EXE901
Copy link
Copy Markdown
Member

@EXE901 EXE901 commented Oct 22, 2025

Summary

This PR implements a complete menu system for ZTM-Quest, including a main menu, character selection, and in-game pause functionality.

Features Added

1. Main Menu (#6)

  • Created a new main menu scene that displays on game start
  • Added New Game, Continue, Settings, Stats, Achievements, and Credits buttons
  • Continue button only shows when valid save data exists
  • Integrated with existing modal system for settings/credits
  • Smooth transition to gameplay

2. Pause Menu (#260)

  • Added in-game pause menu functionality via ESC key
  • Pause menu works across all game scenes
  • Options to Resume, Settings, or Quit to Main Menu
  • Settings integration with game reset functionality

3. Character Selection (#261)

  • Implemented character picker modal with all available playable characters
  • Added glowing hover effects on character names for better UX
  • Character selection is saved to gameState and persists across sessions
  • Fixed player sprite to correctly display selected character in-game
  • Character persists on Continue

Technical Changes

Files Modified

  • index.html - Updated UI structure for main menu and modals
  • src/main.js - Added menu scene registration
  • src/scenes/start.js - Apply selected character on player spawn
  • src/factories/player.factory.js - Fixed player sprite initialization
  • src/utils/settings.js - Updated reset game progress functionality
  • src/utils/gameState.js - Character persistence in localStorage

Files Added

  • src/scenes/mainMenuScene.js - Main menu implementation
  • src/utils/characterSelect.js - Character selection modal
  • src/utils/menuModals.js - Menu modal utilities

Testing

  • ✅ Main menu displays on game start
  • ✅ Character selection works and persists
  • ✅ Selected character appears correctly in-game
  • ✅ Continue button only shows with valid save data
  • ✅ Pause menu opens/closes with ESC
  • ✅ Reset Game Progress clears all data correctly
  • ✅ All modal interactions work correctly
  • ✅ No console errors

Closes

Checklist

  • Code follows project style guidelines
  • All features tested and working
  • No console errors
  • Branch is up-to-date with main
  • Commit messages are clear and descriptive

Summary

This PR implements a complete menu system for ZTM-Quest, including a main menu, character selection, and in-game pause functionality.

Features Added

1. Main Menu (#6)

  • Created a new main menu scene that displays on game start
  • Added New Game, Continue, Settings, Stats, Achievements, and Credits buttons
  • Continue button only shows when valid save data exists
  • Integrated with existing modal system for settings/credits
  • Smooth transition to gameplay

2. Pause Menu (#260)

  • Added in-game pause menu functionality via ESC key
  • Pause menu works across all game scenes
  • Options to Resume, Settings, or Quit to Main Menu
  • Settings integration with game reset functionality

3. Character Selection (#261)

  • Implemented character picker modal with all available playable characters
  • Added glowing hover effects on character names for better UX
  • Character selection is saved to gameState and persists across sessions
  • Fixed player sprite to correctly display selected character in-game
  • Character persists on Continue

Technical Changes

Files Modified

  • index.html - Updated UI structure for main menu and modals
  • src/main.js - Added menu scene registration
  • src/scenes/start.js - Apply selected character on player spawn
  • src/factories/player.factory.js - Fixed player sprite initialization
  • src/utils/settings.js - Updated reset game progress functionality
  • src/utils/gameState.js - Character persistence in localStorage

Files Added

  • src/scenes/mainMenuScene.js - Main menu implementation
  • src/utils/characterSelect.js - Character selection modal
  • src/utils/menuModals.js - Menu modal utilities

Testing

  • ✅ Main menu displays on game start
  • ✅ Character selection works and persists
  • ✅ Selected character appears correctly in-game
  • ✅ Continue button only shows with valid save data
  • ✅ Pause menu opens/closes with ESC
  • ✅ Reset Game Progress clears all data correctly
  • ✅ All modal interactions work correctly
  • ✅ No console errors

Closes

Checklist

  • Code follows project style guidelines
  • All features tested and working
  • No console errors
  • Branch is up-to-date with main
  • Commit messages are clear and descriptive

…ctionality

- Add main menu scene with Start Game, Settings, Credits buttons
- Implement character selection modal with glowing hover effects
- Implement in-game pause menu accessible via ESC key
- Fix player sprite to correctly use selected character on spawn
- Add character persistence via localStorage
- Update start.js to apply selected character using changePlayerSprite utility
- Integrate all features with existing modal system

Closes zero-to-mastery#6, Closes zero-to-mastery#260, Closes zero-to-mastery#261
…ctionality

- Add main menu scene with Start Game, Settings, Credits buttons
- Implement character selection modal with glowing hover effects
- Implement in-game pause menu accessible via ESC key
- Fix player sprite to correctly use selected character on spawn
- Add character persistence via localStorage
- Update start.js to apply selected character using changePlayerSprite utility
- Integrate all features with existing modal system

Closes zero-to-mastery#6, Closes zero-to-mastery#260, Closes zero-to-mastery#261
Copy link
Copy Markdown
Collaborator

@r4pt0s r4pt0s left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good job @EXE901.
Can you please make the changes according to my comments?
Thank you 🙏🏻

Comment thread src/utils/menuModals.js Outdated
Comment thread src/utils/menuModals.js Outdated
Comment thread src/utils/characterSelect.js Outdated
- Move HTML templates from menuModals.js to index.html
- Move character select styles from characterSelect.js to global.css

Addresses the feedback in PR zero-to-mastery#262
@EXE901
Copy link
Copy Markdown
Member Author

EXE901 commented Oct 23, 2025

Hi, @r4pt0s

Check out the new commit and let me know if there is anything else wanted.

Thanks!

Copy link
Copy Markdown
Collaborator

@r4pt0s r4pt0s left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well done @EXE901 🙌🏻🎉

@r4pt0s r4pt0s merged commit 2cd7c73 into zero-to-mastery:main Oct 24, 2025
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add Character Selection Menu to Main Menu Add Pause Menu During Gameplay Set up main menu for the game

2 participants