/* Pokémon Void — Boss Conquerors Leaderboard. window.VIEWS.Leaderboard
Shared, everyone-sees-it leaderboard backed by Supabase (free tier), logged
live exactly like the favourite-vote board.
- Two boards: Normal and Hard (beating "Pokedex Fillers").
- Score = number of UNIQUE teams you've beaten that difficulty with. Beating it
again with the same 6 species does not add a point (enforced by a unique index
on (voter_id, difficulty, team_key) in the DB; duplicate inserts fail quietly).
- Top 10 per board; tap an entry to see the teams that person used.
- Wins are submitted from the battle sim at the moment of a fresh-team win,
using the name the player typed on their victory certificate. */
(function () {
const { PageHead, SpriteSlot, go } = window.VUI;
const VDEX = window.VDEX;
// ====================================================================
// CONFIG — same PUBLIC Supabase project as the vote board. Paste your
// publishable key here on deploy (it's the placeholder again locally).
const SUPABASE_URL = 'https://fzwxxvmzjkepfibjjyza.supabase.co';
const SUPABASE_ANON_KEY = 'sb_publishable_mK-sym5D-ue5JoRGODx4iw_FM3X3EDK'; // sb_publishable_... — keep on ONE line
// ====================================================================
const CONFIGURED = !!(SUPABASE_URL && SUPABASE_ANON_KEY);
const REST = SUPABASE_URL.replace(/\/$/, '') + '/rest/v1/boss_wins';
const HEADERS = {
'apikey': SUPABASE_ANON_KEY,
'Authorization': 'Bearer ' + SUPABASE_ANON_KEY,
'Content-Type': 'application/json',
};
// ---- data ----
async function fetchWins() {
// pull every win row; the table is small (one row per person/difficulty/team).
const url = REST + '?select=player_name,difficulty,team_key,team,voter_id,created_at&order=created_at.asc';
const res = await fetch(url, { headers: HEADERS });
if (!res.ok) throw new Error('read failed: ' + res.status);
return res.json();
}
// medal/rank glyph
function rankGlyph(i) { return i === 0 ? '🥇' : i === 1 ? '🥈' : i === 2 ? '🥉' : String(i + 1); }
// how many Pokémon two team-keys share (keys are sorted dex lists joined by '-')
function sharedCount(keyA, keyB) {
const a = String(keyA).split('-'); const b = new Set(String(keyB).split('-'));
let n = 0; a.forEach(d => { if (b.has(d)) n++; }); return n;
}
// build a top-10 board from raw rows for one difficulty.
// groups by player_name (case-insensitive). A team only earns a point if it
// differs by at least 5 Pokémon (shares AT MOST 1) from every team already
// counted for that player — this stops one-slot-swap teams from each scoring.
function buildBoard(rows, difficulty) {
const byPlayer = {};
rows.filter(r => r.difficulty === difficulty).forEach(r => {
const named = (r.player_name || '').trim();
// a named player groups by name (case-insensitive, so their wins combine).
// a blank name groups by voter_id instead, so two different unnamed people
// each get their own "Anonymous" line rather than merging into one entry.
const k = named ? ('name:' + named.toLowerCase()) : ('anon:' + (r.voter_id || Math.random()));
const display = named || 'Anonymous';
if (!byPlayer[k]) byPlayer[k] = { name: display, wins: [], first: r.created_at };
byPlayer[k].wins.push({ team_key: r.team_key, team: r.team, at: r.created_at });
});
return Object.values(byPlayer)
.map(p => {
// accept teams oldest-first; a new team must share <=1 mon with every
// already-counted team to earn a point (differ by 5 of 6).
const counted = [];
p.wins.sort((a, b) => new Date(a.at) - new Date(b.at)).forEach(w => {
if (counted.every(c => sharedCount(w.team_key, c.team_key) <= 1)) counted.push(w);
});
return { name: p.name, score: counted.length, teams: counted.map(c => c.team), first: p.first };
})
.sort((a, b) => (b.score - a.score) || (new Date(a.first) - new Date(b.first)))
.slice(0, 10);
}
function TeamRow({ team }) {
return (
{(team || []).map((m, i) => (
))}
{title}
Points = genuinely different teams you've won with (each must share at most 1 Pokémon with your others). Tap a name to see their teams.
{board.length === 0 && (
No conquerors yet. Be the first to beat it!
)}
{board.map((p, i) => (
setOpenIdx(openIdx === i ? null : i)} style={{ display: 'flex', alignItems: 'center', gap: 12, padding: '12px 0', cursor: 'pointer' }}>
{rankGlyph(i)}
{p.name}
{p.score}
{p.score === 1 ? 'win' : 'wins'}
{openIdx === i ? '▾' : '▸'}
{openIdx === i && (
WINNING TEAMS
{p.teams.map((t, ti) =>
)}
)}
))}
);
}
window.VIEWS.Leaderboard = function Leaderboard() {
const [rows, setRows] = React.useState(null);
const [err, setErr] = React.useState('');
const load = React.useCallback(() => {
if (!CONFIGURED) { setRows([]); return; }
setErr('');
fetchWins().then(setRows).catch(() => { setErr('Could not load the leaderboard right now. Try again shortly.'); setRows([]); });
}, []);
React.useEffect(() => { load(); }, [load]);
React.useEffect(() => {
if (!CONFIGURED) return;
const t = setInterval(load, 30000);
return () => clearInterval(t);
}, [load]);
return (
{!CONFIGURED && (
The leaderboard isn't connected yet. Paste your Supabase key into view-leaderboard.jsx to switch it on.
)}
{err && (
{err}
)}
{/* ---- Olympic podium: the reigning #1 of each tier ---- */}
{/* ---- the three full boards, stacked in a slight pyramid: Nightmare
highest, then Hard, then Normal at the base ---- */}
{rows === null && (
Loading…
)}
);
};
// The reigning champion of each tier, arranged like an Olympic podium:
// Nightmare in the center on the tallest block (gold), Hard to the left
// (silver), Normal to the right (bronze).
function Podium({ rows }) {
const champ = (difficulty) => (buildBoard(rows || [], difficulty)[0] || null);
const nm = champ('nightmare'), hd = champ('hard'), no = champ('normal');
const Block = ({ who, label, accent, height, medal, glow }) => (
{medal}
{who ? who.name : '—'}
{who ? `${who.score} ${who.score === 1 ? 'win' : 'wins'}` : 'unclaimed'}
{label}
);
return (
);
}
})();