Make the frontend an installable PWA
Add a web app manifest and an install-only service worker (no offline caching: live state always comes from the server and hashed asset names change every build), registered from the WASM bundle. The worker must live at the site root for its scope to cover the app, and Granian only serves /static and /assets, so tavolo/static.py answers /manifest.webmanifest and /sw.js from STATIC_DIR with the content types browsers require; index.html gains the manifest link, icons, theme-color and Apple standalone meta tags. Icons are committed under web/assets/icons/ with vector sources and a make-icons.sh regeneration script, mirroring the card art workflow.
This commit is contained in:
1 parent
532cb16f94
commit
8c6ad10bf6
17 files changed
+271
-19
No files matched your search
@@ -20,8 +20,8 @@ and a secret partner:
|
||||
WebAssembly, built with [Trunk](https://trunkrs.dev) and styled with
|
||||
[Bootstrap](https://getbootstrap.com) 5.3 (MIT, vendored under
|
||||
`web/vendor/` so builds work offline) plus the custom felt theme in
|
||||
`web/theme.css`. Card images are the
|
||||
CC0 *woodcut napoletane* deck traced from a 1902 Naples print
|
||||
`web/theme.css`. Also an installable PWA — see [PWA](#pwa). Card images
|
||||
are the CC0 *woodcut napoletane* deck traced from a 1902 Naples print
|
||||
([SONDLecT/woodcut-napoletane](https://github.com/SONDLecT/woodcut-napoletane)).
|
||||
|
||||
## Run the whole stack
|
||||
@@ -77,6 +77,23 @@ the called card is played, so the secret partner stays secret. The
|
||||
the URL to share. A spectator who opens the URL before the match starts
|
||||
sees a "game not started yet" waiting room.
|
||||
|
||||
## PWA
|
||||
|
||||
The frontend is an installable PWA: `web/manifest.webmanifest` describes
|
||||
the app (standalone display, felt theme colors, PNG icons), and `web/sw.js`
|
||||
is an install-only service worker — it deliberately caches nothing, since
|
||||
live state always comes from the server and hashed asset names change every
|
||||
build. Browsers offer to install Tavolo over HTTPS (or on localhost in
|
||||
development).
|
||||
|
||||
Both files must be served from the site root, or the worker's scope and the
|
||||
manifest's `start_url` could not cover the app: Granian only serves
|
||||
`/static` and `/assets`, so `tavolo/static.py` answers
|
||||
`/manifest.webmanifest` and `/sw.js` (revalidated on every load) from the
|
||||
same build directory as the shell. Icons are committed under
|
||||
`web/assets/icons/`; `web/make-icons.sh` regenerates them with
|
||||
`rsvg-convert` after editing the vector sources.
|
||||
|
||||
## Development
|
||||
|
||||
Backend (from `server/`):
|
||||
@@ -115,4 +132,6 @@ OIDC_0_POST_LOGOUT_REDIRECT=http://localhost:8000/ \
|
||||
```
|
||||
|
||||
Card images are committed under `web/assets/cards/`; `web/fetch-cards.sh`
|
||||
re-downloads them if needed.
|
||||
re-downloads them if needed. PWA icons are committed under
|
||||
`web/assets/icons/`; `web/make-icons.sh` regenerates them from the SVG
|
||||
sources.
|
||||
Reference in new issue
Block a user