This project consists in the creation of a browser-based game using HTML, CSS, JavaScript, DOM manipulation, and Object-Oriented Programming (OOP).
This is a remake of the first game I ever played, back in the 80’s. Paperboy. I wanted to make a simple browser version, where the player "shoots" the newspaper and avoid cars and rocks. But still keeping some of the arcade from the 80's nostalgia.
- Render a game in the browser.
- Have logic for winning and/or losing and show feedback to the player in either case:
- The game must have logic that allows the player to win or lose.
- The game code must be organized in separate files for HTML, CSS, and JavaScript.
- Use plain JavaScript for DOM manipulation.
- The game entities and elements must be organized using classes and OOP.
Paperboy is an arcade action game developed and published by Atari Games, released in 1985. The player controls a paperboy on a bicycle delivering newspapers along a suburban street. The player attempts to deliver a week of daily newspapers to subscribing customers, attempts to vandalize non-subscribers' homes, and must avoid hazards along the street. Subscribers are lost by missing a delivery or damaging a subscriber's house. If the player loses all of their lives, or runs out of subscribers, the game ends.
- Player Movement: Implement basic player movement controls for driving the bike on the game canvas.
- Obstacles: Introduce obstacles (cars and rocks) that the player needs to avoid while riding the bike.
- User Input: Handle user input for controlling the bike's movement and allowing the player to throw newspapers.
- Game State: Keep track of the player's position, the position of obstacles, and the score.
- Rendering: Render the game elements on the web page using the HTML canvas and update the display based on the game state.
- Extra: Add sounds, add a timer, styling to look like an arcade game from the 80's. Make it cute :)
Use the arrows to control Paperboy. Press the spacebar to throw newspapers.
You must hit the postbox with the newspaper.
![1](https://private-user-images.githubusercontent.com/96595540/301572972-f7fa585f-fbe4-433d-b230-c0162069bf29.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTkxNTgzOTUsIm5iZiI6MTcxOTE1ODA5NSwicGF0aCI6Ii85NjU5NTU0MC8zMDE1NzI5NzItZjdmYTU4NWYtZmJlNC00MzNkLWIyMzAtYzAxNjIwNjliZjI5LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIzVDE1NTQ1NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTcwNjc4ZTc5NzQwZmI2ZTI3YmI5OThiYmEyOTUzZGNlMmE1MWQ1N2I3NTY3NTdmOGQ4OTZmM2M0YjBkOGZhYmImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.E4zU-agZqf6278XoP9jSn4RJpDKJqSTg4SyGbgd45Vw)
![2](https://private-user-images.githubusercontent.com/96595540/301660214-8af6bfe2-0d79-46b6-8344-f6dc7537cea7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTkxNTgzOTUsIm5iZiI6MTcxOTE1ODA5NSwicGF0aCI6Ii85NjU5NTU0MC8zMDE2NjAyMTQtOGFmNmJmZTItMGQ3OS00NmI2LTgzNDQtZjZkYzc1MzdjZWE3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIzVDE1NTQ1NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTc3MmQ5ZWFiY2NlZmI3YTcyM2Q0ZDNhZmJiMDRlYTRmNTE0MmM1NTJjMmZhNzJiZmEyODYxYmZiMDBhNjE1ZmQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.ZmDQdiizM1iMhvVckkaHQBxA-7-pmnQCeQiD78K-3EM)
![3](https://private-user-images.githubusercontent.com/96595540/301573039-5c7a277d-cd1f-46a8-8e29-93ed76a2e738.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTkxNTgzOTUsIm5iZiI6MTcxOTE1ODA5NSwicGF0aCI6Ii85NjU5NTU0MC8zMDE1NzMwMzktNWM3YTI3N2QtY2QxZi00NmE4LThlMjktOTNlZDc2YTJlNzM4LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIzVDE1NTQ1NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTgwYWE4MWZhYzRlMmRkMDIwMjk5YzZhZDlmYjRkZjM5NTUwYzk1YmIyYWVkNjQ5MjRmNTdhNWI0NmU5NDFhYTMmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.wYJIWUwdEruBtKaGAcHOM2bM7d9wT6Zs7wfiX1FmuxU)