refactor: show career W-L-T and Win% as subtitles in existing columns

Removes the standalone Career W% column. Career totals now appear
as a small secondary line inside the W-L-T and Win% cells, loading
asynchronously with a … placeholder while fetching.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-26 21:31:13 -05:00
co-authored by Claude Sonnet 4.6
parent 6f5b473408
commit 85493614e8
2 changed files with 17 additions and 12 deletions
-1
View File
@@ -75,7 +75,6 @@
<th class="text-right cursor-pointer select-none" data-sort="pts">ITC Points</th> <th class="text-right cursor-pointer select-none" data-sort="pts">ITC Points</th>
<th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="wlt">WLT</th> <th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="wlt">WLT</th>
<th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="wpct">Win %</th> <th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="wpct">Win %</th>
<th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="cwpct">Career W%</th>
<th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="rank">ITC Rank</th> <th class="text-right hidden sm:table-cell cursor-pointer select-none" data-sort="rank">ITC Rank</th>
</tr> </tr>
</thead> </thead>
+17 -11
View File
@@ -108,7 +108,6 @@ const sortCols = {
wlt: { key: r => (+r.wins||0) * 10000 - (+r.losses||0) * 100 - (+r.ties||0), defaultDir: 'desc' }, wlt: { key: r => (+r.wins||0) * 10000 - (+r.losses||0) * 100 - (+r.ties||0), defaultDir: 'desc' },
wpct: { key: r => { const g=(+r.wins||0)+(+r.losses||0)+(+r.ties||0); return g?(+r.wins||0)/g:-1; }, defaultDir: 'desc' }, wpct: { key: r => { const g=(+r.wins||0)+(+r.losses||0)+(+r.ties||0); return g?(+r.wins||0)/g:-1; }, defaultDir: 'desc' },
rank: { key: r => +(r.placing || Infinity), defaultDir: 'asc' }, rank: { key: r => +(r.placing || Infinity), defaultDir: 'asc' },
cwpct: { key: r => { const d = careerData[r.userId || r.user?.id]; if (!d) return -1; const g = d.w+d.l+d.t; return g ? d.w/g : -1; }, defaultDir: 'desc' },
}; };
function applySort(rows) { function applySort(rows) {
@@ -262,15 +261,23 @@ function render(state) {
`<td><span class="font-semibold">${esc(name)}</span>` + `<td><span class="font-semibold">${esc(name)}</span>` +
`${u.nickname && fullName(u) ? `<span class="block text-xs text-base-content/40">"${esc(u.nickname)}"</span>` : ""}</td>` + `${u.nickname && fullName(u) ? `<span class="block text-xs text-base-content/40">"${esc(u.nickname)}"</span>` : ""}</td>` +
`<td class="text-right font-mono font-bold">${fmtPts(r.ITCPoints)}</td>` + `<td class="text-right font-mono font-bold">${fmtPts(r.ITCPoints)}</td>` +
`<td class="text-right font-mono hidden sm:table-cell">` + (() => {
`<span class="text-success">${r.wins || 0}</span><span class="text-error">${r.losses || 0}</span>${r.ties || 0}</td>` + const uid = r.userId || r.user?.id;
`<td class="text-right font-mono hidden sm:table-cell">${fmtWpct(r.wins, r.losses, r.ties)}</td>` + const d = uid && careerData[uid];
(() => { const uid = r.userId || r.user?.id; const d = uid && careerData[uid]; const careerSub = d == null
return `<td class="text-right font-mono hidden sm:table-cell">${ ? `<span class="block text-xs opacity-20">…</span>`
d == null ? '<span class="opacity-20">…</span>' : (d.w + d.l + d.t) === 0 ? ''
: (d.w+d.l+d.t) === 0 ? '<span class="opacity-30">—</span>' : `<span class="block text-xs opacity-40">${d.w}${d.l}${d.t} career</span>`;
: fmtWpct(d.w, d.l, d.t) const careerPct = d == null
}</td>`; })() + ? `<span class="block text-xs opacity-20">…</span>`
: (d.w + d.l + d.t) === 0 ? ''
: `<span class="block text-xs opacity-40">${fmtWpct(d.w, d.l, d.t)} career</span>`;
return `<td class="text-right font-mono hidden sm:table-cell">` +
`<span class="text-success">${r.wins || 0}</span><span class="text-error">${r.losses || 0}</span>${r.ties || 0}` +
careerSub + `</td>` +
`<td class="text-right font-mono hidden sm:table-cell">${fmtWpct(r.wins, r.losses, r.ties)}` +
careerPct + `</td>`;
})() +
`<td class="text-right font-mono text-base-content/40 hidden sm:table-cell">#${r.placing ?? "—"}</td>`; `<td class="text-right font-mono text-base-content/40 hidden sm:table-cell">#${r.placing ?? "—"}</td>`;
tb.appendChild(tr); tb.appendChild(tr);
}); });
@@ -338,7 +345,6 @@ function showSkeleton() {
`<td><div class="skeleton h-4 w-12 ml-auto"></div></td>` + `<td><div class="skeleton h-4 w-12 ml-auto"></div></td>` +
`<td class="hidden sm:table-cell"><div class="skeleton h-4 w-14 ml-auto"></div></td>` + `<td class="hidden sm:table-cell"><div class="skeleton h-4 w-14 ml-auto"></div></td>` +
`<td class="hidden sm:table-cell"><div class="skeleton h-4 w-12 ml-auto"></div></td>` + `<td class="hidden sm:table-cell"><div class="skeleton h-4 w-12 ml-auto"></div></td>` +
`<td class="hidden sm:table-cell"><div class="skeleton h-4 w-12 ml-auto"></div></td>` +
`<td class="hidden sm:table-cell"><div class="skeleton h-4 w-10 ml-auto"></div></td>`; `<td class="hidden sm:table-cell"><div class="skeleton h-4 w-10 ml-auto"></div></td>`;
tb.appendChild(tr); tb.appendChild(tr);
} }