Compare commits

...
Author SHA1 Message Date
jheapsandClaude Opus 5 419852a1f4 Let a dealer take the table off the device it's stuck on
The night lives in one browser's localStorage and nowhere else. A dealer whose phone
dies, or who wants to carry on from the tablet after the break, loses the stacks, the
buy-ins, where the button is and the whole hand log. The CSV export can't bring any of
it back: it records what happened, not where the table stands.

The table can now be written to a file and read back. Round-tripped through the real
UI, a hand in progress comes back mid-hand — blinds posted, the same seat on the
clock, the button where it was.

Loading replaces everything, so it asks first and names both sides rather than saying
"are you sure": how many players are in the file and when it was saved, against how
many players and how many logged hands are about to go. It goes through the same
undoable path as the header buttons, so the toast offers the way back, and the
confirm says so instead of overstating it.

Reading a file goes through exactly the same migration a save from storage does —
load() had that logic inline and it is now a function both call. A second, looser path
for imports is how a format grows two meanings of the same field.

What it refuses, each with something a dealer can act on and never a half-loaded
table: anything that isn't JSON, JSON with no seats in it, a save from some other tool
that happens to carry a `kind`, and a file from a newer version — that last one
because loading it risks reading a field whose meaning has changed, and the dealer
would find out from the money. What it accepts anyway: a bare table with no envelope,
for somebody who copied the storage value out by hand.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb
2026-09-02 01:07:13 -06:00
jheapsandClaude Opus 5 8a2fc3e540 Give undo and the card picker's buttons a fingertip to land on
The first thing the repaired audit found, run on a real touch context at 44px: three
controls a dealer taps on a phone that are too small to tap.

    .actionUndo             145x30   the "I recorded that wrong" pill
    #cardPickerClearBtn      50x40   wipes a player's cards
    #cardPickerCloseBtn      50x40   closes the picker

Undo is the worst of them. It is the control a dealer reaches for having just entered
the wrong action with five people waiting, and it was fourteen pixels short of a
fingertip. The picker's two are short because the touch rule that fixes every other
small button is scoped to .panelBody, and the picker is a sheet — it never reached
them. One of them is destructive.

All three now sit at 44px on touch. Nothing changes on a pointer device.

I tried an invisible hit-area pad on undo first, to avoid spending bar height, and the
measurement said it did nothing: the pill clips its overflow to keep a long label on
one line, and giving it a positioning context made it clip the pad too. Growing the
box is the honest fix, and it turned out to cost nothing anyway — the bar goes from
138px to 152px and the felt stays at 366px, because the felt had slack against its
220px floor rather than sitting on it as I had assumed.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb
2026-09-02 00:55:56 -06:00
jheapsandClaude Opus 5 b64da7a787 Make the layout audit usable inside modals, and stop it passing what it can't measure
Last round turned up that Quick Split had never been audited. Chasing that, the reason
the dealer table's modals had never been audited either turns out to be the harness,
not neglect: it reported the pot wizard covering the seats as ten faults and the
rulings sheet as seven. A modal covering the page is what a modal is for, and an
instrument that calls that a fault is one nobody can use in those states.

It now finds whatever is open on top and scopes the reachability checks to it — the
overlays, plus the phone seat sheet, which is a body class rather than an element. The
seat-ownership check is skipped outright while a sheet is open: seats behind it aren't
fighting each other for taps, nothing is meant to reach them at all.

Two worse faults came out of proving the fix rather than assuming it. Injecting a 20x14
button into the open wizard, the contrast check caught it and the touch-target check
did not:

  * effectiveTarget returns null when elementFromPoint can't find the control, and the
    check treated that as a pass. Silent skips are how faults hide — the same lesson as
    the aria-hidden and faded-text exemptions before this. Unmeasurable controls are
    now reported as warnings.
  * The probe failed on anything scrolled out of its container. That was hiding a real
    control: "Confirm Winner(s)", the button that pays the pot out, had gone unmeasured
    for thirty-six rounds. It is scrolled into view before probing, and passes.

A checkbox inside a label is now measured by its label, since tapping the label is what
activates it. Without that, the dedicated-dealer toggle read as an unprobeable 24px
target when it has a 335x44 label around it.

The tool itself came out clean: no failures and no warnings across the table, the pot
wizard, the rulings sheet and the seat editor, on a real touch context at 44px. The
value here is that those states can be checked at all from now on — verified by
injection, which the fixed check catches and the old one did not.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb
2026-09-02 00:37:47 -06:00
jheapsandClaude Opus 5 3be93cdadf Chop a side pot on the screen that worked it out, and fix Quick Split's contrast
Quick Split lists the pots when somebody is all-in — main, sides, uncalled — and then
leaves the dealer there. Two players tying for a side pot is ordinary, and working out
each one's share meant switching to the other mode and retyping an amount the screen
had just calculated. Retyping a number with money on it is a transcription error
waiting to happen, and the number was already on screen.

Each pot with two or more people who can win it now carries a Chop, opening underneath
its own row: as many ways as there are contenders by default, a stepper for a chop
between fewer of them, and the same odd-chip and dust wording the main split uses,
because it is the same rule and the dealer shouldn't have to notice they are reading a
different screen. Per-row state, so opening the main pot's chop doesn't disturb what
the side pot below it says. Not offered on the uncalled row, which goes back to one
player, nor on the total.

Separately, this page had never been through the layout audit the dealer table gets
every round, and it was carrying nine contrast failures:

    .unevenCurrency   4.11:1   the $ beside every amount typed
    .unevenRemoveBtn  3.66:1   the ✕ that deletes a player's entry
    .splitFootnote    3.94:1   the instruction for what to do with the pot list

All under the 4.5:1 small-text minimum, the worst of them on a destructive control.
Lifted to pass. The large $ on the even-mode pot input is left alone: at 1.6rem it is
large text, where 3:1 is the bar and 4.11:1 clears it.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb
2026-09-02 00:24:07 -06:00
jheapsandClaude Opus 5 40fa16920b Offer bet sizes the table's chips can actually make
Half the pot lands on a half chip constantly. Pre-flop at 1/2 the honest half-pot is
$4.50, and the smallest chip in the default legend is a dollar — the tool's own chip
breakdown calls it "4×$1, $0.50 no chip covers". The button offered it anyway, so the
dealer rounded it themselves every single time.

The pot-derived quick amounts now round up to something the table can build. Up, not
down or nearest: these are bet sizes, a pot-sized bet that has been shaved is no
longer a pot-sized bet, and rounding up cannot drop an amount below a legal minimum
the way rounding the other way can.

Only when the legend describes this game. A smallest chip larger than the big blind
means the denominations were never set for these stakes, and rounding a 5c/10c table
up to whole dollars would be the tool doing real damage on the strength of a field
somebody forgot to fill in. Those tables keep exact amounts, and the wrong legend
stays visible rather than being quietly applied. A table with no legend at all is
told nothing about chips and so has nothing applied either.

Verified across five tables: default dollar chips at 1/2 give $4/$5/$7, cent chips at
5c/10c keep $0.20/$0.23/$0.35, five-dollar chips at 5/10 give $20/$25/$35, and both
the stale-legend and no-legend tables are left exact.

The minimum raise is deliberately not rounded. It is what the rules require, and
moving it to suit the chip tray would change what is legal rather than what is
convenient.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb
2026-09-02 00:05:26 -06:00
11 changed files with 694 additions and 23 deletions
@@ -155,6 +155,17 @@
<button id="exportHistoryBtn" class="holdemBtn holdemBtnSmall">Export CSV</button>
<button id="clearHistoryBtn" class="holdemBtn holdemBtnSmall holdemBtnDanger">Clear history</button>
</div>
<h3 class="panelSubhead">The table itself</h3>
<p class="fieldHint">
The night lives in this browser and nowhere else. Save it to a file to carry it
to another device, or to have something to come back to if this one dies.
</p>
<div class="handHistoryActions">
<button id="saveTableBtn" class="holdemBtn holdemBtnSmall">Save table file</button>
<button id="loadTableBtn" class="holdemBtn holdemBtnSmall">Load table file</button>
<input id="loadTableInput" type="file" accept="application/json,.json" hidden />
</div>
</div>
</details>
+15 -2
View File
@@ -3138,7 +3138,18 @@ body.hasActionBar #toastHost {
}
.panelBody .holdemBtnSmall,
.handHistoryActions .holdemBtn {
.handHistoryActions .holdemBtn,
/* The card picker's Clear and Done sat at 40px: the touch rule was scoped to
.panelBody and the picker is a sheet, so it never reached them. Clear wipes a
player's cards, which is not a thing to make a dealer aim at. */
.cardPickerHeader .holdemBtn,
/* Undo was 30px, and it is the control a dealer reaches for having just recorded
the wrong thing with five people waiting — the worst place to be fourteen pixels
short of a fingertip. Growing the box costs bar height, which comes out of the
felt, but measured at 390x844 the felt is 366px against a 220px floor, so there
is room for it. A hit-area pad was tried first and does not work here: the pill
clips its overflow to keep a long label on one line, which clips the pad too. */
.actionUndo {
min-height: 44px;
}
@@ -3525,7 +3536,9 @@ textarea:focus-visible {
.panelBody .holdemBtnSmall,
.handHistoryActions .holdemBtn,
.toastAction {
.toastAction,
.cardPickerHeader .holdemBtn,
.actionUndo {
min-height: 44px;
}
@@ -143,7 +143,9 @@ button,
}
.unevenCurrency {
color: #777;
/* Was #777 — 4.11:1 on this background, under the 4.5:1 small text needs. It sits
against every amount a dealer types, so it is read constantly. */
color: #8f8f8f;
}
.unevenAmount {
@@ -184,7 +186,9 @@ button,
height: 44px;
border: none;
background: none;
color: #6a6a6a;
/* Was #6a6a6a — 3.66:1, the worst on the page, on a control that deletes a
player's entry. A destructive action should not be the faintest thing in view. */
color: #9a9a9a;
font-size: 0.85rem;
cursor: pointer;
}
@@ -209,11 +213,86 @@ button,
.unevenPot {
display: flex;
align-items: baseline;
/* Wraps so a chop opens underneath its own pot rather than squeezing in beside the
eligible-players list and pushing it off the row. */
flex-wrap: wrap;
gap: 0.6rem;
padding: 0.3rem 0;
font-size: 0.85rem;
}
.unevenChopToggle {
flex: none;
order: 3;
/* 44px on touch: it moves money, like everything else that does. */
min-height: 32px;
padding: 0.2rem 0.6rem;
border: 1px solid rgba(216, 180, 106, 0.45);
border-radius: 999px;
background: rgba(216, 180, 106, 0.1);
color: #e3c887;
font: inherit;
font-size: 0.74rem;
cursor: pointer;
}
.unevenChopToggle:hover {
background: rgba(216, 180, 106, 0.18);
}
.unevenChopToggle:focus-visible {
outline: 2px solid #d8b46a;
outline-offset: 2px;
}
.unevenChopDetail {
order: 4;
flex: 0 0 100%;
/* Or the padding is added on top of the 100% basis and the panel sits wider than
the row it belongs to — measured 328px inside a 309px row on a phone. */
box-sizing: border-box;
margin: 0.15rem 0 0.2rem;
padding: 0.45rem 0.6rem;
border-radius: 8px;
background: rgba(255, 255, 255, 0.04);
}
.unevenChopWays {
display: flex;
align-items: center;
gap: 0.45rem;
margin-bottom: 0.3rem;
}
.unevenChopWaysLabel {
color: #cfcfcf;
font-size: 0.78rem;
font-variant-numeric: tabular-nums;
}
.unevenChopEach {
margin: 0;
color: #f2f2f2;
font-weight: 600;
}
.unevenChopNote {
margin: 0.2rem 0 0;
color: #9a9a9a;
font-size: 0.76rem;
}
.unevenChopDust {
color: #e0b169;
}
@media (max-width: 700px), (pointer: coarse) {
.unevenChopToggle {
min-height: 44px;
padding: 0.4rem 0.9rem;
}
}
.unevenPot + .unevenPot {
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
@@ -510,7 +589,9 @@ button,
.splitFootnote {
margin-top: 1.5rem;
color: #6f6f6f;
/* Was #6f6f6f — 3.94:1. It carries the instruction for what to do with the pot
list, which is not a decorative line. */
color: #8d8d8d;
font-size: 0.78rem;
line-height: 1.5;
text-align: center;
@@ -532,11 +532,26 @@ const Betting = {
//
// Facing no bet this is a plain pot-sized bet — toCall is zero and currentBet is
// zero, so it comes out as the pot, which is the right answer there too.
// Rounded up to something the table's chips can actually build. Half the pot is
// constantly a half-chip amount — pre-flop at 1/2 it is $4.50, and the smallest
// chip in the default legend is a dollar, so the button offered a number the
// dealer would have to round themselves every single time.
//
// Only when the legend describes this game. A smallest chip *larger* than the big
// blind means the denominations were never set for these stakes, and rounding a
// 5c/10c table up to whole dollars would be the tool doing real damage on the
// strength of a field somebody forgot to fill in. Left exact there, and the wrong
// legend stays visible rather than being quietly applied.
potRaiseTo(state, index, fraction = 1) {
const player = state.seats[index];
if (!player) return 0;
const potAfterCall = this.round(this.potSoFar(state) + this.toCall(state, player));
return this.round((state.currentBet || 0) + potAfterCall * fraction);
const exact = this.round((state.currentBet || 0) + potAfterCall * fraction);
const step = Money.fromCents(Money.chipStepCents(state.chipLegend));
const bigBlind = Number(state.bigBlind) || 0;
if (step <= 0 || (bigBlind > 0 && step > bigBlind)) return exact;
return Money.upToChip(exact, state.chipLegend);
},
// Who turns their hand over first.
@@ -598,6 +598,72 @@ document.addEventListener("DOMContentLoaded", () => {
Toast.show("Hand history cleared.", { duration: 2500 });
});
document.getElementById("saveTableBtn").addEventListener("click", () => {
const blob = new Blob([HoldemState.toBackup(state)], { type: "application/json" });
const url = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = HoldemState.backupFileName();
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
Toast.show(`Table saved as ${link.download}.`, { duration: 3500 });
});
document.getElementById("loadTableBtn").addEventListener("click", () => {
document.getElementById("loadTableInput").click();
});
document.getElementById("loadTableInput").addEventListener("change", async e => {
const file = e.target.files && e.target.files[0];
// Cleared straight away so picking the same file twice still fires a change.
e.target.value = "";
if (!file) return;
let text;
try {
text = await file.text();
} catch {
Toast.show("That file couldn't be read.", { duration: 4000 });
return;
}
const result = HoldemState.fromBackup(text);
if (result.error) {
Toast.show(result.error, { duration: 5000 });
return;
}
// Loading replaces everything: stacks, buy-ins, the button, the log. Naming
// what is about to be lost is the difference between a dealer choosing that
// and discovering it — and the current table might be the live one.
const here = HoldemState.sessionStandings(state).length;
const incoming = HoldemState.sessionStandings(result.table).length;
const when = result.savedAt ? new Date(result.savedAt) : null;
const saidWhen = when && !Number.isNaN(when.getTime())
? ` It was saved ${when.toLocaleString()}.`
: "";
const ok = await Dialog.confirm({
title: "Replace this table?",
message:
`The file has a table with ${incoming} ${incoming === 1 ? "player" : "players"} in it.${saidWhen} ` +
`Loading it replaces the table on screen — ${here} ${here === 1 ? "player" : "players"}, ` +
`${(state.handHistory || []).length} logged ${(state.handHistory || []).length === 1 ? "hand" : "hands"}. ` +
`Undo will bring it back for a few seconds; after that it is gone.`,
confirmLabel: "Load it",
danger: true,
});
if (!ok) return;
runUndoable("loading a saved table", () => {
// Replace the contents rather than the reference: everything on the page
// holds a pointer to this object.
Object.keys(state).forEach(key => { delete state[key]; });
Object.assign(state, result.table);
});
});
// The filter is how the dealer looks at the log, not something about the table, so
// it lives on the view: it isn't saved, isn't undoable, and doesn't reach the other
// tab. Clearing the history clears it too, since there is nothing left to filter.
@@ -63,6 +63,29 @@ const Money = {
// Anything the smallest chip can't make comes back as `remainder` rather than being
// rounded away: a 50c share in a game whose smallest chip is a dollar is a real
// problem for the dealer to solve, not a rounding error to hide.
// The smallest chip the table has said it plays with, in cents. Zero when no
// denominations are set, which means the tool has been told nothing about what
// chips exist and shouldn't pretend otherwise.
chipStepCents(legend) {
const values = (legend || [])
.map(chip => this.toCents(chip.value))
.filter(cents => cents > 0);
return values.length > 0 ? Math.min(...values) : 0;
},
// Rounds an amount up to something the table can actually build out of its chips.
//
// Up rather than down or nearest: these are bet sizes, and a pot-sized bet that
// has been shaved is no longer a pot-sized bet. Rounding up also can't drop an
// amount below a legal minimum, which rounding the other way can.
upToChip(amount, legend) {
const step = this.chipStepCents(legend);
if (step <= 0) return this.round(amount);
const cents = this.toCents(amount);
if (cents <= 0) return this.round(amount);
return this.fromCents(Math.ceil(cents / step) * step);
},
chipBreakdown(amount, legend) {
let cents = this.toCents(amount);
if (cents <= 0) return { chips: [], remainder: 0 };
@@ -197,6 +197,80 @@ const QuickSplit = {
});
},
// Chopping one of the pots listed above, without leaving the screen that worked it
// out. Starts closed and at as many ways as there are players who can win the pot,
// which is the common case; the stepper covers a chop between fewer of them, which
// is the other one.
//
// The per-pot ways live on the row rather than in `this.ways`, so opening a chop on
// the main pot doesn't change what the side pot below it is saying.
addChopControl(row, amount, contenderCount) {
let ways = contenderCount;
let open = false;
const toggle = document.createElement("button");
toggle.type = "button";
toggle.className = "unevenChopToggle";
const detail = document.createElement("div");
detail.className = "unevenChopDetail";
detail.hidden = true;
const draw = () => {
toggle.textContent = open ? "Hide chop" : "Chop";
toggle.setAttribute("aria-expanded", String(open));
detail.hidden = !open;
if (!open) return;
const result = SplitCalculator.split(amount, ways, this.chip);
detail.innerHTML = "";
const stepper = document.createElement("div");
stepper.className = "unevenChopWays";
stepper.appendChild(this.makeStepButton("−", () => {
if (ways > 2) { ways -= 1; draw(); }
}));
const label = document.createElement("span");
label.className = "unevenChopWaysLabel";
label.textContent = `${ways} ways`;
stepper.appendChild(label);
stepper.appendChild(this.makeStepButton("+", () => {
if (ways < Math.max(contenderCount, this.MAX_WAYS)) { ways += 1; draw(); }
}));
detail.appendChild(stepper);
const each = document.createElement("p");
each.className = "unevenChopEach";
each.textContent = `${Money.format(result.each)} each`;
detail.appendChild(each);
// Same wording as the main split, because it is the same rule and a dealer
// shouldn't have to notice they're reading a different screen.
if (result.valid && result.oddChips > 0) {
const odd = document.createElement("p");
odd.className = "unevenChopNote";
odd.textContent = result.oddChips === 1
? `plus one odd ${Money.format(result.chip)} chip to the first player left of the button`
: `plus ${result.oddChips} odd ${Money.format(result.chip)} chips — one each to the ` +
`first ${result.oddChips} players left of the button`;
detail.appendChild(odd);
}
if (result.valid && result.dust > 0) {
const dust = document.createElement("p");
dust.className = "unevenChopNote unevenChopDust";
dust.textContent =
`${Money.format(result.dust)} doesn't divide into ${Money.format(result.chip)} chips — ` +
`pick a smaller denomination.`;
detail.appendChild(dust);
}
};
toggle.addEventListener("click", () => { open = !open; draw(); });
draw();
row.appendChild(toggle);
row.appendChild(detail);
},
updateUneven() {
const players = this.entries
.map((entry, index) => ({ id: `P${index + 1}`, contribution: Number(entry.amount) || 0, folded: entry.folded }))
@@ -218,7 +292,7 @@ const QuickSplit = {
}
empty.hidden = true;
const addRow = (label, amount, who, className) => {
const addRow = (label, amount, who, className, chopWays) => {
const row = document.createElement("div");
row.className = `unevenPot ${className || ""}`;
const name = document.createElement("span");
@@ -234,9 +308,19 @@ const QuickSplit = {
row.appendChild(value);
row.appendChild(eligible);
host.appendChild(row);
// Two players tying for a side pot is ordinary, and working out each one's
// share meant copying the amount into the other mode by hand — retyping a
// number the screen had just worked out, which is a transcription error
// waiting to happen with money on it. The chop happens here instead.
//
// Only offered where it means something: a pot with at least two people
// who can win it. Not the uncalled row, which goes back to one player, and
// not the total.
if (chopWays >= 2) this.addChopControl(row, amount, chopWays);
};
pots.forEach(pot => addRow(pot.label, pot.amount, pot.eligible.join(", ")));
pots.forEach(pot => addRow(pot.label, pot.amount, pot.eligible.join(", "), "", pot.eligible.length));
returns.forEach(ret => addRow("Uncalled", ret.amount, `back to ${ret.id}`, "unevenPotReturn"));
const total = players.reduce((sum, p) => sum + p.contribution, 0);
@@ -164,13 +164,18 @@ const HoldemState = {
return this.createDefault();
},
load() {
let raw = null;
try {
raw = localStorage.getItem(this.STORAGE_KEY);
if (!raw) return this.createDefault();
const parsed = JSON.parse(raw);
if (!parsed || !Array.isArray(parsed.seats)) return this.failedLoad(raw);
// Everything a table has to be put through before it can be trusted, whichever
// direction it arrived from.
//
// Pulled out of load() so a table read from a file goes through exactly the same
// checks as one read from storage. A second, looser path for imports is how a
// format grows two meanings of the same field.
//
// Returns null for anything that isn't a table at all; every other repair is
// silent and forward, the way a save from an older version is treated.
migrate(parsed) {
if (!parsed || !Array.isArray(parsed.seats)) return null;
{
if (typeof parsed.handNumber !== "number" || parsed.handNumber < 1) parsed.handNumber = 1;
if (!Array.isArray(parsed.handHistory)) parsed.handHistory = [];
if (typeof parsed.discarded !== "number" || !(parsed.discarded >= 0)) parsed.discarded = 0;
@@ -215,12 +220,85 @@ const HoldemState = {
});
return parsed;
}
},
load() {
let raw = null;
try {
raw = localStorage.getItem(this.STORAGE_KEY);
if (!raw) return this.createDefault();
const migrated = this.migrate(JSON.parse(raw));
if (!migrated) return this.failedLoad(raw);
return migrated;
} catch {
// Malformed JSON — a truncated write, another tab, a browser hiccup.
return this.failedLoad(raw);
}
},
// ---- Taking the table off this device ------------------------------------
//
// A night lives in one browser's localStorage and nowhere else. A dealer whose
// phone dies, or who wants to carry on from the tablet after the break, loses the
// stacks, the buy-ins, where the button is and the whole hand log — and the CSV
// export can't bring any of that back, because it records what happened rather
// than where the table stands.
//
// So the table can be written out as a file and read back in. Same shape that goes
// into storage, wrapped in enough to recognise it later.
BACKUP_KIND: "casino.holdem.table",
BACKUP_VERSION: 1,
toBackup(state) {
return JSON.stringify({
kind: this.BACKUP_KIND,
version: this.BACKUP_VERSION,
savedAt: new Date().toISOString(),
table: state,
}, null, 2);
},
// Reads a file back. Returns { table } on success, or { error } with something a
// dealer can act on — never a half-loaded table, because the failure mode there is
// a night that looks restored and isn't.
fromBackup(text) {
let parsed;
try {
parsed = JSON.parse(text);
} catch {
return { error: "That file isn't a saved table — it couldn't be read as JSON." };
}
if (!parsed || typeof parsed !== "object") {
return { error: "That file isn't a saved table." };
}
// A bare table, from someone who copied the storage value out by hand, is
// still a table. The envelope is a convenience, not a password.
const table = parsed.kind === this.BACKUP_KIND || parsed.table ? parsed.table : parsed;
if (parsed.kind && parsed.kind !== this.BACKUP_KIND) {
return { error: "That file is a save from something else, not a Hold'em table." };
}
const migrated = this.migrate(table);
if (!migrated) {
return { error: "That file doesn't have a table in it — no seats were found." };
}
if (parsed.version > this.BACKUP_VERSION) {
// Newer than this build understands. Loading it anyway risks reading a
// field that has changed meaning, and the dealer would find out from the
// money, so say so instead.
return { error: "That table was saved by a newer version of this tool. Update, then load it." };
}
return { table: migrated, savedAt: parsed.savedAt || null };
},
// What the file is called. Dated, because a dealer who saves twice in a night
// should not have to guess which is which.
backupFileName(now = new Date()) {
const pad = n => String(n).padStart(2, "0");
return `holdem-table-${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())}` +
`-${pad(now.getHours())}${pad(now.getMinutes())}.json`;
},
// True once a save has failed. The UI reads this to keep saying so, because a
// toast is a moment and this is a fact about the rest of the night.
saveFailed: false,
+71 -4
View File
@@ -9,7 +9,7 @@
const test = require("node:test");
const { describe } = require("node:test");
const assert = require("node:assert");
const { Betting, makeTable } = require("./load");
const { Betting, Money, makeTable } = require("./load");
describe("pre-flop at 1/2", () => {
const dealt = () => {
@@ -25,11 +25,13 @@ describe("pre-flop at 1/2", () => {
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 7);
});
test("half pot is $4.50, which is above the $4 minimum rather than equal to it", () => {
test("half pot is $5 — $4.50 rounded up to something the chips can make", () => {
// The old arithmetic gave $3.50, which clamped up to the minimum and put the
// same $4 on two buttons side by side.
// same $4 on two buttons side by side. The honest half-pot is $4.50, and the
// smallest chip in the default legend is a dollar, so the button would have
// offered an amount the dealer had to round themselves every single time.
const state = dealt();
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 4.5);
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 5);
assert.notEqual(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5),
Betting.minRaiseTo(state), "the two quick buttons say different things");
});
@@ -111,3 +113,68 @@ describe("it stays sane at the edges", () => {
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 0.35);
});
});
describe("the amounts are ones the table can actually build", () => {
const CENTS = [{ value: 0.25 }, { value: 0.05 }, { value: 0.01 }];
const DOLLARS = [{ value: 1 }, { value: 5 }, { value: 25 }, { value: 100 }];
const table = (legend, smallBlind, bigBlind, stack = 200) => {
const state = makeTable({ seatCount: 6, seated: [0, 1, 2, 3], stack, smallBlind, bigBlind });
state.chipLegend = legend;
Betting.beginHand(state);
return state;
};
test("a half-pot that lands on a half chip is rounded up, not offered as it is", () => {
const state = table(DOLLARS, 1, 2);
// Honestly $4.50. No dollar chip makes fifty cents.
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 5);
assert.equal(Money.chipBreakdown(5, DOLLARS).remainder, 0);
});
test("up rather than down — a shaved pot bet is not a pot bet", () => {
const state = table(DOLLARS, 1, 2);
assert.ok(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5) > 4.5);
});
test("an amount the chips already make is left exactly alone", () => {
const state = table(DOLLARS, 1, 2);
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 7, "the pot raise was already whole");
});
test("a cent table keeps its cents", () => {
const state = table(CENTS, 0.05, 0.1);
// Pot $0.15, owes $0.10: call to $0.25, raise $0.25 → $0.35, which cent chips make.
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 0.35);
assert.equal(Money.chipBreakdown(0.35, CENTS).remainder, 0);
});
test("a legend that plainly isn't for these stakes is not applied", () => {
// Dollar chips on a 5c/10c game means somebody never filled the legend in.
// Rounding those blinds up to whole dollars would be the tool doing real
// damage on the strength of a stale field, so the amounts stay exact and the
// wrong legend stays visible.
const state = table(DOLLARS, 0.05, 0.1);
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 0.35);
});
test("a table with no legend at all gets exact amounts", () => {
const state = table([], 1, 2);
assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 4.5);
});
test("every fraction comes out buildable, and never shaved", () => {
const state = table(DOLLARS, 1, 2);
const index = state.actingSeatIndex;
const potAfterCall = Betting.potSoFar(state) + Betting.toCall(state, state.seats[index]);
[0.1, 0.25, 0.5, 0.75, 1].forEach(fraction => {
const value = Betting.potRaiseTo(state, index, fraction);
const exact = state.currentBet + potAfterCall * fraction;
assert.ok(value >= exact, `${fraction} of the pot should never be rounded down`);
assert.ok(value - exact < 1, `${fraction} of the pot should round by less than a chip`);
assert.equal(Money.chipBreakdown(value, DOLLARS).remainder, 0,
`${fraction} of the pot should be buildable from the table's chips`);
});
});
});
+155
View File
@@ -0,0 +1,155 @@
// Taking the table off this device.
//
// A night lives in one browser's localStorage and nowhere else. A dealer whose phone
// dies, or who wants to carry on from the tablet after the break, loses the stacks,
// the buy-ins, where the button is and the whole hand log — and the CSV export can't
// bring any of that back, because it records what happened rather than where the
// table stands.
const test = require("node:test");
const { describe } = require("node:test");
const assert = require("node:assert");
const { HoldemState, Betting, makeTable } = require("./load");
const aNight = () => {
const state = makeTable({ seatCount: 9, seated: [0, 1, 2, 3], stack: 200, dealerSeatIndex: 1 });
["Ann", "Ben", "Cal", "Dee"].forEach((name, i) => {
state.seats[i].name = name;
state.seats[i].buyIns = 200;
});
state.seats[2].stack = 340;
state.notes = "Cal owes the bar $12";
Betting.beginHand(state);
HoldemState.recordHand(state, [{ id: state.seats[2].id, label: "Cal", amount: 60 }]);
return state;
};
describe("a table written out and read back", () => {
test("comes back the same table", () => {
const before = aNight();
const after = HoldemState.fromBackup(HoldemState.toBackup(before)).table;
assert.deepEqual(after.seats.map(p => p.name), before.seats.map(p => p.name));
assert.deepEqual(after.seats.map(p => p.stack), before.seats.map(p => p.stack));
assert.deepEqual(after.seats.map(p => p.buyIns), before.seats.map(p => p.buyIns));
assert.equal(after.dealerSeatIndex, before.dealerSeatIndex);
assert.equal(after.handNumber, before.handNumber);
assert.equal(after.notes, before.notes);
assert.equal(after.handHistory.length, before.handHistory.length);
});
test("keeps the things a CSV can't carry", () => {
// The whole reason this exists: an export records what happened, not where the
// table stands.
const before = aNight();
const after = HoldemState.fromBackup(HoldemState.toBackup(before)).table;
assert.equal(after.bettingOpen, before.bettingOpen, "a hand in progress is still in progress");
assert.deepEqual(after.postedBlinds, before.postedBlinds, "so the next rotation is right");
assert.equal(after.street, before.street);
assert.deepEqual(after.seats.map(p => p.committed), before.seats.map(p => p.committed));
assert.deepEqual(after.chipLegend, before.chipLegend);
});
test("the standings and the bank check agree across the trip", () => {
const before = aNight();
const after = HoldemState.fromBackup(HoldemState.toBackup(before)).table;
assert.deepEqual(HoldemState.sessionStandings(after), HoldemState.sessionStandings(before));
assert.deepEqual(HoldemState.bankReconciliation(after), HoldemState.bankReconciliation(before));
});
test("it can be dealt from straight away", () => {
const before = aNight();
HoldemState.startNextHand(before);
const after = HoldemState.fromBackup(HoldemState.toBackup(before)).table;
Betting.beginHand(after);
assert.equal(after.bettingOpen, true);
assert.ok(after.actingSeatIndex !== null, "somebody is on the clock");
});
});
describe("what it refuses", () => {
const refuses = (text, because) => {
const result = HoldemState.fromBackup(text);
assert.ok(result.error, because);
assert.equal(result.table, undefined, "and never hands back half a table");
};
test("something that isn't JSON", () => {
refuses("not a file", "unreadable");
refuses("", "empty");
});
test("JSON that isn't a table", () => {
refuses('{"hello":"world"}', "no seats in it");
refuses("[1,2,3]", "an array of nothing");
refuses("null", "null");
});
test("a save from something else that happens to be JSON", () => {
refuses('{"kind":"some.other.tool","table":{"seats":[]}}', "wrong kind");
});
test("a file from a newer version, rather than guessing at it", () => {
// Loading it risks reading a field whose meaning has changed, and the dealer
// would find out from the money.
const backup = JSON.parse(HoldemState.toBackup(aNight()));
backup.version = HoldemState.BACKUP_VERSION + 1;
const result = HoldemState.fromBackup(JSON.stringify(backup));
assert.match(result.error, /newer version/i);
});
});
describe("what it accepts anyway", () => {
test("a bare table, with no envelope around it", () => {
// Somebody who copied the storage value out by hand. The envelope is a
// convenience, not a password.
const state = aNight();
const result = HoldemState.fromBackup(JSON.stringify(state));
assert.ok(!result.error);
assert.deepEqual(result.table.seats.map(p => p.name), state.seats.map(p => p.name));
});
test("a table from before fields that exist now, migrated on the way in", () => {
// Same repairs a save from an older version gets, because it is the same
// function — a second, looser path for imports is how a format grows two
// meanings of the same field.
const state = aNight();
const raw = JSON.parse(JSON.stringify(state));
delete raw.deadButton;
delete raw.postedBlinds;
delete raw.dealtLastHand;
delete raw.discarded;
raw.seats.forEach(p => { delete p.buyIns; });
const { table, error } = HoldemState.fromBackup(JSON.stringify({
kind: HoldemState.BACKUP_KIND, version: 1, table: raw,
}));
assert.ok(!error);
assert.equal(table.deadButton, false);
assert.deepEqual(table.dealtLastHand, []);
assert.equal(table.discarded, 0);
assert.equal(table.seats[0].buyIns, 0);
});
test("the time it was saved comes back with it", () => {
const result = HoldemState.fromBackup(HoldemState.toBackup(aNight()));
assert.ok(result.savedAt, "so the dealer can tell two files apart");
assert.ok(!Number.isNaN(new Date(result.savedAt).getTime()));
});
});
describe("the file itself", () => {
test("is named with the date and time, so two saves in a night are told apart", () => {
const at = new Date(2026, 8, 2, 21, 5);
assert.equal(HoldemState.backupFileName(at), "holdem-table-2026-09-02-2105.json");
});
test("says what it is, for anyone finding it in a downloads folder", () => {
const parsed = JSON.parse(HoldemState.toBackup(aNight()));
assert.equal(parsed.kind, "casino.holdem.table");
assert.equal(parsed.version, 1);
assert.ok(parsed.table.seats.length > 0);
});
});
+82 -4
View File
@@ -93,10 +93,44 @@ const LayoutAudit = {
return false;
},
// The modal that is currently on top, if any.
//
// Every check below asks "is this thing reachable", and while a sheet or dialog is
// open the answer for everything behind it is legitimately no — that is what a
// modal is for. Without knowing that, the audit reported the pot wizard covering
// the seats as ten faults and the rulings sheet as seven, which is the noise that
// made it useless in exactly the states nobody had audited. Now it scopes to what
// is actually on top and says so.
MODAL_SELECTOR: "#potWizardOverlay, #rulingsOverlay, #seatMenuOverlay, #cardPickerOverlay, " +
"#confirmOverlay, #addChipsOverlay, #seatEditorOverlay",
openModal() {
const open = [...document.querySelectorAll(this.MODAL_SELECTOR)]
.filter(el => !el.hidden && getComputedStyle(el).display !== "none");
// Last in the DOM wins, which is how they stack.
return open.length > 0 ? open[open.length - 1] : null;
},
// A seat sheet on a phone isn't an overlay element, it's a body class — but it
// covers the felt just the same.
modalScope() {
const overlay = this.openModal();
if (overlay) return overlay;
if (document.body.classList.contains("seatSheetOpen")) {
return document.getElementById("seatEditorPanel") || null;
}
return null;
},
occlusion(selector = "#actionBar button, #holdemHeader button, .seat") {
const offenders = [];
const warnings = [];
[...document.querySelectorAll(selector)].forEach(el => {
// While something is open on top, only what is inside it can be judged. The
// rest of the page is meant to be unreachable.
const scope = this.modalScope();
const candidates = [...document.querySelectorAll(selector)]
.filter(el => !scope || scope.contains(el));
candidates.forEach(el => {
const rect = el.getBoundingClientRect();
if (rect.width === 0 || rect.height === 0) return;
@@ -504,10 +538,25 @@ const LayoutAudit = {
if (!enforceOnPointerDevices && matchMedia("(hover: hover)").matches) {
return { name: `touch targets at least ${minimum}px`, offenders, skipped: "pointer device" };
}
const unmeasured = [];
this.visibleControls()
.filter(el => el.type !== "color")
.filter(el => !(exempt && el.matches(exempt)))
.forEach(el => {
// A control inside a scrolling sheet can sit below its container's
// visible area while still having a viewport rect. elementFromPoint at
// its centre then returns the sheet, effectiveTarget gives up, and the
// check used to pass it in silence — which is how "Confirm Winner(s)",
// the button that pays the pot out, went unmeasured for 36 rounds.
// Bring it into view before probing.
const scroller = el.closest("[style*='overflow'], .modalBody, #potWizardBody, #rulingsSheet, #seatEditorPanel");
if (scroller && scroller.scrollHeight > scroller.clientHeight) {
const box = scroller.getBoundingClientRect();
const own = el.getBoundingClientRect();
if (own.bottom > box.bottom || own.top < box.top) {
el.scrollIntoView({ block: "center" });
}
}
const rect = el.getBoundingClientRect();
// Drawn big enough is big enough — no need to probe, and probing wide
// elements is where the cap above used to produce nonsense. Seats sit
@@ -515,15 +564,35 @@ const LayoutAudit = {
// measuring their reach would report the crowding as a fault.
if (rect.width >= minimum - 1 && rect.height >= minimum - 1) return;
// A checkbox inside a label is tapped by tapping the label, so the
// label is the target. Measured rather than probed, because probing
// fails on anything scrolled off the viewport — which is how a 24px
// checkbox with a 335x44 label around it came up as unprobeable
// instead of as the perfectly good target it is.
const label = el.closest("label");
if (label) {
const lr = label.getBoundingClientRect();
if (lr.width >= minimum - 1 && lr.height >= minimum - 1) return;
}
const size = this.effectiveTarget(el);
if (!size) return;
// Still can't measure it. That is not a pass — it is the check failing
// to run, and quietly returning here is exactly the kind of exemption
// that hides real faults. Say so instead.
if (!size) {
unmeasured.push(
`${this.describe(el)} :: could not be probed` +
` (drawn ${Math.round(rect.width)}x${Math.round(rect.height)})`
);
return;
}
if (size.width >= minimum - 1 && size.height >= minimum - 1) return;
offenders.push(
`${this.describe(el)} :: hittable ${size.width}x${size.height}` +
` (drawn ${Math.round(rect.width)}x${Math.round(rect.height)})`
);
});
return { name: `touch targets at least ${minimum}px`, offenders };
return { name: `touch targets at least ${minimum}px`, offenders, unmeasured };
},
// Tapping the middle of a seat must give you that seat.
@@ -537,6 +606,13 @@ const LayoutAudit = {
// Reported separately from occlusion because the cause is different: not an
// overlay on top of the table, but two pieces of the table fighting over a tap.
seatOwnership() {
// Seats behind an open sheet aren't fighting each other for taps — nothing is
// meant to reach them at all. Asking the question there produced six offenders
// per modal, every one of them the modal doing its job.
if (this.modalScope()) {
return { name: "a seat's centre belongs to that seat", offenders: [],
skipped: "a sheet is open over the table" };
}
const seats = [...document.querySelectorAll(".seat")];
const offenders = [];
@@ -617,7 +693,9 @@ const LayoutAudit = {
viewport: `${innerWidth}x${innerHeight}`,
failed: checks.filter(c => c.offenders.length > 0),
// Things worth knowing that aren't faults — see occlusion() on toasts.
warnings: checks.flatMap(c => c.warnings || []),
// Controls a check couldn't probe go here too: not a fault, but not a pass
// either, and a silent skip is how faults hide.
warnings: checks.flatMap(c => [...(c.warnings || []), ...(c.unmeasured || [])]),
passed: checks.filter(c => c.offenders.length === 0).map(c => c.name),
clean: checks.every(c => c.offenders.length === 0),
};