Toby-Leeder / binarygames-frontend

MIT License
0 stars 1 forks source link

Binary Games by JCK

About

This is a project for AP Computer Science Principles. It includes a virtual escape room with different comp-sci related games/clues. It comes complete with a leaderboard for speedruns and it also functions as a host for each game individually.

Runtime

To view the site, navigate to this link

Contributing

Please do not try to change anything in the repo unless you are manually added as a contributor by the owner.

Run Instructions

  1. Open the Website:

    • Click the link above

      OR

    • Open a web browser (Google Chrome, Mozilla Firefox, etc.).
    • Type the URL of the escape room game website (https://binarygames.tech) in the address bar.
    • Press Enter to navigate to the website.
  2. Create an Account or Log In:

    • On the homepage of the website, you will see options for logging in or creating a new account if you don't have one
    • To create a new account, click on the "Sign Up" button and follow the instructions to provide the required information, such as username, password, and password confirmation
    • If you already have an account, enter your username and password and click "Enter" to access your account
  3. Navigate to the Escape Room:

    • After logging in, you will be redirected to the main interface of the escape room game
    • Scroll down if needed and double-click the escape room environment preview. Now you are playing the game and the timer will start
  4. Explore the Escape Room:

    • Once you enter the escape room, you will have control to move around and look around
    • Use the keys W, A, S, and D to move your position. You can move your mouse to look around
  5. Interact with Objects:

    • As you explore the escape room, you will encounter various objects in the room
    • When the crosshair hovers over certain objects in the room, you will notice they become dimmer. This means the object can be accessed by left-clicking while the crosshair is focused on it
    • Pay attention to details, search for hidden objects, and complete games to progress in the escape room
  6. Progress and Completion:

    • As you succeed in the games that can be found in the room, an escape code will automatically compile
    • The games are meant to be educational and teach the user how certain things in Computer Science work, such as binary math, logic gates, etc...)
    • The code will be complete when you have beat each game. Then the door will unlock, allowing you to escape
    • The ultimate goal is to beat all the games and successfully escape from the room as fast as possible
  7. Other Features:

    • Leaderboard
      • You can find the Binary Games leaderboard by scrolling up and clicking "Leaderboard"
      • You will see a table ranking users by best time in ascending order, displaying each user's ranking, name, and best time
      • You can also search for a specific user by name to see their rank and best time
    • Individual Games
      • You can click the "Games" button next to "Leaderboard"
      • This will take you to the "Binary Racer" game by default, hosted in its own section of the website
      • You can navigate between individual games using the secondary navbar under the main one
      • Here, each game is hosted individually with no relation to the escape room, in case the user simply wants to practice their Comp Sci skills without worrying about being timed and ranked
    • Account Settings
      • The account settings page can be found by scrolling to the top and clicking the button "Account" in the top right corner of the screen
      • This page displays your registered name and best time you've achieved in the Escape Room (both fetched from backend)
      • It also allows the user to change their name, password, and/or delete their account (CRUD methods with API)
  8. Logging Out

    • To log out, scroll to the top of the page and click the button "Log Out" in the top left corner of the screen
    • This will redirect you to the login page
    • When you close the tab, your login info will remain persistent, meaning you can reopen it and continue, however, your in-game information may be lost
    • By logging out, our website prevents you from accessing any part of the Escape Room, Leaderboard, Games, and Account info. It will simply automatically redirect you to log in first

Remember to enjoy the immersive experience of the escape room game and have fun learning and playing the games!

License

This repo is licensed with an MIT License

Credits

This project is the work of Team JCK. Contributors: Aiden Huynh, Toby Leeder, Azeem Khan, Dash Penning, Ekam Kaire, Nathan Capule, Colin Mills, Ishi Singh

Original frontend template created by: Stellar by HTML5 UP | html5up.net | @ajlkn