Three buttons left 84.7px each at a 320px viewport against 81.2px of intrinsic content, so the horizontal padding drops to 6px and the label is nowrap — about 11px of slack instead of 3.5px. paintPresets() needed no change: it reads .preset from the DOM and matches on both base and delay, which the new preset makes load-bearing since two now share a delay and two share a base. Stepping the delay down from 3m / 15s correctly lights 3m / 12s rather than staying dark. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
80 lines
3.5 KiB
Markdown
80 lines
3.5 KiB
Markdown
# Backgammon Clock
|
||
|
||
A two-player match clock with **simple delay you can actually see**. Reserve time
|
||
plus a fixed number of free seconds each turn that never carry over — the
|
||
Backgammon Galaxy control. Defaults to 3:00 + 15s.
|
||
|
||
Plain HTML, CSS and JavaScript. No frameworks, no fonts, no images, no network.
|
||
|
||
## Getting it onto your phone
|
||
|
||
Chrome will only offer a real install over HTTPS, so the file needs a host.
|
||
GitHub Pages is free and takes about two minutes:
|
||
|
||
1. Create a new public repository, e.g. `bgclock`.
|
||
2. Upload all six files to the root: `index.html`, `manifest.webmanifest`,
|
||
`sw.js`, `icon-192.png`, `icon-512.png`, `icon-maskable-512.png`.
|
||
3. **Settings → Pages → Source: Deploy from a branch → `main` / `(root)` → Save.**
|
||
4. Wait a minute, then open `https://<you>.github.io/bgclock/` in Chrome on Android.
|
||
5. Chrome menu (⋮) → **Add to Home screen** → **Install**.
|
||
|
||
Open it from the home-screen icon and it runs fullscreen with no browser
|
||
chrome, offline, with the screen kept awake while a game is on.
|
||
|
||
If you're using a different path than `/bgclock/`, edit the `"id"` field in
|
||
`manifest.webmanifest` to match, or just delete that line.
|
||
|
||
To try it before hosting, open `index.html` in any browser — everything works
|
||
except installation and the service worker.
|
||
|
||
## Using it
|
||
|
||
- **Tap your own half** to end your turn and start your opponent's clock.
|
||
At the start, whoever taps first sets the *other* player going.
|
||
- The waiting player's taps are ignored, so a stray hand won't stop the clock.
|
||
- The bar under the big time is the delay draining. When it empties you get a
|
||
soft tick and your reserve starts moving. That's the moment worth hearing.
|
||
- **Reset** returns to the starting position. It takes two taps: the first arms
|
||
the button — it lights up and a ring unwinds around it — and a second tap
|
||
within those two seconds does it. One stray thumb can't wipe a live game.
|
||
- **Pause** freezes mid-turn and resumes exactly where it stopped, delay
|
||
included. Opening settings pauses automatically, and leaves it paused so the
|
||
clock only restarts when both players are ready.
|
||
|
||
Backgammon clocks pause between games, and after a cocked die the delay is
|
||
normally restarted — use pause and reset for those.
|
||
|
||
## Settings
|
||
|
||
At the top of the sheet are three presets — **2m / 12s**, **3m / 12s** and
|
||
**3m / 15s**. Tapping one jumps both timers there and lights it up. Change the
|
||
time or delay by hand and the highlight goes out; land back on a preset's
|
||
numbers and it comes back on.
|
||
|
||
| Setting | Range | Default |
|
||
| --- | --- | --- |
|
||
| Time | 0:15 – 99:00 | 3:00 |
|
||
| Delay | 0 – 60 s | 15 s |
|
||
| Colour | Sage, Brass, Slate, Teal, Plum | Sage |
|
||
| Sound | on / off | on |
|
||
|
||
Brass is the colour in the chess.com app, if you want the exact original look.
|
||
Changing time or delay resets the clock. Settings are kept in `localStorage`, so
|
||
they survive closing the tab, force-quitting the installed app and rebooting the
|
||
phone — the app also asks for persistent storage so they aren't evicted when the
|
||
device runs low on space. Only the settings are stored; a game in progress isn't.
|
||
|
||
## Sounds
|
||
|
||
All three are generated with the Web Audio API, so there are no audio files to
|
||
download and nothing to attribute.
|
||
|
||
- **Turn change** — a soft rising fifth with an octave partial, marimba-like.
|
||
- **Delay expiry** — a single quiet 300 Hz tick, deliberately easy to miss unless
|
||
you're listening for it.
|
||
- **Time out** — a falling triad, loud and unambiguous.
|
||
|
||
## Licence
|
||
|
||
Do whatever you like with it.
|