zaczero / teodle Goto Github PK

🎮️ Teodle is a website for Teo to watch game clips and guess the ranks

License: GNU Affero General Public License v3.0

Dockerfile 0.52% Python 51.70% Shell 0.94% Jinja 27.31% Nix 0.46% HTML 6.84% JavaScript 12.16% Makefile 0.08%

python twitch rankdle teodle teosgame guess-the-rank userscript web-game viewer-interaction

teodle's Introduction

Teodle - Guess the rank!

Teodle is a Python-powered website for Twitch streamer Teo, to watch game clips submitted by his community and guess the ranks. The livestream viewers can also participate in the game by casting their votes in the Twitch chat. The most accurate viewers are displayed on the leaderboard.

Ranking System

The ranking system in Teodle is primarily based on stars, the more stars, the higher the score.

The rules are simple:

If you guess the exact rank of a game clip, you get 2 stars.
If you are 1 rank off, you get 1 star.
Otherwise, you get no stars.

Live Participation

Viewers can play along during livestreams by voting in the chat and competing for both accuracy and speed. The leaderboard showcases the top performing viewers.

Media

Screenshots

YouTube Series

Updated on 30/08/2023

Ep24 https://www.youtube.com/watch?v=8hNENZa_oAs (newest)
Ep23 https://www.youtube.com/watch?v=GzgINh-eV5o
Ep22 https://www.youtube.com/watch?v=TetOU20Y0mw
Ep21 https://www.youtube.com/watch?v=G8xHJP-_n_g

Deployment

We recommend using Docker for the best experience.

Docker

Install Docker
Clone and enter the repository

git clone https://github.com/Zaczero/teodle && cd teodle

Rename .env.example to .env and configure the environment variables
1. TTV_TOKEN: Twitch chat access token, get one here.
2. TTV_USERNAME: Twitch account's username for the token.
3. TTV_CHANNEL: Twitch channel to listen the chat on.
Build the image

docker build . -t teodle

Start the container

docker run --rm --env-file .env -p 8000:8000 -v $(pwd)/data:/app/data teodle

Access the website at http://localhost:8000

Footer

Contact me

https://monicz.dev/#get-in-touch

Support my work

https://monicz.dev/#support-my-work

License

This project is licensed under the GNU Affero General Public License v3.0.

The complete license text can be accessed in the repository at LICENSE.

teodle's People

Contributors

Stargazers

Watchers

Forkers

ofiber dchequer wouter17 benjaminfoley

teodle's Issues

Publish a full leaderboard after a game for viewers to search themselves up

Clip based sort

I think it would be really cool to put a way to sort the viewers by who guessed 1 or multiple clips, like for example there has been a few moments when teo was astonished by a player's rank, it would be cool to be able to sort by the people that guessed that exact clip (clip 1, clip 2, [...], last clip would also be simpler, or maybe use a list and a list iterator to go forward and backwards, like a music player basically). Maybe you could also put the option to sort based on the fastest responses, so who had the fastest correct answer, or maybe who was the fastest overall, maybe who had the highest ratio between speed and correct guesses.
For multiple clips I mean people who guessed clip 1, and clip 5 (for example), also still considering the response time.
Then it would also be good to put the results of Teodles into a dataframe since you're using python but that is a plus I guess.

So far this was really great very slick and minimalistic, congrats to everybody who has been working on this

Customise game

Maybe you could add a settings menu where Teo could choose games from which the clips would be.

For example there 5 check boxes with csgo, valorant, overwatch, rocket league, rs6 siege. And Teo ticks only csgo, then there will be only csgo clips.

On the index page there could be a second button called "Settings" under the "Start game" button.

Add a final screen per game with the end result and some interesting stats?

Perhaps it could be something like:

# Teo/chat won!
## That makes it Teo 4 - 5 chat

Some interesting stats:
Zaczero had the overall fastest correct response. 2.3s on the second clip!

RobinHeij89 had the highest streak of 3 correct responses.

XX is still waiting on a star after 24 responses in total. (might not be fun tho, but that's up to you)

Perhaps instead of displaying usernames we could just say X users are still waiting on a star. Don't want to start any 'bullying'

We could add some js/css animations to make this really pop.

Create scorekeeping visual for home page

Add scorekeeping for winners of each rankdle session (if Teo wins, chat wins, or tie) and display a graphic on the home page showing the current head-to-head score.

Graphic could also be present at the end screen of a rankdle session to show the updated score immediately.

Could also enable a "History" page that shows the results of previous rankdle sessions.

Add preview for scores per question by participants

As mentioned at [24:32] in rankdle #15:

It would be nice to have a feature to show the past scores of players, such that it is easier for the host to see, where another player lost points.

A hover effect would probably be best suited for this.

These positions seem good for such an effect:

Selfhosting teodle for other streamers

I am thinking about bringing this idea to a friend who streams as well and was firstly wondering if this would be allowed. If it is, could there be an explanation on how to host it? I assume I would have to first build the docker-image, edit the .env and then run it? Python is not a language I understand so any help would be appreciated :D