🏅 1992 Barcelona Olympics Hackathon Project
Welcome to our final project for the Codeforall_ bootcamp, created during the 24-hour Hackathon event. Our theme centered around the legendary 1992 Barcelona Olympics, with a focus on delivering a fun and interactive experience, all within a tight deadline.
📚 Project Overview
This Single Page Application (SPA) was conceived, designed, and developed in just 24 hours. The project takes users on a nostalgic journey back to the 1992 Barcelona Olympics, starting with a time machine that leads into a series of engaging mini-games and challenges.
Key Features:
- Time Machine & Timeline: Begin your adventure by traveling through a timeline that highlights significant events from the beginning of 1992 to the start of the Olympics.
- Country Selection & Player Profile: Choose your country from a REST API and name your player to represent your nation in the games.
- Mini-Games: Test your knowledge and skills in a variety of mini-games:
- Quiz: Answer a mix of text and image-based questions.
- Click Games: Engage in fast-paced click games to add a layer of interaction.
- Athletics Tracking: Compete against three AI opponents in a race. Your performance in the mini-games influences your speed on the track, determining whether you take home the gold, silver, bronze, or a trash can.
- Post-Game Explanation: After the race, players are taken to a special page that explains the answers to the quiz questions. This is perfect for those who want to learn more about the 1992 Olympics and the topics covered in the quiz.
- Return to Time Machine: After reviewing the answers, players are returned to the main time machine page, ready to start a new game or explore further.
- Humorous and Retro Design: The game is infused with humor, quirky images, and a design inspired by the flashy, vibrant colors of the 90s.
🛠️ Technologies Used
- JavaScript: We used JavaScript for all dynamic content generation, event handling, and game logic.
- HTML/CSS: The HTML was injected via JavaScript, with CSS styling reflecting a retro 90s aesthetic.
- REST API: Utilized to fetch information about countries for player selection.
🚀 How to Play
- Start Your Journey: Launch the application and navigate through the timeline to reach the Olympic games.
- Select Your Country: Choose your team from the available countries and create your player profile.
- Compete in Mini-Games: Engage in quiz questions and click-based games to earn points.
- Race for the Gold: Your performance in the mini-games determines your speed in the final race against AI opponents.
- Have Fun: Enjoy the humor, the retro design, and the playful spirit of the project!
📦 Installation
To run this project locally:
-
Clone the repository:
git clone https://github.com/your-username/1992-barcelona-olympics.git
-
Open the project on Visual Studio Code.
-
Run LiveServer and it will automatically open the main page on your browser.
🤝 Contributing