Maze-Online

Welcome to the Maze Online Game! This simple web-based game challenges you to navigate through mazes, avoid obstacles, and reach the goal. The game is built using HTML, CSS, and JavaScript. Play this game here 👈

How to Play

1. Objective: Reach the goal represented by the 🎁 emoji while avoiding obstacles (🌳) and staying within the maze boundaries.
2. Controls:

• On desktop, use the arrow keys to move the player (🏃‍♂️).
• On mobile, touch the directional buttons to navigate.

3. Lives: You start with 3 lives (❤️). Colliding with obstacles (🌳) reduces your lives. If you run out of lives, you lose.
4. Winning: Complete all levels to win the game! Your time is recorded, and you can compete to achieve the best time.

Levels

The game includes multiple levels, each represented by a unique maze. As you progress, the mazes become more challenging.

Modal Windows

• Rules Modal: Explains the game rules and controls. Press "ENTER" or touch the screen to start the game.
• Win Modal: Displays when you successfully complete all levels. Shows your score and best time.
• Lose Modal: Appears when you run out of lives. Displays the level reached and encourages you to try again.

Project Structure

• game.js: The main JavaScript file containing the game logic.
• index.html: The HTML file with the game layout and modals.
• maps.js: Defines different maze levels using a 10x10 grid.
• styles.css: The stylesheet for styling the game interface.

How to Run

1. Clone or download the project files.
2. Open the index.html file in a web browser.
3. Create new mazes in maps.js.

Dependencies

• Google Fonts (Press Start 2P): Used for the retro gaming font.
• SVG Icons: Arrow icons for directional buttons.

Contribute

Enjoy playing the Maze Online Game! If you encounter any issues or have suggestions for improvement, feel free to contribute or provide feedback.