// Turneringer — oversikt over alle åpne, live og avsluttede turneringer. const TurneringerPage = ({ accent, onNav }) => { const [filter, setFilter] = React.useState("alle"); const [tournaments, setTournaments] = React.useState([]); const [loading, setLoading] = React.useState(true); React.useEffect(() => { WZN_Store.getTournaments().then(data => { setTournaments(data || []); setLoading(false); }); }, []); const STATUS_ORDER = { live: 0, open: 1, locked: 2, draft: 3, completed: 4, cancelled: 5 }; const filtered = tournaments.filter(t => { if (filter === "live") return t.status === "live"; if (filter === "open") return t.status === "open"; return true; }); const sorted = [...filtered].sort((a,b) => (STATUS_ORDER[a.status]??3) - (STATUS_ORDER[b.status]??3)); const featured = sorted[0]; const liveCount = tournaments.filter(t => t.status === "live").length; const openCount = tournaments.filter(t => t.status === "open").length; const nextOpen = tournaments.find(t => t.status === "open"); const nesteStarterText = nextOpen && nextOpen.start_date ? (() => { const dt = formatTrnDate(nextOpen.start_date); return `NESTE STARTER ${dt.date} KL ${dt.time}`; })() : "INGEN PLANLAGTE"; if (loading) return
LASTER…
; return ( <> TURNERINGER.} sub="Ukentlige norske Warzone-turneringer. Verifiserte resultater, premier i pott. Meld lag eller hopp inn som solo-spiller — alle nivåer er velkommen." accent={accent} right={
{liveCount} LIVE · {openCount} ÅPNE {nesteStarterText}
} /> {sorted.length === 0 ? (
INGEN TURNERINGER

{filter === "alle" ? "INGEN TURNERINGER ENNÅ" : `INGEN ${filter.toUpperCase()}-TURNERINGER`}

) : ( <> {/* Featured / next-up — full-bredde card */} {/* Filter strip */}
{[ { id: "alle", label: "ALLE" }, { id: "open", label: "PÅMELDING ÅPEN" }, { id: "live", label: "LIVE NÅ" }, ].map(f => { const active = filter === f.id; return ( ); })}
VISER {sorted.length} TURNERINGER
{/* Grid of tournaments */}
{sorted.map(t => )}
)} {/* Past tournaments */} {(() => { const past = tournaments.filter(t => t.status === "completed"); if (past.length === 0) return null; return (
RESULTS / 02.B

SISTE RESULTATER

{["TURNERING", "DATO", "FORMAT", "LAG", "VINNER", "PREMIE"].map(h => ( ))} {past.map(p => ( onNav && onNav("turnering", { tournamentId: p.id })} style={{ borderBottom: "1px solid var(--line)", cursor: "pointer", transition: "background 0.12s", }} onMouseEnter={(e) => { e.currentTarget.style.background = "var(--bg-2)"; }} onMouseLeave={(e) => { e.currentTarget.style.background = "transparent"; }} > ))}
{h}
{p.name || "—"} {p.start_date ? formatTrnDate(p.start_date).date : (p.date || "—")} {(p.team_size || "trios").toUpperCase()} {p.max_teams || "—"} {p.winner ? (
{p.winner.tag || "—"} {p.winner.name || "—"}
) : —} 		{p.prize_pool != null ? `${p.prize_pool.toLocaleString()} kr` : (p.prize ? `${p.prize.toLocaleString()} kr` : "—")}
); })()} ); }; // ───────── Featured tournament — big card ───────── const FeaturedTournament = ({ t, accent, onNav }) => { if (!t || !t.start_date) { return (
LASTER TURNERING…
); } const dt = formatTrnDate(t.start_date); const isLive = t.status === "live"; const registered = t.registered || 0; const maxTeams = t.max_teams || 1; const pct = (registered / maxTeams) * 100; return (
{/* Big background watermark */}
{isLive ? "LIVE" : "NESTE"}
{isLive ? ( <> LIVE NÅ · {(t.type || "bracket").toUpperCase()} ) : ( <>★ NESTE OPP · {(t.type || "bracket").toUpperCase()} )}

{(t.name || "").toUpperCase()}

{(t.team_size || "trios").toUpperCase()} · {t.games || 5} GAMES{t.maps && t.maps.length ? " · " + t.maps.join(" · ").toUpperCase() : ""}
{/* Stat strip */}
{[ { n: dt.date, l: dt.day.toUpperCase() + " · MAI" }, { n: dt.time, l: "STARTER" }, { n: `${registered}/${maxTeams}`, l: "LAG" }, { n: `${(t.prize_pool || 0) >= 1000 ? `${(t.prize_pool||0)/1000}K` : (t.prize_pool||0)} kr`, l: "POTT", accent: true }, ].map((s, i) => (
{s.n}
{s.l}
))}
{isLive ? "FØLG LIVE" : "PÅMELDING"}
{registered}/{maxTeams} LAG PÅMELDT {maxTeams - registered} LEDIGE
); }; // ───────── Tournament card (kompakt, brukes i grid) ───────── const TournamentCard = ({ t, accent, onNav }) => { if (!t || !t.start_date) { return (
LASTER…
); } const dt = formatTrnDate(t.start_date); const isLive = t.status === "live"; const registered = t.registered || 0; const maxTeams = t.max_teams || 1; const pct = (registered / maxTeams) * 100; return (
onNav && onNav("turnering", { tournamentId: t.id })} style={{ background: "var(--bg-1)", border: `1px solid ${isLive ? accent : "var(--line)"}`, padding: 22, position: "relative", overflow: "hidden", cursor: "pointer", transition: "border-color 0.15s, transform 0.15s", }} onMouseEnter={(e) => { e.currentTarget.style.borderColor = accent; e.currentTarget.style.transform = "translateY(-2px)"; }} onMouseLeave={(e) => { e.currentTarget.style.borderColor = isLive ? accent : "var(--line)"; e.currentTarget.style.transform = "translateY(0)"; }} >
{isLive ? "● LIVE NÅ" : "PÅMELDING ÅPEN"} {t.type === "killrace" ? "▰ KILLRACE" : "▰ BRACKET"}

{t.name || ""}

{(t.team_size || "trios").toUpperCase()} · {t.games || 5} GAMES{t.maps && t.maps.length ? " · " + t.maps.join(", ") : ""}
START
{dt.day} {dt.date}
{dt.time}
LAG
{registered}/{maxTeams}
PREMIE
{(t.prize_pool || 0).toLocaleString()} kr
{maxTeams - registered} LEDIGE PLASSER
); }; Object.assign(window, { TurneringerPage });