Achievements ~ Demo Game - uchicago-cs/chigame GitHub Wiki

Demo Game

Introduction

The demo game was created for the 2025 final demo. Since many of the features we implemented were on the back-end, we wanted a user-facing way to showcase those features. The demo game's conceit is simple: users click the various buttons and can receive the following achievements:

  • Click a button
  • Click a button 5 times

chigame demo game What the demo game page might look like.

The demo game relies on an internal API, the details of which can be found in the Achievements Internal API.

The demo game consists of the following files:

  • templates/achievements/demo_game.html - contains the HTML, CSS, and Javascript code
    • (note: for the future, it might be better to separate the HTML, CSS, and Javascript into different files.)
  • chigame/achievements/api/views.py - contains the views for the API calls used in the demo game
  • chigame/achievements/api/urls.py - contains the urls for the API views

How it works

All of the buttons are linked to a form, and once a click is registered, a script sends an API call to an endpoint that grants an achievement.

Features

Two tiers of achievements

The second achievement available in the demo game is awarded when five clicks are registered. The number of clicks are kept in a counter in the Javascript code. Unfortunately, this means that when the page is reloaded, the counter is reset to 0, which can make the number of clicks inaccurate. This second achievement is also not a true threshold achievement because the demo game developer didn't understand how threshold achievements worked... -- see the description of PR #1421 for more detail on this.

Popups

The demo game features a popup that appears when an achievement is earned and then disappears after three seconds. This is implemented through basic HTML/CSS and Javascript code.

demo-game-popup

Notes

Important note about a line in base.py

Important note: the views award_achievement and award_threshold_achievement depend on a specific line in config/settings/base.py under REST_FRAMEWORK.

# REST FRAMEWORK
REST_FRAMEWORK = {
    "DEFAULT_PAGINATION_CLASS": "rest_framework.pagination.PageNumberPagination",
    "PAGE_SIZE": 10,
    "DEFAULT_AUTHENTICATION_CLASSES": [
        "rest_framework_simplejwt.authentication.JWTAuthentication",
        "rest_framework.authentication.SessionAuthentication",
    ],
}

The line "rest_framework.authentication.SessionAuthentication", is required for the user to be properly authenticated in award_achievement and award_threshold_achievement. Otherwise, those views will take in an anonymous user.

Another team has reported that this line has caused problems for their code, specifically preventing one of their POST requests. It may be acceptable to remove "rest_framework.authentication.SessionAuthentication", from base.py the dev or main branch and keep it on an achievements demo branch since the demo game isn't critical to the functioning of Chigame.

Future directions

Tasks left unfinished, or future to-do list, if one wanted to expand on the demo game:

  • Write tests for the internal API (the developer of the demo game gave up on writing tests...)