This is the codebase of a websockets and ML focused project made as a part of the 2023 Code Network Winter Hackathon hosted by Code Network. The theme of the hackathon was build anything as long as its awesome, with our project being used as an opportunity for us to implement ML into a NextJS project.
This application is a skribblio/QuickDraw clone built with websockets to make it a 1v1 as well as allow for audience live spectating and voting.
- NextJS 13 with app router was our chosen ReactJS front-end framework, using TailwindCSS with DaisyUI as a plugin for styles. Used Jotai for global state management.
- Rust, using tokio and tungstenite
- Bebop typesafe binary serialisation
- Pytorch for machine learning and running the model
- Host your own web socket server using
ngrok
which should look like the followingwss://{XXX-XXX-XXX...}.ngrok-free.app/
make ENV valueNEXT_PUBLIC_WS
- Do the same using
ngrok
again to host the front-end web component - Run the project using
pnpm dev
For any unforeseen issue, please contact us directly. Also please note that there can only be one game running at a time.
- Go to the website
- Prior to the game starting, have staff go to the admin page by appending "admin" to the URL as follows https://scribbly-alpha.vercel.app/admin
- The admin page will display the WS server URL as well as indicate if there's any left over clients and state from the previous game. Please press "Start/Restart Game" to prepare for a fresh game. Note that doing this removes all players and removes all game state for the active game.
.
- After this has been done, you can navigate back to the home page to display the URL to willing participants
.
- Refactor rust
- Fix admin portal, add toast that it worked
- Clear canvas
- End to end testing that votes acutally work
- Use probability values instead of k values in ml
- TODO: completely flush out tcp websokcet connections on server side on reset (except admin)
- Fix the sampling algorithm in the ai to more like https://www.kaggle.com/code/inversion/getting-started-viewing-quick-draw-doodles-etc OR simply apply all raw data to current simplification
- Find outsourced ai host like huggingface,
- Custom classes
- Actor pattern refactor server side and making more internalMessages
- Resolve TODOs
- newer versions of bebop-tools (v3.0.0^) require a bebop.json instead of cmd options