Replace best share subtitle with luck indicator
Shows luck as best_share / total_work * 100%. Green for >100% (lucky), red for <100% (unlucky), multiplier format for >=1000%. Hover tooltip explains the metric.
This commit is contained in:
@@ -56,6 +56,20 @@
|
||||
|
||||
const totalHashes = $derived(data.cumulative_shares * 2 ** 32);
|
||||
|
||||
// Luck: best_share / cumulative_work * 100%.
|
||||
// 100% = exactly expected, >100% = lucky, <100% = unlucky.
|
||||
const luckPct = $derived.by(() => {
|
||||
const best = data.best_diff;
|
||||
const work = data.cumulative_shares;
|
||||
if (!best || !work || work <= 0) return 0;
|
||||
return (best / work) * 100;
|
||||
});
|
||||
const luckLabel = $derived.by(() => {
|
||||
if (!data.best_diff || !data.cumulative_shares) return "—";
|
||||
if (luckPct >= 1000) return `${(luckPct / 100).toFixed(1)}x`;
|
||||
return luckPct.toFixed(0) + "%";
|
||||
});
|
||||
|
||||
// Block-height flash on network-wide new block.
|
||||
let prevHeight = $state(0);
|
||||
let heightFlash = $state(false);
|
||||
@@ -84,7 +98,15 @@
|
||||
<div class="card">
|
||||
<div class="stat-label">Best share</div>
|
||||
<div class="stat-value">{formatDifficulty(data.best_diff)}</div>
|
||||
<div class="stat-sub">all-time pool record</div>
|
||||
<div
|
||||
class="luck-sub"
|
||||
class:lucky={luckPct > 100}
|
||||
class:unlucky={luckPct > 0 && luckPct < 100}
|
||||
title="Luck = best share / total work. 100% means your best share matches the work done. Above 100% is lucky (found a harder share than expected), below is unlucky."
|
||||
>
|
||||
<span class="luck-value">{luckLabel}</span>
|
||||
<span class="luck-label">luck</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
@@ -194,6 +216,35 @@
|
||||
color: var(--bad);
|
||||
}
|
||||
|
||||
.luck-sub {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 0.4em;
|
||||
margin-top: 0.45em;
|
||||
cursor: help;
|
||||
}
|
||||
.luck-value {
|
||||
font-size: 1.15rem;
|
||||
font-weight: 700;
|
||||
font-variant-numeric: tabular-nums;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
.luck-label {
|
||||
color: var(--fg-dim);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
.luck-sub.lucky .luck-value {
|
||||
color: var(--good);
|
||||
text-shadow: 0 0 10px rgba(92, 224, 168, 0.35);
|
||||
}
|
||||
.luck-sub.unlucky .luck-value {
|
||||
color: var(--bad);
|
||||
text-shadow: 0 0 10px rgba(255, 107, 107, 0.25);
|
||||
}
|
||||
|
||||
.height-card {
|
||||
transition: box-shadow 0.3s, border-color 0.3s;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user