From ff7ad42e32b724e129d4c3102a0490f8d8b3b487 Mon Sep 17 00:00:00 2001 From: Michiel Scholten Date: Sun, 3 Nov 2024 20:14:03 +0100 Subject: [PATCH] Serve static HTML game page --- src/alfagok/main.py | 23 ++++++++++++----- src/alfagok/static/copy.js | 10 ++++++++ src/alfagok/static/countdown.js | 23 +++++++++++++++++ src/alfagok/static/game.css | 4 +++ src/alfagok/static/game.js | 0 src/alfagok/templates/index.html | 44 ++++++++++++++++++++++++++++++++ 6 files changed, 97 insertions(+), 7 deletions(-) create mode 100644 src/alfagok/static/copy.js create mode 100644 src/alfagok/static/countdown.js create mode 100644 src/alfagok/static/game.css create mode 100644 src/alfagok/static/game.js create mode 100644 src/alfagok/templates/index.html diff --git a/src/alfagok/main.py b/src/alfagok/main.py index e2aadc3..beea9cb 100644 --- a/src/alfagok/main.py +++ b/src/alfagok/main.py @@ -1,11 +1,13 @@ """Main alfagok API application.""" - import logging from datetime import date from typing import Union -from fastapi import FastAPI -from pydantic import FilePath +from fastapi import FastAPI, Request +from fastapi.responses import HTMLResponse +from fastapi.staticfiles import StaticFiles +from fastapi.templating import Jinja2Templates +from pydantic import DirectoryPath, FilePath from pydantic_settings import BaseSettings @@ -19,11 +21,17 @@ class Settings(BaseSettings): # Date of first game so we can calculate the game ID we're on start_date: date + static_dir: DirectoryPath = 'static' + template_dir: DirectoryPath = 'templates' + debug: bool = False app = FastAPI() settings = Settings() +app.mount('/static', StaticFiles(directory=settings.static_dir), name='static') +templates = Jinja2Templates(directory=settings.template_dir) + with open(settings.word_list, 'r', encoding='utf-8') as word_file: # Load the game words @@ -53,10 +61,11 @@ def is_valid_dictionary_word(word: str) -> bool: return f'{word}\n' in dictionary -@app.get("/") -def read_root(): - """Ohai.""" - return {"Hello": "World"} +@app.get("/", response_class=HTMLResponse) +async def index(request: Request): + """Generate the main HTML page of the game.""" + language = 'nl' + return templates.TemplateResponse(request=request, name='index.html', context={'language': language}) @app.get('/api/game') diff --git a/src/alfagok/static/copy.js b/src/alfagok/static/copy.js new file mode 100644 index 0000000..e226563 --- /dev/null +++ b/src/alfagok/static/copy.js @@ -0,0 +1,10 @@ +var clip = new Clipboard('.copy'); + +clip.on("success", function(e) { + document.getElementById('copyresults').innerHTML = '

Copied! Share your results with friends.

'; + e.clearSelection(); +}); + +clip.on("error", function() { + document.getElementById('copyresults').innerHTML = '

Error. Please copy manually...

'; +}); \ No newline at end of file diff --git a/src/alfagok/static/countdown.js b/src/alfagok/static/countdown.js new file mode 100644 index 0000000..81304ca --- /dev/null +++ b/src/alfagok/static/countdown.js @@ -0,0 +1,23 @@ +/* Original from alphaguess.com */ + +function go() { + window.timerID = window.setInterval(timer, 0); +} + +function timer(){ + var nextgame = document.getElementById('nextgame'); + var now = new Date(); + var midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate()+1, 0, 0, 0); + var diff = Math.floor((midnight - now)/1000); + var hoursRemain = Math.floor(diff/(60*60)); + var minutesRemain = Math.floor((diff-hoursRemain*60*60)/60); + var secondsRemain = Math.floor(diff%60); + nextgame.innerHTML = ''+addZero(hoursRemain)+':'+addZero(minutesRemain)+':'+addZero(secondsRemain)+' left'; +} + +function addZero(num){ + if(num <=9) return '0'+num; + else return num; +} + +go(); diff --git a/src/alfagok/static/game.css b/src/alfagok/static/game.css new file mode 100644 index 0000000..fa5adb9 --- /dev/null +++ b/src/alfagok/static/game.css @@ -0,0 +1,4 @@ +body { + background-color: #333; + color: #FFF; +} diff --git a/src/alfagok/static/game.js b/src/alfagok/static/game.js new file mode 100644 index 0000000..e69de29 diff --git a/src/alfagok/templates/index.html b/src/alfagok/templates/index.html new file mode 100644 index 0000000..f2705cd --- /dev/null +++ b/src/alfagok/templates/index.html @@ -0,0 +1,44 @@ + + + + alfagok + + + + + + + alphaguess puzzle #{{numberOfDaysSinceStart}} • +

+ +
+

Guess the word of the day. Each guess reveals where the word sits alphabetically.

+
+ +
+ +
+
+

You got it! 🎉

+

Today's word was {{guessValue}}.

+
+
+

🧩 Puzzle #{{numberOfDaysSinceStart}}

+

🤔 {{guesses.length}} guesses

+

⏱️ {{getFormattedTime(winTime - startTime)}}

+

🔗 alphaguess.com

+
+
+
+ +
+
+ + + + + + +