This project is a 2-D web game inspired by the classic Snake game but with some new exciting twists. The goal of the game is to to stay alive as long as possible by eating different foods and staying away from the poison wall. You can also save your game score and compare with others on the leaderboard.
We have used python for the backend, javascript for the frontend and websockets as the communication protocol. It uses the uvicorn library as the server application and the fastapi library for serving api calls.
-
Install poetry
-
Change config for venv to be created in project instead of cache folder
poetry config virtualenvs.in-project true
This helps with vscode auto completion.
-
Run
poetry install
to install dependencies. -
Run
poetry run game
to run the game. -
Visit
http://127.0.0.1:8000/game/
to play.
The player's character (the snake) is an unknown land where the poison causes it to starve, thus depleting in health - indicated by its length. Moreover, there is a poison wall at the edge of the game screen. The player must prevent the death of the snake by keeping away from the edge of the game and eating different foods. The rate at which the snake loses health depends directly on the difficulty of the game
Currently, four foods are implemented:
- Yellow bug: regenerates 1 health
- Red bug: regenerates 3 health
- Caterpillar: increases game difficulty (thus the snake loses health after longer intervals)
- Butterfly: increases the snake length by a huge amount triggering some unexpected behaviour
The backend code is implemented in main.py
in backend/
.
It defines multiple api methods that return different data like the food to spawn, difficulty of the game.
It contains algorithms to dynamically change difficulty, and randomly select a food item from a weighted random distribution.
The player can save their score which is written to a local leaderboard.json
by the backend.
The webpage is served by the backend itself.
The frontend is implemented in main.js
in frontend/
.
It defines functions for starting the game, loading the images on the canvas and updating them.
It defines functions for detecting the collision of snake with wall, food with wall and snake with food.
Moreover, it updates the webpage layout on game start and game end.
The webpage index.html
uses bootstrap for styling and google fonts for loading external fonts.
It uses a grid layout and some custom css in index.css
.
A modal is displayed on the webpage on game start.
- https://opengameart.org/content/rpg-the-secret-within-the-woods
- https://opengameart.org/content/rpg-sound-pack
- https://opengameart.org/content/apple-bite
- https://opengameart.org/content/8bit-death-whirl (death sound)
- https://freesound.org/people/Slaking_97/sounds/455109/ (background music)
- https://opengameart.org/content/atmospheric-interaction-sound-pack (integer overflow from this pack)
- https://orangefreesounds.com/potato-chip-crunch-single-bite/ (eat sound)