MyRobocon Portal Used AI

I changed the checkin method from scanning a QR-Code to typing a 6 digit OTP, because QR Codes often failed to scan. Also I added a redundant image source

Basically when the main image source fails (it has been provided with an invalid url for demo), it uses hackclub's cdn as a backup source, so the images might load slowly.

Credentials for demo (wkydon.hackclub.app):
Admin account: admin/admin
Staff account: staff/staff
Judge account: judge/judge
Team account: team1/team1, team2/team2, team3/team3, test/test

This is a long devlog because my SoM Account got suspended and now I have to start again....

Challenges I faced: (and fixes)
1. The whole System was not secure enough
I added encryption to all data via a secret key
2. The API Fetch was not fast enough
Turns out this was not an issue - it was just I was running nextjs in development mode so the live render of the API Routes were not fast enough.
3. User Authentication and Pages Permission was a mess
Well I fixed (really fixed) the middleware and it is now SO CLEAN THAT I AM PROUD OF IT
4. Mobile Compatibility
Well I haven't' yet solved this yet because of how complex it is...
5. Data not updating live
I used the method of pulling everything from a set of central API, authenticated by user sessions (with a few exceptions for public viewing)

General Features
- Admins
o General Game Settings, can override almost everything (match results, checkin records)
o Deploy (create) signages*
o Register new item into inventory
- Staffs
o Manual Checkins** (but cannot override)
o Notifications when disputes*** happens or assistance is requested
o Assisted Judging (judge the same match as the judge)
- Judges
o Schedule and Run Matches
o Override predefined “arena screens” and Display robot info via “LocalNetwork Connector****”
- Teams ATTATCHED IS A ONBOARDING VIDEO FOR TEAMS AND THERE IS A FEATURE TOUR (FROM TEAM PERSPECTIVE)
o View upcoming events
o Submit Progress Report
o Sign Contract for Kit
o Approve/Dispute Scores
o Download logs (collected via “LocalNetwork Connector”)

• There are 3 types of content that can be displayed on the signage – Leaderboard, Image (from URL) and Website ** Checkins are done using a QR Code from teams (generated in the events page) *** Participants are required to approve or dispute the scores 5 mins after the matches, if they dispute it, the staff will receive a popup asking them to deal with it. **** STILL IN DEVELOPMENT – I AM STRUGGLING TO GET IT WORKING. But fortunately, I done most of the Data IO before as a API (to encrypted JSON files lol) so it is easier for me to do the IO from the connector to the MyRobocon. However, I still don’t know the API Endpoints for the Robots (Except /run/start, /run/stop, /run/output, ws://<ip>:5001 and /livestream) [Basically how it works is a laptop will be running it and it will connect to MyRobocon using a API Key, commands will be sent from MyRobocon to the Connector and the Connector will send commands to the Robots or from the Robots to MyRobocon Periodically. However there is a downside for this – there will inevitably be some delays (I think) because everything is relayed to the server and back to the signages.

PROUD THINGS
I ACTUALLY ADDED READABLE COMMENTS
I got a CS Award at My School for it.
Well generally I am proud of this project because it is one of my biggest projects and I learnt next.js from nothing (I MUST ADMIT I USED A FEW TEMPLATES)