3701 lines
139 KiB
JavaScript
3701 lines
139 KiB
JavaScript
// Lightweight multi-page handler for GD fedl
|
||
(function(){
|
||
function qs(id){return document.getElementById(id)}
|
||
|
||
const page = document.body.dataset.page;
|
||
const isFileProtocol = window.location.protocol === 'file:';
|
||
const TESTING_MODE = false;
|
||
const liveServerBase = TESTING_MODE ? 'http://127.0.0.1:8090/fedl' : 'https://server.fedl.site/fedl';
|
||
const canUseLiveServer = !isFileProtocol || !!liveServerBase;
|
||
const liveApiUrl = `${liveServerBase}/api/list`;
|
||
const liveRunsUrl = `${liveServerBase}/api/runs`;
|
||
const liveEventsUrl = `${liveServerBase}/events`;
|
||
const liveDataFileUrl = `${liveServerBase}/server/data.txt`;
|
||
const MOD_USERS = ['wolf_reaper90','dioxyx','steve'];
|
||
const SPA_PAGE_KEY = 'onepage';
|
||
/** Use for POST /api/import/* and any path under the same base as list/runs (not root-relative /api/...). */
|
||
function liveApiPath(path){
|
||
const p = String(path || '').startsWith('/') ? path : `/${path}`;
|
||
return `${liveServerBase}${p}`;
|
||
}
|
||
const offlinePage = 'offlineindex.html';
|
||
|
||
function redirectToOffline(){
|
||
if(window.location.pathname.endsWith(`/${offlinePage}`)) return;
|
||
window.location.replace(offlinePage);
|
||
}
|
||
|
||
function probeLiveServer(timeoutMs = 5000){
|
||
const controller = new AbortController();
|
||
const timeoutId = setTimeout(()=>controller.abort(), timeoutMs);
|
||
return fetch(liveServerBase, {
|
||
method:'HEAD',
|
||
cache:'no-store',
|
||
signal: controller.signal
|
||
}).then(response => {
|
||
clearTimeout(timeoutId);
|
||
return response;
|
||
}).catch(error => {
|
||
clearTimeout(timeoutId);
|
||
throw error;
|
||
});
|
||
}
|
||
|
||
const pagesNeedingLiveStatus = new Set(['index', 'run', 'messages', 'contact', 'signup', 'login', 'account', 'reset-password', 'admelist']);
|
||
if(pagesNeedingLiveStatus.has(page) && !window.location.pathname.endsWith(`/${offlinePage}`)){
|
||
probeLiveServer().catch(()=>{
|
||
redirectToOffline();
|
||
});
|
||
}
|
||
let cachedItems = null;
|
||
let cachedRuns = null;
|
||
let cachedLevelMeta = null;
|
||
let liveBound = false;
|
||
let liveHandlers = [];
|
||
let runsHandlers = [];
|
||
|
||
// Storage helpers
|
||
function read(key, fallback){
|
||
try{const v = localStorage.getItem(key); return v?JSON.parse(v):fallback}
|
||
catch(e){return fallback}
|
||
}
|
||
function write(key, val){localStorage.setItem(key,JSON.stringify(val))}
|
||
|
||
(function initTheme(){
|
||
const themes = {
|
||
dark: { '--bg': '#0f1724', '--panel': '#071326', '--accent': '#5cc5ff', '--muted': '#9fb3c8', '--text': '#e6eef8', '--card': '#081220', '--accent-warm': '#ffb84d' },
|
||
light: { '--bg': '#f0f4f8', '--panel': '#e2e8f0', '--accent': '#0284c7', '--muted': '#64748b', '--text': '#1e293b', '--card': '#cbd5e1', '--accent-warm': '#f59e0b' },
|
||
blue: { '--bg': '#0d1b2a', '--panel': '#1b3a5f', '--accent': '#38bdf8', '--muted': '#94a3b8', '--text': '#e0f2fe', '--card': '#142d4c', '--accent-warm': '#fbbf24' },
|
||
midnight: { '--bg': '#0a0a12', '--panel': '#12121f', '--accent': '#a78bfa', '--muted': '#6b7280', '--text': '#e5e7eb', '--card': '#0f0f1a', '--accent-warm': '#f472b6' },
|
||
cyberpunk: { '--bg': '#0f0f1a', '--panel': '#1a0a2e', '--accent': '#00ff9f', '--muted': '#b388ff', '--text': '#e0f7fa', '--card': '#150f25', '--accent-warm': '#ff00a8' },
|
||
earth: { '--bg': '#1a2f1a', '--panel': '#2d4a2d', '--accent': '#84cc16', '--muted': '#a3c9a3', '--text': '#ecfccb', '--card': '#223d22', '--accent-warm': '#fbbf24' },
|
||
retro: { '--bg': '#1a1208', '--panel': '#2b1a0a', '--accent': '#ff9f1c', '--muted': '#c9a66b', '--text': '#ffe4b5', '--card': '#241809', '--accent-warm': '#ff6b35' },
|
||
matrix: { '--bg': '#000a00', '--panel': '#001100', '--accent': '#00ff00', '--muted': '#00aa00', '--text': '#00ff00', '--card': '#001100', '--accent-warm': '#88ff88' },
|
||
synthwave: { '--bg': '#1a0a2e', '--panel': '#2d1b4e', '--accent': '#ff2a6d', '--muted': '#c792ea', '--text': '#f4e9ff', '--card': '#251440', '--accent-warm': '#05d9e8' },
|
||
fire: { '--bg': '#1a0505', '--panel': '#2d0a0a', '--accent': '#ff4500', '--muted': '#cc5500', '--text': '#ffd4b8', '--card': '#250a0a', '--accent-warm': '#ffaa00' },
|
||
galaxy: { '--bg': '#0a0612', '--panel': '#150f25', '--accent': '#e056fd', '--muted': '#7c3aed', '--text': '#f0e6ff', '--card': '#0f0818', '--accent-warm': '#f9ca24' },
|
||
candy: { '--bg': '#fdf2f8', '--panel': '#fce7f3', '--accent': '#f472b6', '--muted': '#94a3b8', '--text': '#831843', '--card': '#fbcfe8', '--accent-warm': '#34d399' },
|
||
highcontrast: { '--bg': '#000000', '--panel': '#111111', '--accent': '#ffffff', '--muted': '#cccccc', '--text': '#ffffff', '--card': '#0a0a0a', '--accent-warm': '#ffff00' },
|
||
original: { '--bg': '#0f1724', '--panel': '#071326', '--accent': '#5cc5ff', '--muted': '#9fb3c8', '--text': '#e6eef8', '--card': '#081220', '--accent-warm': '#ffb84d' }
|
||
};
|
||
const saved = localStorage.getItem('fedl_theme') || 'dark';
|
||
const vars = themes[saved];
|
||
if (vars) {
|
||
const root = document.documentElement;
|
||
Object.entries(vars).forEach(([k, v]) => root.style.setProperty(k, v));
|
||
document.body.dataset.theme = saved;
|
||
}
|
||
try {
|
||
const activeId = localStorage.getItem('fedl_user_account_active');
|
||
if (activeId) {
|
||
const userData = JSON.parse(localStorage.getItem('fedl_user_data_' + activeId));
|
||
if (userData && userData.theme) {
|
||
const themeName = userData.theme;
|
||
const accountVars = themes[themeName];
|
||
if (accountVars) {
|
||
document.documentElement.style.setProperty('--bg', accountVars['--bg']);
|
||
document.documentElement.style.setProperty('--panel', accountVars['--panel']);
|
||
document.documentElement.style.setProperty('--accent', accountVars['--accent']);
|
||
document.documentElement.style.setProperty('--muted', accountVars['--muted']);
|
||
document.documentElement.style.setProperty('--text', accountVars['--text']);
|
||
document.documentElement.style.setProperty('--card', accountVars['--card']);
|
||
document.documentElement.style.setProperty('--accent-warm', accountVars['--accent-warm']);
|
||
document.body.dataset.theme = themeName;
|
||
localStorage.setItem('fedl_theme', themeName);
|
||
}
|
||
}
|
||
}
|
||
} catch(e) {}
|
||
})();
|
||
|
||
function debounce(fn, wait){
|
||
let timeoutId = null;
|
||
return function(){
|
||
const ctx = this;
|
||
const args = arguments;
|
||
clearTimeout(timeoutId);
|
||
timeoutId = setTimeout(()=>fn.apply(ctx, args), wait);
|
||
};
|
||
}
|
||
|
||
const FEDL_USER_ACCOUNTS = 'fedl_user_accounts';
|
||
const FEDL_USER_ACCOUNT_ACTIVE = 'fedl_user_account_active';
|
||
|
||
function fedlAccountId(){
|
||
try {
|
||
return localStorage.getItem(FEDL_USER_ACCOUNT_ACTIVE) || '';
|
||
} catch (e) {
|
||
return '';
|
||
}
|
||
}
|
||
|
||
function fedlSetActiveAccountId(id){
|
||
try {
|
||
if (id) {
|
||
localStorage.setItem(FEDL_USER_ACCOUNT_ACTIVE, id);
|
||
} else {
|
||
localStorage.removeItem(FEDL_USER_ACCOUNT_ACTIVE);
|
||
}
|
||
} catch (e) {}
|
||
}
|
||
|
||
function fedlListAccounts(){
|
||
return read(FEDL_USER_ACCOUNTS, []);
|
||
}
|
||
|
||
function fedlSaveAccountsList(accounts){
|
||
write(FEDL_USER_ACCOUNTS, accounts);
|
||
}
|
||
|
||
function fedlNewAccountId(){
|
||
return `u_${Date.now().toString(36)}${Math.random().toString(36).slice(2, 8)}`;
|
||
}
|
||
|
||
function fedlEmptyRouletteSlots(){
|
||
return { '1': null, '2': null, '3': null };
|
||
}
|
||
|
||
function fedlDefaultUserData(){
|
||
return { roulettePick: null, levelPercents: {}, savedRuns: [], rouletteSlots: fedlEmptyRouletteSlots(), theme: 'dark' };
|
||
}
|
||
|
||
function fedlGetAccountPayload(accountId){
|
||
const raw = read(`fedl_user_data_${accountId}`, fedlDefaultUserData());
|
||
if (!Array.isArray(raw.savedRuns)) {
|
||
raw.savedRuns = [];
|
||
}
|
||
if (!raw.levelPercents || typeof raw.levelPercents !== 'object') {
|
||
raw.levelPercents = {};
|
||
}
|
||
if (!raw.rouletteSlots || typeof raw.rouletteSlots !== 'object') {
|
||
raw.rouletteSlots = fedlEmptyRouletteSlots();
|
||
}
|
||
['1', '2', '3'].forEach(k => {
|
||
if (!Object.prototype.hasOwnProperty.call(raw.rouletteSlots, k)) {
|
||
raw.rouletteSlots[k] = null;
|
||
}
|
||
});
|
||
return raw;
|
||
}
|
||
|
||
function fedlNextPercentHint(inputValue){
|
||
const raw = String(inputValue || '').trim().replace(',', '.');
|
||
if (!raw) {
|
||
return {
|
||
kind: 'muted',
|
||
text: 'Enter your current best %, then tap Submit % to save and see the next % to aim for (+1% roulette step).'
|
||
};
|
||
}
|
||
const n = parseFloat(raw);
|
||
if (!Number.isFinite(n) || n < 0 || n > 100) {
|
||
return { kind: 'error', text: 'Enter a number from 0 to 100.' };
|
||
}
|
||
if (n >= 100) {
|
||
return {
|
||
kind: 'success',
|
||
text: 'You are at 100%. Beat the level, then spin — your next demon usually adds +1% to your roulette target.'
|
||
};
|
||
}
|
||
const next = Math.min(100, Math.floor(n) + 1);
|
||
if (next >= 100) {
|
||
return { kind: 'success', text: 'Saved. Next goal on this level: 100% (full completion).' };
|
||
}
|
||
return {
|
||
kind: 'success',
|
||
text: `Saved. Next % to hit on this level: ${next}% (classic +1% roulette step).`
|
||
};
|
||
}
|
||
|
||
async function fedlReadJsonResponse(r){
|
||
const text = await r.text();
|
||
let data = {};
|
||
try {
|
||
data = text ? JSON.parse(text) : {};
|
||
} catch (e) {
|
||
data = {};
|
||
}
|
||
const msg = (data && data.error && String(data.error)) || (data && data.message && String(data.message)) || '';
|
||
const plain = String(text || '').trim();
|
||
return { data, message: msg || plain || r.statusText || `Error ${r.status}` };
|
||
}
|
||
|
||
function fedlAddSavedRun(accountId, fields){
|
||
if (!accountId || accountId !== fedlServerUserId) {
|
||
return { ok: false, error: 'Sign in to save runs to your account.' };
|
||
}
|
||
const playerName = String(fields.playerName || '').trim();
|
||
const levelTitle = String(fields.levelTitle || '').trim();
|
||
if (!playerName || !levelTitle) {
|
||
return { ok: false, error: 'Player name and level are required to save a run.' };
|
||
}
|
||
const p = fedlGetAccountPayload(accountId);
|
||
const list = p.savedRuns.slice();
|
||
const id = `sv_${Date.now().toString(36)}${Math.random().toString(36).slice(2, 10)}`;
|
||
list.unshift({
|
||
id,
|
||
playerName,
|
||
levelTitle,
|
||
videoUrl: String(fields.videoUrl || '').trim(),
|
||
percent: String(fields.percent != null ? fields.percent : '100').trim() || '100',
|
||
rawFootageUrl: String(fields.rawFootageUrl || '').trim(),
|
||
notes: String(fields.notes || '').trim(),
|
||
savedAt: new Date().toISOString()
|
||
});
|
||
p.savedRuns = list.slice(0, 48);
|
||
fedlSaveAccountPayload(accountId, p);
|
||
return { ok: true };
|
||
}
|
||
|
||
function fedlRemoveSavedRun(accountId, runId){
|
||
if (!accountId || accountId !== fedlServerUserId || !runId) {
|
||
return;
|
||
}
|
||
const p = fedlGetAccountPayload(accountId);
|
||
p.savedRuns = (p.savedRuns || []).filter(r => r && r.id !== runId);
|
||
fedlSaveAccountPayload(accountId, p);
|
||
}
|
||
|
||
function fedlSaveAccountPayload(accountId, payload){
|
||
write(`fedl_user_data_${accountId}`, payload);
|
||
fedlSchedulePushUserState(accountId);
|
||
}
|
||
|
||
let fedlServerUserId = null;
|
||
let fedlServerUsername = null;
|
||
const FEDL_AUTH_TOKEN_KEY = 'fedl_auth_token';
|
||
|
||
function fedlGetAuthToken(){
|
||
try {
|
||
return localStorage.getItem(FEDL_AUTH_TOKEN_KEY) || '';
|
||
} catch (e) {
|
||
return '';
|
||
}
|
||
}
|
||
|
||
function fedlSetAuthToken(token){
|
||
try {
|
||
if (token) {
|
||
localStorage.setItem(FEDL_AUTH_TOKEN_KEY, token);
|
||
} else {
|
||
localStorage.removeItem(FEDL_AUTH_TOKEN_KEY);
|
||
}
|
||
} catch (e) {}
|
||
}
|
||
|
||
function fedlClearServerSession(){
|
||
fedlServerUserId = null;
|
||
fedlServerUsername = null;
|
||
fedlSetAuthToken('');
|
||
}
|
||
|
||
function fedlDataUserId(){
|
||
if (fedlServerUserId) {
|
||
return fedlServerUserId;
|
||
}
|
||
return fedlAccountId();
|
||
}
|
||
|
||
let fedlPushStateTimer = null;
|
||
function fedlSchedulePushUserState(accountId){
|
||
if (!accountId || !fedlGetAuthToken() || accountId !== fedlServerUserId || !canUseLiveServer) {
|
||
return;
|
||
}
|
||
if (fedlPushStateTimer) {
|
||
clearTimeout(fedlPushStateTimer);
|
||
}
|
||
fedlPushStateTimer = setTimeout(()=>{
|
||
const payload = fedlGetAccountPayload(accountId);
|
||
fetch(`${liveServerBase}/api/user/state`, {
|
||
method: 'PUT',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
Authorization: `Bearer ${fedlGetAuthToken()}`
|
||
},
|
||
body: JSON.stringify({ data: payload })
|
||
}).catch(()=>{});
|
||
}, 450);
|
||
}
|
||
|
||
function fedlRefreshAuthState(){
|
||
const t = fedlGetAuthToken();
|
||
if (!t || !canUseLiveServer) {
|
||
fedlServerUserId = null;
|
||
fedlServerUsername = null;
|
||
return Promise.resolve(null);
|
||
}
|
||
return fetch(`${liveServerBase}/api/auth/me`, {
|
||
headers: { Authorization: `Bearer ${t}` },
|
||
cache: 'no-store'
|
||
}).then(r=>{
|
||
if (!r.ok) {
|
||
throw new Error('auth');
|
||
}
|
||
return r.json();
|
||
}).then(j=>{
|
||
fedlServerUserId = j.userId;
|
||
fedlServerUsername = j.username;
|
||
return j;
|
||
}).catch(()=>{
|
||
fedlClearServerSession();
|
||
return null;
|
||
});
|
||
}
|
||
|
||
function fedlPullUserStateToLocal(userId){
|
||
const t = fedlGetAuthToken();
|
||
if (!t || !userId || !canUseLiveServer) {
|
||
return Promise.resolve();
|
||
}
|
||
return fetch(`${liveServerBase}/api/user/state`, {
|
||
headers: { Authorization: `Bearer ${t}` },
|
||
cache: 'no-store'
|
||
}).then(r=>{
|
||
if (!r.ok) {
|
||
return null;
|
||
}
|
||
return r.json();
|
||
}).then(j=>{
|
||
if (j && j.data) {
|
||
write(`fedl_user_data_${userId}`, j.data);
|
||
}
|
||
}).catch(()=>{});
|
||
}
|
||
|
||
function injectFedlAuthNav(){
|
||
const nav = document.querySelector('header nav');
|
||
if (!nav || nav.querySelector('.fedl-auth-nav')) {
|
||
return;
|
||
}
|
||
const wrap = document.createElement('span');
|
||
wrap.className = 'fedl-auth-nav';
|
||
nav.appendChild(wrap);
|
||
}
|
||
|
||
function isFedlMod(){
|
||
if(!fedlServerUsername) return Promise.resolve(false);
|
||
return Promise.resolve(MOD_USERS.includes(fedlServerUsername.toLowerCase()));
|
||
}
|
||
|
||
function fedlUpdateAuthNav(){
|
||
const wrap = document.querySelector('.fedl-auth-nav');
|
||
if (!wrap) {
|
||
return;
|
||
}
|
||
wrap.textContent = '';
|
||
if (fedlServerUsername) {
|
||
isFedlMod().then(isMod=>{
|
||
const label = document.createElement('span');
|
||
label.className = 'fedl-auth-label muted';
|
||
label.appendChild(document.createTextNode('Hi, '));
|
||
const strong = document.createElement('strong');
|
||
strong.textContent = fedlServerUsername;
|
||
label.appendChild(strong);
|
||
wrap.appendChild(label);
|
||
wrap.appendChild(document.createTextNode(' '));
|
||
if (isMod) {
|
||
const adminLink = document.createElement('a');
|
||
adminLink.href = 'admelist.html';
|
||
adminLink.textContent = 'Admin';
|
||
wrap.appendChild(adminLink);
|
||
wrap.appendChild(document.createTextNode(' '));
|
||
}
|
||
const accountLink = document.createElement('a');
|
||
accountLink.href = 'account.html';
|
||
accountLink.textContent = 'Account';
|
||
wrap.appendChild(accountLink);
|
||
wrap.appendChild(document.createTextNode(' '));
|
||
const btn = document.createElement('button');
|
||
btn.type = 'button';
|
||
btn.className = 'btn ghost-btn small-btn fedl-logout-btn';
|
||
btn.textContent = 'Log out';
|
||
btn.addEventListener('click', ()=>{
|
||
const tok = fedlGetAuthToken();
|
||
if (tok && canUseLiveServer) {
|
||
fetch(`${liveServerBase}/api/auth/logout`, {
|
||
method: 'POST',
|
||
headers: { Authorization: `Bearer ${tok}` }
|
||
}).catch(()=>{});
|
||
}
|
||
fedlClearServerSession();
|
||
fedlUpdateAuthNav();
|
||
document.dispatchEvent(new CustomEvent('fedl-auth-updated'));
|
||
window.location.reload();
|
||
});
|
||
wrap.appendChild(btn);
|
||
});
|
||
} else {
|
||
const a1 = document.createElement('a');
|
||
const returnTo = encodeURIComponent(window.location.href);
|
||
a1.href = 'login.html?return=' + returnTo;
|
||
a1.textContent = 'Log in';
|
||
wrap.appendChild(a1);
|
||
wrap.appendChild(document.createTextNode(' '));
|
||
const a2 = document.createElement('a');
|
||
a2.href = 'signup.html';
|
||
a2.textContent = 'Sign up';
|
||
wrap.appendChild(a2);
|
||
}
|
||
}
|
||
|
||
function fedlNormalizeLevelKey(title){
|
||
return String(title || '').trim().toLowerCase();
|
||
}
|
||
|
||
function fedlGetLevelPercent(accountId, title){
|
||
if (!accountId) {
|
||
return '';
|
||
}
|
||
const p = fedlGetAccountPayload(accountId);
|
||
const k = fedlNormalizeLevelKey(title);
|
||
return (p.levelPercents && p.levelPercents[k]) ? String(p.levelPercents[k]) : '';
|
||
}
|
||
|
||
function fedlSetLevelPercent(accountId, title, percent){
|
||
if (!accountId) {
|
||
return;
|
||
}
|
||
const p = fedlGetAccountPayload(accountId);
|
||
if (!p.levelPercents) {
|
||
p.levelPercents = {};
|
||
}
|
||
const k = fedlNormalizeLevelKey(title);
|
||
const v = String(percent || '').trim();
|
||
if (v) {
|
||
p.levelPercents[k] = v;
|
||
} else {
|
||
delete p.levelPercents[k];
|
||
}
|
||
if (p.roulettePick && fedlNormalizeLevelKey(p.roulettePick.title) === k) {
|
||
p.roulettePick.percent = v;
|
||
}
|
||
fedlSaveAccountPayload(accountId, p);
|
||
}
|
||
|
||
function fedlSaveRoulettePick(accountId, pick){
|
||
if (!accountId || !pick) {
|
||
return;
|
||
}
|
||
const p = fedlGetAccountPayload(accountId);
|
||
p.roulettePick = {
|
||
title: pick.title,
|
||
position: pick.position,
|
||
level: pick.level,
|
||
url: pick.url,
|
||
levelId: pick.levelId,
|
||
noteSource: pick.noteSource,
|
||
percent: String(pick.percent || '').trim()
|
||
};
|
||
if (p.roulettePick.title && p.roulettePick.percent) {
|
||
if (!p.levelPercents) {
|
||
p.levelPercents = {};
|
||
}
|
||
p.levelPercents[fedlNormalizeLevelKey(p.roulettePick.title)] = p.roulettePick.percent;
|
||
}
|
||
fedlSaveAccountPayload(accountId, p);
|
||
}
|
||
|
||
function fedlCreateAccount(displayName){
|
||
const name = String(displayName || '').trim();
|
||
if (!name) {
|
||
return null;
|
||
}
|
||
const accounts = fedlListAccounts();
|
||
const id = fedlNewAccountId();
|
||
accounts.push({ id, name, createdAt: new Date().toISOString() });
|
||
fedlSaveAccountsList(accounts);
|
||
fedlSetActiveAccountId(id);
|
||
fedlSaveAccountPayload(id, fedlDefaultUserData());
|
||
return { id, name };
|
||
}
|
||
|
||
function parseData(txt){
|
||
return txt.split(/\r?\n/).map(l=>l.trim()).filter(Boolean).map(l=>{
|
||
const parts = l.split('|').map(p=>p.trim());
|
||
return {level:parts[0]||'Unknown',position:parts[1]||'',title:parts[2]||'Untitled',url:parts[3]||''};
|
||
});
|
||
}
|
||
|
||
function formatData(items){
|
||
return items.map(item=>[
|
||
item.level || 'new',
|
||
item.position || '',
|
||
item.title || '',
|
||
item.url || ''
|
||
].join('|')).join('\n');
|
||
}
|
||
|
||
function parseLevelMeta(txt){
|
||
const map = {};
|
||
txt.split(/\r?\n/).map(l=>l.trim()).filter(Boolean).forEach(l=>{
|
||
if(l.startsWith('//')) return;
|
||
const parts = l.split('|').map(p=>p.trim());
|
||
const title = parts[0] || '';
|
||
if(!title) return;
|
||
map[title] = {
|
||
levelId: parts[1] || 'unknown',
|
||
percent: parts[2] || '100'
|
||
};
|
||
});
|
||
return map;
|
||
}
|
||
|
||
function loadItems(){
|
||
if(cachedItems) return Promise.resolve(cachedItems);
|
||
if(!canUseLiveServer){
|
||
return fetch('data.txt', {cache:'no-store'}).then(r=>{
|
||
if(!r.ok) throw new Error('static data unavailable');
|
||
return r.text();
|
||
}).then(txt=>{
|
||
cachedItems = parseData(txt);
|
||
return cachedItems;
|
||
});
|
||
}
|
||
return fetch(liveApiUrl, {cache:'no-store'}).then(r=>{
|
||
if(!r.ok) throw new Error('API unavailable');
|
||
const contentType = (r.headers.get('content-type') || '').toLowerCase();
|
||
if(contentType.includes('application/json')){
|
||
return r.json().then(data=>Array.isArray(data.items) ? data.items : []);
|
||
}
|
||
return r.text().then(txt=>parseData(txt));
|
||
}).then(items=>{
|
||
cachedItems = items;
|
||
return cachedItems;
|
||
}).catch(()=>{
|
||
return fetch(liveDataFileUrl, {cache:'no-store'}).then(r=>{
|
||
if(!r.ok) throw new Error('server data unavailable');
|
||
return r.text();
|
||
}).then(txt=>{
|
||
cachedItems = parseData(txt);
|
||
return cachedItems;
|
||
}).catch(()=>{
|
||
return fetch('data.txt', {cache:'no-store'}).then(r=>{
|
||
if(!r.ok) throw new Error('static data unavailable');
|
||
return r.text();
|
||
}).then(txt=>{
|
||
cachedItems = parseData(txt);
|
||
return cachedItems;
|
||
});
|
||
});
|
||
});
|
||
}
|
||
|
||
function clearItemsCache(){
|
||
cachedItems = null;
|
||
}
|
||
|
||
function loadRuns(){
|
||
if(cachedRuns) return Promise.resolve(cachedRuns);
|
||
if(!canUseLiveServer){
|
||
cachedRuns = [];
|
||
return Promise.resolve(cachedRuns);
|
||
}
|
||
return fetch(liveRunsUrl, {cache:'no-store'}).then(r=>{
|
||
if(!r.ok) throw new Error('Runs API unavailable');
|
||
return r.json();
|
||
}).then(data=>{
|
||
cachedRuns = Array.isArray(data.items) ? data.items : [];
|
||
return cachedRuns;
|
||
});
|
||
}
|
||
|
||
function clearRunsCache(){
|
||
cachedRuns = null;
|
||
}
|
||
|
||
function onLiveUpdate(handler){
|
||
liveHandlers.push(handler);
|
||
}
|
||
|
||
function notifyLiveUpdate(items){
|
||
liveHandlers.forEach(handler=>handler(items));
|
||
}
|
||
|
||
function onRunsUpdate(handler){
|
||
runsHandlers.push(handler);
|
||
}
|
||
|
||
function notifyRunsUpdate(runs){
|
||
runsHandlers.forEach(handler=>handler(runs));
|
||
}
|
||
|
||
function refreshItems(){
|
||
clearItemsCache();
|
||
return loadItems().then(items=>{
|
||
notifyLiveUpdate(items);
|
||
return items;
|
||
});
|
||
}
|
||
|
||
function refreshRuns(){
|
||
clearRunsCache();
|
||
return loadRuns().then(runs=>{
|
||
notifyRunsUpdate(runs);
|
||
return runs;
|
||
});
|
||
}
|
||
|
||
function bindLiveUpdates(){
|
||
if(liveBound || !canUseLiveServer || typeof window.EventSource === 'undefined') return;
|
||
liveBound = true;
|
||
const source = new EventSource(liveEventsUrl);
|
||
source.addEventListener('list-update', ()=>{
|
||
refreshItems().catch(err=>console.error(err));
|
||
});
|
||
source.addEventListener('runs-update', ()=>{
|
||
refreshRuns().catch(err=>console.error(err));
|
||
});
|
||
source.onerror = function(){
|
||
source.close();
|
||
liveBound = false;
|
||
window.setTimeout(bindLiveUpdates, 3000);
|
||
};
|
||
}
|
||
|
||
function loadLevelMeta(){
|
||
if(cachedLevelMeta) return Promise.resolve(cachedLevelMeta);
|
||
return fetch('level-ids.txt').then(r=>r.text()).then(txt=>{
|
||
cachedLevelMeta = parseLevelMeta(txt);
|
||
return cachedLevelMeta;
|
||
}).catch(()=>{
|
||
cachedLevelMeta = {};
|
||
return cachedLevelMeta;
|
||
});
|
||
}
|
||
|
||
function fetchLevelIdFromApi(title){
|
||
const url = `https://gdbrowser.com/api/search/${encodeURIComponent(title)}?diff=-2&demonFilter=5&count=10`;
|
||
return fetch(url).then(r=>r.json()).then(results=>{
|
||
if(!Array.isArray(results) || !results.length) return null;
|
||
const exact = results.find(item=>String(item.name||'').toLowerCase() === String(title||'').toLowerCase());
|
||
const match = exact || results[0];
|
||
if(!match || !match.id) return null;
|
||
return String(match.id);
|
||
}).catch(()=>null);
|
||
}
|
||
|
||
function renderApprovedRunsForLevel(item, hostEl){
|
||
if(!hostEl) return;
|
||
hostEl.innerHTML = '<p class="muted">Loading approved runs...</p>';
|
||
loadRuns().then(runs=>{
|
||
const approvedRuns = runs.filter(run=>{
|
||
return String(run.status || '').toLowerCase() === 'approved'
|
||
&& String(run.levelTitle || '').toLowerCase() === String(item.title || '').toLowerCase();
|
||
});
|
||
if(!approvedRuns.length){
|
||
hostEl.innerHTML = '<p class="muted">No approved runs have been linked to this level yet.</p>';
|
||
return;
|
||
}
|
||
hostEl.innerHTML = approvedRuns.map(run=>`
|
||
<article class="modal-run-card">
|
||
<strong>${escapeHtml(run.playerName || 'Unknown player')}</strong>
|
||
<span>${escapeHtml(run.percent || '100')}%</span>
|
||
<a class="text-link" href="${escapeAttr(run.videoUrl || '#')}" target="_blank" rel="noopener noreferrer">Open run video</a>
|
||
</article>
|
||
`).join('');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
hostEl.innerHTML = '<p class="muted">Could not load approved runs for this level.</p>';
|
||
});
|
||
}
|
||
|
||
function extractYouTubeID(url){
|
||
const m = String(url || '').match(/(?:v=|\/embed\/|youtu\.be\/)([A-Za-z0-9_-]{6,})/);
|
||
return m ? m[1] : '';
|
||
}
|
||
|
||
function updateAccountProgressInModal(modal, item){
|
||
if (!modal) {
|
||
return;
|
||
}
|
||
const inner = modal.querySelector('.inner');
|
||
if (!inner) {
|
||
return;
|
||
}
|
||
let accBar = modal.querySelector('.modal-account-progress');
|
||
if (!accBar) {
|
||
accBar = document.createElement('div');
|
||
accBar.className = 'modal-account-progress';
|
||
const runsWrap = inner.querySelector('.modal-runs-wrap');
|
||
if (runsWrap) {
|
||
inner.insertBefore(accBar, runsWrap);
|
||
} else {
|
||
inner.appendChild(accBar);
|
||
}
|
||
}
|
||
const accId = fedlDataUserId();
|
||
if (!accId || !item || !item.title) {
|
||
accBar.hidden = true;
|
||
accBar.innerHTML = '';
|
||
return;
|
||
}
|
||
accBar.hidden = false;
|
||
const cur = fedlGetLevelPercent(accId, item.title);
|
||
const labelText = fedlServerUserId
|
||
? 'Your progress (synced to your account)'
|
||
: 'Your progress (saved on this device)';
|
||
accBar.innerHTML =
|
||
'<p class="modal-account-label">' +
|
||
labelText +
|
||
'</p>' +
|
||
'<div class="modal-account-row">' +
|
||
'<input type="text" class="modal-account-pct-input" inputmode="decimal" placeholder="e.g. 47" />' +
|
||
'<span class="muted">%</span>' +
|
||
'</div>';
|
||
const input = accBar.querySelector('.modal-account-pct-input');
|
||
if (input) {
|
||
input.value = cur;
|
||
input.addEventListener('change', ()=>{
|
||
fedlSetLevelPercent(accId, item.title, input.value);
|
||
});
|
||
}
|
||
}
|
||
|
||
function calculatePoints(rank){
|
||
if(!rank || rank < 1) return 0;
|
||
if(rank <= 200) return 10000 - (rank - 1) * 50;
|
||
return 50;
|
||
}
|
||
|
||
function openVideoModal(item, options){
|
||
const config = Object.assign({showRuns:false}, options || {});
|
||
const url = item && item.url;
|
||
if(!url) return;
|
||
const id = extractYouTubeID(url);
|
||
if(!id){
|
||
window.open(url,'_blank');
|
||
return;
|
||
}
|
||
const rank = Number(item.position) || 0;
|
||
const points = calculatePoints(rank);
|
||
let modal = document.querySelector('.video-modal');
|
||
if(!modal){
|
||
modal = document.createElement('div'); modal.className='video-modal';
|
||
const inner = document.createElement('div'); inner.className='inner';
|
||
const close = document.createElement('button'); close.textContent='Close'; close.className='btn'; close.style.float='right'; close.onclick=()=>modal.remove();
|
||
inner.appendChild(close);
|
||
const iframe = document.createElement('iframe'); iframe.allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture'; iframe.allowFullscreen=true;
|
||
inner.appendChild(iframe); modal.appendChild(inner); document.body.appendChild(modal);
|
||
const runsWrap = document.createElement('div'); runsWrap.className = 'modal-runs-wrap';
|
||
runsWrap.innerHTML = `
|
||
<div class="modal-runs-head">
|
||
<strong>Approved runs</strong>
|
||
<span class="muted">Player, percent, and linked video</span>
|
||
</div>
|
||
<div class="modal-runs-list"></div>
|
||
`;
|
||
inner.appendChild(runsWrap);
|
||
}
|
||
modal.querySelector('iframe').src = `https://www.youtube.com/embed/${id}`;
|
||
let pointsEl = modal.querySelector('.modal-points');
|
||
if(!pointsEl){
|
||
pointsEl = document.createElement('div'); pointsEl.className='modal-points';
|
||
pointsEl.style.cssText = 'font-size:1.5em;font-weight:bold;margin-bottom:10px;color:var(--accent-color,#00aaff);';
|
||
const inner = modal.querySelector('.inner');
|
||
inner.insertBefore(pointsEl, inner.querySelector('iframe'));
|
||
}
|
||
pointsEl.textContent = rank > 0 ? `Rank #${rank} — ${points} points` : '';
|
||
const runsWrap = modal.querySelector('.modal-runs-wrap');
|
||
const runsList = modal.querySelector('.modal-runs-list');
|
||
if(runsWrap) runsWrap.hidden = !config.showRuns;
|
||
if(config.showRuns && runsList){
|
||
renderApprovedRunsForLevel(item, runsList);
|
||
}
|
||
updateAccountProgressInModal(modal, item);
|
||
modal.style.display = 'flex';
|
||
}
|
||
|
||
function bindHomeSnapshot(includeRuns){
|
||
const totalEl = qs('hero-total-levels');
|
||
const topEl = qs('hero-top-entry');
|
||
const approvedRunsEl = qs('hero-last-slot');
|
||
const playersEl = qs('hero-total-players');
|
||
const recentRunsEl = qs('hero-recent-runs');
|
||
const lastUpdatedEl = qs('hero-list-updated');
|
||
const featuredListEl = qs('featured-list');
|
||
const listPreviewEl = qs('offline-list-area');
|
||
|
||
function renderFeatured(items){
|
||
if(!featuredListEl) return;
|
||
const rankedItems = items.slice().sort((a,b)=>(Number(a.position)||0)-(Number(b.position)||0));
|
||
const featured = rankedItems.slice(0, 10);
|
||
if(!featured.length){
|
||
featuredListEl.innerHTML = `
|
||
<article class="featured-card">
|
||
<span class="featured-rank">#--</span>
|
||
<strong>No list data found</strong>
|
||
<p>The homepage preview could not load any FEDL entries yet.</p>
|
||
</article>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
featuredListEl.innerHTML = featured.map(item=>`
|
||
<article class="featured-card">
|
||
<span class="featured-rank">#${escapeHtml(item.position || '--')}</span>
|
||
<strong>${escapeHtml(item.title || 'Untitled')}</strong>
|
||
<p>${item.url ? 'Video link is ready from the list page.' : 'This entry does not have a linked video yet.'}</p>
|
||
</article>
|
||
`).join('');
|
||
document.querySelectorAll('.skeleton-card').forEach(el => el.remove());
|
||
}
|
||
|
||
function renderHome(items){
|
||
const rankedItems = items.slice().sort((a,b)=>(Number(a.position)||0)-(Number(b.position)||0));
|
||
const firstItem = rankedItems[0];
|
||
|
||
if(totalEl) totalEl.textContent = String(rankedItems.length || 0);
|
||
if(topEl) topEl.textContent = firstItem ? firstItem.title : 'Unavailable';
|
||
renderFeatured(rankedItems);
|
||
if(listPreviewEl){
|
||
const preview = rankedItems.slice(0, 10);
|
||
listPreviewEl.innerHTML = preview.length ? preview.map(item=>`
|
||
<tr>
|
||
<td>#${escapeHtml(item.position || '--')}</td>
|
||
<td>${escapeHtml(item.title || 'Untitled')}</td>
|
||
</tr>
|
||
`).join('') : '<tr><td colspan="2" class="muted">No local list data found.</td></tr>';
|
||
}
|
||
}
|
||
|
||
function renderHomeStats(runs, items){
|
||
const lookup = new Map((items || []).map(item => [String(item.title || '').toLowerCase(), Number(item.position) || 9999]));
|
||
const map = new Map();
|
||
runs.forEach(run=>{
|
||
if(String(run.status || '').toLowerCase() !== 'approved') return;
|
||
const playerName = String(run.playerName || '').trim();
|
||
if(!playerName) return;
|
||
const key = playerName.toLowerCase();
|
||
let entry = map.get(key);
|
||
if(!entry){
|
||
entry = {name: playerName, runs: 0, bestRank: 9999, points: 0};
|
||
map.set(key, entry);
|
||
}
|
||
entry.runs += 1;
|
||
const rank = lookup.get(String(run.levelTitle || '').toLowerCase()) || 9999;
|
||
if(rank > 0 && rank < entry.bestRank) entry.bestRank = rank;
|
||
if(rank > 0 && rank < 1000) entry.points += calculatePoints(rank);
|
||
});
|
||
const sortedPlayers = Array.from(map.values()).sort((a,b)=>{
|
||
if(b.points !== a.points) return b.points - a.points;
|
||
const aRank = a.bestRank === 9999 ? 9999 : a.bestRank;
|
||
const bRank = b.bestRank === 9999 ? 9999 : b.bestRank;
|
||
if(aRank !== bRank) return aRank - bRank;
|
||
return a.name.localeCompare(b.name);
|
||
});
|
||
const topPlayer = sortedPlayers[0]?.name || 'None';
|
||
if(playersEl) playersEl.textContent = topPlayer;
|
||
const oneWeekAgo = Date.now() - 7 * 24 * 60 * 60 * 1000;
|
||
const recentRuns = runs.filter(run=>{
|
||
if(String(run.status || '').toLowerCase() !== 'approved') return false;
|
||
const submitted = run.submittedAt ? new Date(run.submittedAt).getTime() : 0;
|
||
return submitted >= oneWeekAgo;
|
||
}).length;
|
||
if(recentRunsEl) recentRunsEl.textContent = String(recentRuns);
|
||
const sortedRuns = runs.slice().sort((a,b)=>new Date(b.submittedAt||0) - new Date(a.submittedAt||0));
|
||
const latestRun = sortedRuns.find(run=>run.submittedAt);
|
||
if(lastUpdatedEl) lastUpdatedEl.textContent = latestRun
|
||
? new Date(latestRun.submittedAt).toLocaleDateString('en-US', { month: 'short', day: 'numeric' })
|
||
: 'N/A';
|
||
}
|
||
|
||
function renderApprovedRuns(runs){
|
||
if(!approvedRunsEl) return;
|
||
const approvedCount = runs.filter(run=>String(run.status || '').toLowerCase() === 'approved').length;
|
||
approvedRunsEl.textContent = String(approvedCount);
|
||
}
|
||
|
||
loadItems().then(items=>{
|
||
renderHome(items);
|
||
if(includeRuns){
|
||
loadRuns().then(runs=>{
|
||
renderApprovedRuns(runs);
|
||
renderHomeStats(runs, items);
|
||
}).catch(()=>{
|
||
renderApprovedRuns([]);
|
||
renderHomeStats([], items);
|
||
});
|
||
onRunsUpdate(runs=>{
|
||
renderApprovedRuns(runs);
|
||
renderHomeStats(runs, items);
|
||
});
|
||
}
|
||
}).catch(()=>{
|
||
renderHome([]);
|
||
});
|
||
onLiveUpdate(renderHome);
|
||
}
|
||
|
||
if(page==='index'){
|
||
bindHomeSnapshot(true);
|
||
bindLiveUpdates();
|
||
}
|
||
|
||
// One page app handler
|
||
if(page===SPA_PAGE_KEY){
|
||
const spaPage = window.location.hash.slice(1) || 'home';
|
||
if(spaPage === 'lists' || spaPage === 'home'){
|
||
bindHomeSnapshot(true);
|
||
bindLiveUpdates();
|
||
const listBody = qs('list-body');
|
||
if(listBody){
|
||
const listPage = initListPage();
|
||
onLiveUpdate(function(updatedItems){
|
||
listPage.applyItems(updatedItems);
|
||
});
|
||
}
|
||
}
|
||
if(spaPage === 'players'){
|
||
const playersBody = qs('players-body');
|
||
const playerSearch = qs('player-search');
|
||
if(playersBody && playerSearch){
|
||
let players = [];
|
||
Promise.all([loadRuns(), loadItems()]).then(([runs, items])=>{
|
||
const lookup = new Map(items.map(item => [String(item.title || '').toLowerCase(), Number(item.position) || 9999]));
|
||
const map = new Map();
|
||
runs.filter(run => String(run.status || '').toLowerCase() === 'approved').forEach(run => {
|
||
const playerName = String(run.playerName || '').trim();
|
||
if(!playerName) return;
|
||
const key = playerName.toLowerCase();
|
||
let entry = map.get(key);
|
||
if(!entry){
|
||
entry = {name: playerName, runs: 0, bestRank: 9999, points: 0, topLevels: new Set()};
|
||
map.set(key, entry);
|
||
}
|
||
entry.runs += 1;
|
||
const rank = lookup.get(String(run.levelTitle || '').toLowerCase()) || 9999;
|
||
if(rank > 0 && rank < entry.bestRank) entry.bestRank = rank;
|
||
if(rank > 0 && rank < 1000) entry.points += calculatePoints(rank);
|
||
if(run.levelTitle) entry.topLevels.add(String(run.levelTitle).trim());
|
||
});
|
||
players = Array.from(map.values()).map(entry => ({
|
||
name: entry.name,
|
||
runs: entry.runs,
|
||
bestRank: entry.bestRank === 9999 ? '—' : `#${entry.bestRank}`,
|
||
points: entry.points,
|
||
topLevels: Array.from(entry.topLevels).slice(0, 3).join(', ')
|
||
})).sort((a,b) => b.points - a.points || a.name.localeCompare(b.name));
|
||
function render(){
|
||
const query = (playerSearch.value || '').toLowerCase();
|
||
const filtered = players.filter(p => !query || p.name.toLowerCase().includes(query));
|
||
if(!filtered.length){
|
||
playersBody.innerHTML = '<tr><td colspan="5" class="muted">No player data found.</td></tr>';
|
||
return;
|
||
}
|
||
playersBody.innerHTML = filtered.slice(0, 100).map(p => `
|
||
<tr>
|
||
<td><strong>${escapeHtml(p.name)}</strong></td>
|
||
<td>${p.runs}</td>
|
||
<td>${p.bestRank}</td>
|
||
<td>${p.points}</td>
|
||
<td>${escapeHtml(p.topLevels)}</td>
|
||
</tr>
|
||
`).join('');
|
||
}
|
||
playerSearch.addEventListener('input', render);
|
||
render();
|
||
});
|
||
}
|
||
}
|
||
if(spaPage === 'run'){
|
||
const runForm = qs('run-form');
|
||
if(runForm){
|
||
const playerNameInput = qs('run-player-name');
|
||
const formStatusEl = qs('run-form-status');
|
||
runForm.addEventListener('submit', function(e){
|
||
e.preventDefault();
|
||
const playerName = playerNameInput.value.trim();
|
||
const levelTitle = qs('run-level-title').value.trim();
|
||
const videoUrl = qs('run-video-url').value.trim();
|
||
const percent = qs('run-percent').value.trim();
|
||
const rawUrl = qs('run-raw-url').value.trim();
|
||
const notes = qs('run-notes').value.trim();
|
||
if(!playerName || !levelTitle || !videoUrl || !percent){
|
||
formStatusEl.textContent = 'Please fill in all required fields.';
|
||
return;
|
||
}
|
||
formStatusEl.textContent = 'Submitting...';
|
||
fetch(liveRunsUrl, {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ playerName, levelTitle, videoUrl, percent, rawFootageUrl: rawUrl, notes })
|
||
}).then(r => {
|
||
if(!r.ok) throw new Error('Failed');
|
||
formStatusEl.textContent = 'Run submitted successfully!';
|
||
runForm.reset();
|
||
}).catch(() => {
|
||
formStatusEl.textContent = 'Failed to submit run.';
|
||
});
|
||
});
|
||
}
|
||
}
|
||
if(spaPage === 'roulette'){
|
||
const spinBtn = qs('roulette-spin');
|
||
const resultEl = qs('roulette-result');
|
||
if(spinBtn && resultEl){
|
||
spinBtn.addEventListener('click', function(){
|
||
loadItems().then(items => {
|
||
if(!items.length){
|
||
resultEl.innerHTML = '<p class="muted">No levels loaded.</p>';
|
||
return;
|
||
}
|
||
const random = items[Math.floor(Math.random() * items.length)];
|
||
resultEl.innerHTML = `
|
||
<p><strong>${escapeHtml(random.title || 'Untitled')}</strong></p>
|
||
<p class="muted">Rank #${random.position || '?'}</p>
|
||
<p class="muted">${random.level || ''}</p>
|
||
`;
|
||
});
|
||
});
|
||
}
|
||
}
|
||
if(spaPage === 'guess'){
|
||
const higherBtn = qs('guess-higher');
|
||
const lowerBtn = qs('guess-lower');
|
||
const levelEl = qs('guess-level');
|
||
const resultEl = qs('guess-result');
|
||
const scoreEl = qs('guess-score');
|
||
if(higherBtn && lowerBtn && levelEl){
|
||
let currentLevel = null;
|
||
let score = 0;
|
||
let revealed = false;
|
||
function newRound(){
|
||
loadItems().then(items => {
|
||
if(!items.length) return;
|
||
currentLevel = items[Math.floor(Math.random() * items.length)];
|
||
levelEl.textContent = currentLevel.title || '???';
|
||
resultEl.textContent = '';
|
||
revealed = false;
|
||
});
|
||
}
|
||
higherBtn.addEventListener('click', function(){
|
||
if(revealed || !currentLevel) return;
|
||
revealed = true;
|
||
const rank = Number(currentLevel.position) || 9999;
|
||
const actual = Math.random() * 100;
|
||
if(actual > 50){
|
||
score++;
|
||
resultEl.textContent = `Correct! It was #${rank}`;
|
||
}else{
|
||
resultEl.textContent = `Wrong! It was #${rank}`;
|
||
}
|
||
scoreEl.textContent = `Score: ${score}`;
|
||
setTimeout(newRound, 2000);
|
||
});
|
||
lowerBtn.addEventListener('click', function(){
|
||
if(revealed || !currentLevel) return;
|
||
revealed = true;
|
||
const rank = Number(currentLevel.position) || 9999;
|
||
const actual = Math.random() * 100;
|
||
if(actual < 50){
|
||
score++;
|
||
resultEl.textContent = `Correct! It was #${rank}`;
|
||
}else{
|
||
resultEl.textContent = `Wrong! It was #${rank}`;
|
||
}
|
||
scoreEl.textContent = `Score: ${score}`;
|
||
setTimeout(newRound, 2000);
|
||
});
|
||
newRound();
|
||
}
|
||
}
|
||
}
|
||
|
||
if(page==='offlineindex'){
|
||
bindHomeSnapshot(false);
|
||
}
|
||
|
||
if(page==='roulette'){
|
||
const spinBtn = qs('roulette-spin');
|
||
const statusEl = qs('roulette-status');
|
||
const titleEl = qs('roulette-title');
|
||
const rankEl = qs('roulette-rank');
|
||
const idEl = qs('roulette-level-id');
|
||
const noteEl = qs('roulette-note');
|
||
const openEl = qs('roulette-open');
|
||
const pctInput = qs('roulette-percent');
|
||
const pctRow = qs('roulette-progress-row');
|
||
const accountSelect = qs('roulette-account-select');
|
||
const accountNewInput = qs('roulette-account-new');
|
||
const accountCreateBtn = qs('roulette-account-create');
|
||
const restoreBtn = qs('roulette-restore');
|
||
const pctHint = qs('roulette-percent-hint');
|
||
const loginSyncHint = qs('roulette-login-sync-hint');
|
||
const slotsHintEl = qs('roulette-slots-hint');
|
||
const pctSubmitBtn = qs('roulette-percent-submit');
|
||
|
||
let lastRoulette = { item: null, meta: null };
|
||
|
||
function setPercentHint(text, kind){
|
||
if(!pctHint) return;
|
||
pctHint.textContent = text || '';
|
||
pctHint.className =
|
||
'small roulette-percent-hint ' +
|
||
(kind === 'error' ? 'error-text' : kind === 'success' ? 'success-text' : 'muted');
|
||
}
|
||
|
||
function resetPercentHint(){
|
||
const h = fedlNextPercentHint('');
|
||
setPercentHint(h.text, h.kind);
|
||
}
|
||
|
||
function refreshRouletteSlotsUi(){
|
||
const aid = fedlDataUserId();
|
||
['1', '2', '3'].forEach(k=>{
|
||
const saveB = qs(`roulette-slot-save-${k}`);
|
||
const loadB = qs(`roulette-slot-load-${k}`);
|
||
const lab = qs(`roulette-slot-label-${k}`);
|
||
if(saveB) saveB.disabled = !aid;
|
||
if(loadB) loadB.disabled = !aid;
|
||
if(lab){
|
||
if(!aid){
|
||
lab.textContent = '—';
|
||
}else{
|
||
const slot = fedlGetAccountPayload(aid).rouletteSlots[k];
|
||
if(slot && slot.title){
|
||
const pct = slot.percent ? ` @ ${slot.percent}%` : '';
|
||
const t = String(slot.title);
|
||
const short = t.length > 36 ? `${t.slice(0, 34)}…` : t;
|
||
lab.textContent = short + pct;
|
||
}else{
|
||
lab.textContent = 'Empty';
|
||
}
|
||
}
|
||
}
|
||
});
|
||
if(slotsHintEl){
|
||
if(!aid){
|
||
slotsHintEl.textContent = 'Create a profile below or log in to use save slots.';
|
||
}else{
|
||
slotsHintEl.textContent = 'Save the demon on screen into a slot, or load a slot to swap demons.';
|
||
}
|
||
}
|
||
}
|
||
|
||
function syncPercentRow(){
|
||
if(!pctRow) return;
|
||
const aid = fedlDataUserId();
|
||
if(!aid || !lastRoulette.item){
|
||
pctRow.hidden = true;
|
||
if(pctInput) pctInput.value = '';
|
||
if(pctHint) pctHint.textContent = '';
|
||
return;
|
||
}
|
||
pctRow.hidden = false;
|
||
if(pctInput){
|
||
pctInput.value = fedlGetLevelPercent(aid, lastRoulette.item.title) || '';
|
||
}
|
||
resetPercentHint();
|
||
}
|
||
|
||
function refreshRouletteAccountUi(){
|
||
const panel = document.querySelector('.roulette-account-panel');
|
||
const serverMode = !!fedlServerUsername;
|
||
if(loginSyncHint){
|
||
loginSyncHint.hidden = !!fedlServerUserId;
|
||
}
|
||
if(panel){
|
||
const controls = panel.querySelector('.roulette-account-controls');
|
||
const createRow = panel.querySelector('.roulette-account-create-row');
|
||
const selLabel = panel.querySelector('.roulette-account-label');
|
||
let note = panel.querySelector('.fedl-server-account-note');
|
||
if(serverMode){
|
||
if(controls) controls.style.display = 'none';
|
||
if(createRow) createRow.style.display = 'none';
|
||
if(selLabel) selLabel.style.display = 'none';
|
||
if(!note){
|
||
note = document.createElement('p');
|
||
note.className = 'muted fedl-server-account-note';
|
||
const heading = panel.querySelector('.roulette-account-heading');
|
||
if(heading){
|
||
heading.insertAdjacentElement('afterend', note);
|
||
}else{
|
||
panel.appendChild(note);
|
||
}
|
||
}
|
||
note.textContent = `Signed in as ${fedlServerUsername}. Progress syncs online and this browser keeps a copy.`;
|
||
note.style.display = '';
|
||
}else{
|
||
if(controls) controls.style.display = '';
|
||
if(createRow) createRow.style.display = '';
|
||
if(selLabel) selLabel.style.display = '';
|
||
if(note) note.style.display = 'none';
|
||
}
|
||
}
|
||
if(!accountSelect || serverMode){
|
||
if(restoreBtn){
|
||
const id = fedlDataUserId();
|
||
const pick = id ? fedlGetAccountPayload(id).roulettePick : null;
|
||
restoreBtn.hidden = !pick || !pick.title;
|
||
}
|
||
refreshRouletteSlotsUi();
|
||
syncPercentRow();
|
||
return;
|
||
}
|
||
const accounts = fedlListAccounts();
|
||
const active = fedlAccountId();
|
||
accountSelect.innerHTML = '<option value="">No profile (progress not saved)</option>';
|
||
accounts.forEach(a=>{
|
||
const opt = document.createElement('option');
|
||
opt.value = a.id;
|
||
opt.textContent = a.name;
|
||
if(a.id === active) opt.selected = true;
|
||
accountSelect.appendChild(opt);
|
||
});
|
||
if(restoreBtn){
|
||
const pick = active ? fedlGetAccountPayload(active).roulettePick : null;
|
||
restoreBtn.hidden = !pick || !pick.title;
|
||
}
|
||
refreshRouletteSlotsUi();
|
||
syncPercentRow();
|
||
}
|
||
|
||
function showPick(item, meta){
|
||
lastRoulette = { item, meta };
|
||
statusEl.textContent = 'Your demon is:';
|
||
titleEl.textContent = item.title;
|
||
rankEl.textContent = `Rank: #${item.position}`;
|
||
idEl.textContent = `Level ID: ${meta.levelId || 'unknown'}`;
|
||
noteEl.textContent = meta.source === 'api'
|
||
? 'Level ID was looked up from the Geometry Dash community API.'
|
||
: 'Level ID came from your local level-ids.txt file.';
|
||
if(item.url){
|
||
openEl.hidden = false;
|
||
openEl.href = '#';
|
||
openEl.onclick = function(e){
|
||
e.preventDefault();
|
||
openVideoModal(item, {showRuns:false});
|
||
};
|
||
}else{
|
||
openEl.hidden = true;
|
||
openEl.onclick = null;
|
||
}
|
||
const aid = fedlDataUserId();
|
||
if(aid){
|
||
const pct = fedlGetLevelPercent(aid, item.title) || '';
|
||
fedlSaveRoulettePick(aid, {
|
||
title: item.title,
|
||
position: item.position,
|
||
level: item.level,
|
||
url: item.url,
|
||
levelId: meta.levelId,
|
||
noteSource: meta.source,
|
||
percent: pct
|
||
});
|
||
refreshRouletteAccountUi();
|
||
}
|
||
syncPercentRow();
|
||
}
|
||
|
||
function saveRouletteSlot(slotKey){
|
||
const aid = fedlDataUserId();
|
||
if(!aid || !lastRoulette.item){
|
||
if(slotsHintEl) slotsHintEl.textContent = 'Spin a demon first, and use a profile or log in.';
|
||
return;
|
||
}
|
||
const p = fedlGetAccountPayload(aid);
|
||
const pct = pctInput ? String(pctInput.value || '').trim() : '';
|
||
p.rouletteSlots[slotKey] = {
|
||
title: lastRoulette.item.title,
|
||
position: lastRoulette.item.position,
|
||
level: lastRoulette.item.level,
|
||
url: lastRoulette.item.url,
|
||
levelId: lastRoulette.meta && lastRoulette.meta.levelId,
|
||
noteSource: lastRoulette.meta && lastRoulette.meta.source,
|
||
percent: pct,
|
||
savedAt: new Date().toISOString()
|
||
};
|
||
fedlSaveAccountPayload(aid, p);
|
||
if(pct){
|
||
fedlSetLevelPercent(aid, lastRoulette.item.title, pct);
|
||
}
|
||
refreshRouletteSlotsUi();
|
||
}
|
||
|
||
function loadRouletteSlot(slotKey){
|
||
const aid = fedlDataUserId();
|
||
if(!aid) return;
|
||
const slot = fedlGetAccountPayload(aid).rouletteSlots[slotKey];
|
||
if(!slot || !slot.title){
|
||
if(slotsHintEl) slotsHintEl.textContent = 'That slot is empty.';
|
||
return;
|
||
}
|
||
const pctStr = String(slot.percent != null ? slot.percent : '').trim();
|
||
if(pctStr){
|
||
fedlSetLevelPercent(aid, slot.title, pctStr);
|
||
}
|
||
const item = {
|
||
title: slot.title,
|
||
position: slot.position,
|
||
level: slot.level,
|
||
url: slot.url
|
||
};
|
||
const meta = {
|
||
levelId: slot.levelId,
|
||
source: slot.noteSource === 'api' ? 'api' : 'file'
|
||
};
|
||
showPick(item, meta);
|
||
if(pctInput){
|
||
pctInput.value = pctStr || fedlGetLevelPercent(aid, slot.title) || '';
|
||
}
|
||
resetPercentHint();
|
||
refreshRouletteSlotsUi();
|
||
}
|
||
|
||
if(pctInput){
|
||
pctInput.addEventListener('change', ()=>{
|
||
const aid = fedlDataUserId();
|
||
if(!aid || !lastRoulette.item) return;
|
||
fedlSetLevelPercent(aid, lastRoulette.item.title, pctInput.value);
|
||
});
|
||
}
|
||
if(pctSubmitBtn){
|
||
pctSubmitBtn.addEventListener('click', ()=>{
|
||
const aid = fedlDataUserId();
|
||
if(!aid || !lastRoulette.item){
|
||
setPercentHint('Spin a demon and use a profile or log in to track %.', 'error');
|
||
return;
|
||
}
|
||
fedlSetLevelPercent(aid, lastRoulette.item.title, pctInput ? pctInput.value : '');
|
||
const h = fedlNextPercentHint(pctInput ? pctInput.value : '');
|
||
setPercentHint(h.text, h.kind);
|
||
});
|
||
}
|
||
['1', '2', '3'].forEach(k=>{
|
||
const sb = qs(`roulette-slot-save-${k}`);
|
||
const lb = qs(`roulette-slot-load-${k}`);
|
||
if(sb) sb.addEventListener('click', ()=> saveRouletteSlot(k));
|
||
if(lb) lb.addEventListener('click', ()=> loadRouletteSlot(k));
|
||
});
|
||
if(accountSelect){
|
||
accountSelect.addEventListener('change', ()=>{
|
||
fedlSetActiveAccountId(accountSelect.value || '');
|
||
refreshRouletteAccountUi();
|
||
});
|
||
}
|
||
if(accountCreateBtn && accountNewInput){
|
||
accountCreateBtn.addEventListener('click', ()=>{
|
||
const name = String(accountNewInput.value || '').trim();
|
||
if(!name) return;
|
||
fedlCreateAccount(name);
|
||
accountNewInput.value = '';
|
||
refreshRouletteAccountUi();
|
||
});
|
||
}
|
||
if(restoreBtn){
|
||
restoreBtn.addEventListener('click', ()=>{
|
||
const aid = fedlDataUserId();
|
||
if(!aid) return;
|
||
const pick = fedlGetAccountPayload(aid).roulettePick;
|
||
if(!pick || !pick.title) return;
|
||
const item = {
|
||
title: pick.title,
|
||
position: pick.position,
|
||
level: pick.level,
|
||
url: pick.url
|
||
};
|
||
const meta = {
|
||
levelId: pick.levelId,
|
||
source: pick.noteSource === 'api' ? 'api' : 'file'
|
||
};
|
||
showPick(item, meta);
|
||
});
|
||
}
|
||
|
||
document.addEventListener('fedl-auth-updated', ()=>{
|
||
refreshRouletteAccountUi();
|
||
});
|
||
fedlRefreshAuthState()
|
||
.then(()=> fedlPullUserStateToLocal(fedlServerUserId))
|
||
.finally(()=>{
|
||
refreshRouletteAccountUi();
|
||
fedlUpdateAuthNav();
|
||
});
|
||
|
||
spinBtn.addEventListener('click', ()=>{
|
||
statusEl.textContent = 'Spinning...';
|
||
titleEl.textContent = 'Choosing a demon';
|
||
rankEl.textContent = 'Rank: -';
|
||
idEl.textContent = 'Level ID: -';
|
||
noteEl.textContent = 'Checking your local file and API if needed.';
|
||
openEl.hidden = true;
|
||
if(pctRow) pctRow.hidden = true;
|
||
if(pctHint) pctHint.textContent = '';
|
||
Promise.all([loadItems(), loadLevelMeta()]).then(([items, metaMap])=>{
|
||
if(!items.length){
|
||
statusEl.textContent = 'No demons found.';
|
||
titleEl.textContent = 'Add demons to the list';
|
||
idEl.textContent = 'Level ID: -';
|
||
noteEl.textContent = 'No list data was found.';
|
||
return;
|
||
}
|
||
const item = items[Math.floor(Math.random()*items.length)];
|
||
const localMeta = metaMap[item.title] || {levelId:'unknown', percent:'100'};
|
||
if(localMeta.levelId && localMeta.levelId !== 'unknown'){
|
||
window.setTimeout(()=>showPick(item, {levelId: localMeta.levelId, percent: localMeta.percent, source: 'file'}), 350);
|
||
return;
|
||
}
|
||
fetchLevelIdFromApi(item.title).then(levelId=>{
|
||
const meta = {
|
||
levelId: levelId || 'unknown',
|
||
percent: localMeta.percent || '100',
|
||
source: levelId ? 'api' : 'file'
|
||
};
|
||
window.setTimeout(()=>showPick(item, meta), 350);
|
||
});
|
||
}).catch(err=>{
|
||
statusEl.textContent = 'Could not load the list.';
|
||
titleEl.textContent = 'Open the full site';
|
||
rankEl.textContent = 'Rank: -';
|
||
idEl.textContent = 'Level ID: -';
|
||
noteEl.textContent = 'The list or lookup failed.';
|
||
console.error(err);
|
||
});
|
||
});
|
||
}
|
||
|
||
if(page==='guess'){
|
||
const modeSelect = qs('guess-mode');
|
||
const startBtn = qs('guess-start');
|
||
const form = qs('guess-form');
|
||
const input = qs('guess-input');
|
||
const statusEl = qs('guess-status');
|
||
const titleEl = qs('guess-level-title');
|
||
const attemptsEl = qs('guess-attempts');
|
||
const feedbackEl = qs('guess-feedback');
|
||
const answerEl = qs('guess-answer');
|
||
const openEl = qs('guess-open');
|
||
|
||
const guessModes = {
|
||
casual: {label:'Casual', tries:6},
|
||
standard: {label:'Standard', tries:4},
|
||
hard: {label:'Hard', tries:3},
|
||
marathon: {label:'Marathon', tries:8}
|
||
};
|
||
|
||
const state = {
|
||
active: false,
|
||
triesLeft: guessModes.standard.tries,
|
||
answer: null,
|
||
item: null
|
||
};
|
||
|
||
function getRankedItems(items){
|
||
return items.slice().filter(item=>Number(item.position) > 0).sort((a,b)=>(Number(a.position)||0)-(Number(b.position)||0));
|
||
}
|
||
|
||
function getSelectedMode(){
|
||
return guessModes[(modeSelect && modeSelect.value) || 'standard'] || guessModes.standard;
|
||
}
|
||
|
||
function resetGuessUi(message){
|
||
const mode = getSelectedMode();
|
||
state.active = false;
|
||
state.triesLeft = mode.tries;
|
||
state.answer = null;
|
||
state.item = null;
|
||
statusEl.textContent = message;
|
||
titleEl.textContent = 'No level selected';
|
||
attemptsEl.textContent = `Tries left: ${mode.tries}`;
|
||
feedbackEl.textContent = `Mode: ${mode.label}. Enter a rank number to start guessing.`;
|
||
answerEl.textContent = 'The correct rank will show here if you run out of guesses.';
|
||
openEl.hidden = true;
|
||
openEl.href = '#';
|
||
openEl.onclick = null;
|
||
input.value = '';
|
||
}
|
||
|
||
function finishRound(message, revealAnswer){
|
||
state.active = false;
|
||
statusEl.textContent = message;
|
||
attemptsEl.textContent = `Tries left: ${state.triesLeft}`;
|
||
answerEl.textContent = revealAnswer
|
||
? `${state.item.title} is ranked #${state.answer}.`
|
||
: 'Correct. Start another round whenever you want.';
|
||
if(state.item && state.item.url){
|
||
openEl.hidden = false;
|
||
openEl.href = '#';
|
||
openEl.onclick = function(e){
|
||
e.preventDefault();
|
||
openVideoModal(state.item, {showRuns:false});
|
||
};
|
||
}
|
||
}
|
||
|
||
function startRound(){
|
||
const mode = getSelectedMode();
|
||
statusEl.textContent = 'Picking a level...';
|
||
attemptsEl.textContent = `Tries left: ${mode.tries}`;
|
||
feedbackEl.textContent = `Loading a ${mode.label.toLowerCase()} round.`;
|
||
answerEl.textContent = 'You will get hints after each wrong guess.';
|
||
openEl.hidden = true;
|
||
openEl.onclick = null;
|
||
input.value = '';
|
||
loadItems().then(items=>{
|
||
const rankedItems = getRankedItems(items);
|
||
if(!rankedItems.length){
|
||
resetGuessUi('No ranked levels were found.');
|
||
feedbackEl.textContent = 'Add list data first, then start another round.';
|
||
return;
|
||
}
|
||
const item = rankedItems[Math.floor(Math.random() * rankedItems.length)];
|
||
state.active = true;
|
||
state.triesLeft = mode.tries;
|
||
state.answer = Number(item.position);
|
||
state.item = item;
|
||
statusEl.textContent = 'Guess this level\'s rank.';
|
||
titleEl.textContent = item.title;
|
||
attemptsEl.textContent = `Tries left: ${mode.tries}`;
|
||
feedbackEl.textContent = `Mode: ${mode.label}. Guess the rank and I will tell you higher or lower.`;
|
||
answerEl.textContent = 'The correct rank will show here if you run out of guesses.';
|
||
input.value = '';
|
||
input.focus();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
resetGuessUi('Could not load the list for the guessing game.');
|
||
feedbackEl.textContent = 'Try again after the list finishes loading.';
|
||
});
|
||
}
|
||
|
||
function submitGuess(){
|
||
if(!state.active || !state.item){
|
||
feedbackEl.textContent = 'Start a round first so there is a level to guess.';
|
||
return;
|
||
}
|
||
const rawGuess = input.value.trim();
|
||
const guess = Number(rawGuess);
|
||
if(!rawGuess || !Number.isInteger(guess) || guess < 1){
|
||
feedbackEl.textContent = 'Enter a valid whole-number rank.';
|
||
return;
|
||
}
|
||
if(guess === state.answer){
|
||
feedbackEl.textContent = `Correct. ${state.item.title} is #${state.answer}.`;
|
||
finishRound('You got it.', false);
|
||
return;
|
||
}
|
||
state.triesLeft -= 1;
|
||
attemptsEl.textContent = `Tries left: ${state.triesLeft}`;
|
||
const direction = guess < state.answer ? 'Higher' : 'Lower';
|
||
if(state.triesLeft > 0){
|
||
feedbackEl.textContent = `${direction}. #${guess} is not the right spot.`;
|
||
return;
|
||
}
|
||
feedbackEl.textContent = `${direction}. That was your last guess.`;
|
||
finishRound('Round over.', true);
|
||
}
|
||
|
||
resetGuessUi('Start a round to get a level.');
|
||
if(modeSelect){
|
||
modeSelect.addEventListener('change', ()=>{
|
||
if(!state.active) resetGuessUi('Start a round to get a level.');
|
||
});
|
||
}
|
||
startBtn.addEventListener('click', startRound);
|
||
form.addEventListener('submit', function(e){
|
||
e.preventDefault();
|
||
submitGuess();
|
||
});
|
||
}
|
||
|
||
// Players page
|
||
if(page==='players'){
|
||
const playersArea = qs('players-area');
|
||
const searchEl = qs('search');
|
||
const filterSelect = qs('group-filter');
|
||
const groupsEl = qs('player-groups');
|
||
if(!playersArea || !searchEl || !filterSelect || !groupsEl) return;
|
||
|
||
let players = [];
|
||
|
||
function getGroupKey(name){
|
||
const first = String(name || '').trim().charAt(0).toUpperCase();
|
||
return first.match(/[A-Z0-9]/) ? first : '#';
|
||
}
|
||
|
||
function computeGroups(items){
|
||
const set = new Set();
|
||
items.forEach(item => set.add(getGroupKey(item.name)));
|
||
return Array.from(set).sort((a,b)=> a === '#' ? 1 : b === '#' ? -1 : a.localeCompare(b));
|
||
}
|
||
|
||
function setupGroups(items){
|
||
const groups = computeGroups(items);
|
||
groupsEl.innerHTML = '';
|
||
filterSelect.innerHTML = '<option value="all">All players</option>';
|
||
groups.forEach(group => {
|
||
const li = document.createElement('li');
|
||
const btn = document.createElement('button');
|
||
btn.type = 'button';
|
||
btn.textContent = group;
|
||
btn.className = 'level-link';
|
||
btn.addEventListener('click', () => {
|
||
filterSelect.value = group;
|
||
renderTable();
|
||
groupsEl.querySelectorAll('.level-link').forEach(el=>el.classList.remove('active'));
|
||
btn.classList.add('active');
|
||
});
|
||
li.appendChild(btn);
|
||
groupsEl.appendChild(li);
|
||
|
||
const opt = document.createElement('option');
|
||
opt.value = group;
|
||
opt.textContent = group;
|
||
filterSelect.appendChild(opt);
|
||
});
|
||
}
|
||
|
||
function buildPlayers(runs, listItems){
|
||
const lookup = new Map(listItems.map(item => [String(item.title || '').toLowerCase(), Number(item.position) || 9999]));
|
||
const map = new Map();
|
||
runs.filter(run => String(run.status || '').toLowerCase() === 'approved').forEach(run => {
|
||
const playerName = String(run.playerName || '').trim();
|
||
if(!playerName) return;
|
||
const key = playerName.toLowerCase();
|
||
let entry = map.get(key);
|
||
if(!entry){
|
||
entry = {name: playerName, runs: 0, bestRank: 9999, points: 0, topLevels: new Set()};
|
||
map.set(key, entry);
|
||
}
|
||
entry.runs += 1;
|
||
const rank = lookup.get(String(run.levelTitle || '').toLowerCase()) || 9999;
|
||
if(rank > 0 && rank < entry.bestRank) entry.bestRank = rank;
|
||
if(rank > 0 && rank < 1000) entry.points += calculatePoints(rank);
|
||
if(run.levelTitle) entry.topLevels.add(String(run.levelTitle).trim());
|
||
});
|
||
return Array.from(map.values()).map(entry => ({
|
||
name: entry.name,
|
||
runs: entry.runs,
|
||
bestRank: entry.bestRank === 9999 ? '—' : `#${entry.bestRank}`,
|
||
points: entry.points,
|
||
topLevels: Array.from(entry.topLevels).slice(0, 3).join(', ')
|
||
})).sort((a,b) => {
|
||
if(b.points !== a.points) return b.points - a.points;
|
||
const aRank = typeof a.bestRank === 'string' ? Number(a.bestRank.slice(1)) || 9999 : a.bestRank;
|
||
const bRank = typeof b.bestRank === 'string' ? Number(b.bestRank.slice(1)) || 9999 : b.bestRank;
|
||
if(aRank !== bRank) return aRank - bRank;
|
||
return a.name.localeCompare(b.name);
|
||
});
|
||
}
|
||
|
||
function renderTable(){
|
||
const query = String(searchEl.value || '').toLowerCase().trim();
|
||
const filterValue = filterSelect.value || 'all';
|
||
const filtered = players.filter(item => {
|
||
if(filterValue !== 'all' && getGroupKey(item.name) !== filterValue) return false;
|
||
if(!query) return true;
|
||
return item.name.toLowerCase().includes(query);
|
||
});
|
||
|
||
playersArea.innerHTML = '';
|
||
if(!filtered.length){
|
||
playersArea.innerHTML = '<tr><td colspan="5" class="muted">No player data found.</td></tr>';
|
||
return;
|
||
}
|
||
|
||
const fragment = document.createDocumentFragment();
|
||
filtered.forEach(item => {
|
||
const tr = document.createElement('tr');
|
||
const tdName = document.createElement('td'); tdName.textContent = item.name;
|
||
const tdRuns = document.createElement('td'); tdRuns.textContent = String(item.runs);
|
||
const tdPoints = document.createElement('td'); tdPoints.textContent = String(item.points);
|
||
const tdRank = document.createElement('td'); tdRank.textContent = item.bestRank;
|
||
const tdLevels = document.createElement('td'); tdLevels.textContent = item.topLevels;
|
||
tr.appendChild(tdName);
|
||
tr.appendChild(tdRuns);
|
||
tr.appendChild(tdPoints);
|
||
tr.appendChild(tdRank);
|
||
tr.appendChild(tdLevels);
|
||
fragment.appendChild(tr);
|
||
});
|
||
playersArea.appendChild(fragment);
|
||
}
|
||
|
||
function showLoading(){
|
||
playersArea.innerHTML = '<tr><td colspan="5" class="muted">Loading player stats...</td></tr>';
|
||
}
|
||
|
||
function syncView(newPlayers){
|
||
players = newPlayers;
|
||
setupGroups(players);
|
||
renderTable();
|
||
}
|
||
|
||
function loadPlayerStats(){
|
||
showLoading();
|
||
return Promise.all([loadRuns(), loadItems()])
|
||
.then(([runs, items]) => {
|
||
const computed = buildPlayers(runs, items);
|
||
syncView(computed);
|
||
})
|
||
.catch(err => {
|
||
console.error(err);
|
||
playersArea.innerHTML = '<tr><td colspan="5" class="muted">Could not load player stats.</td></tr>';
|
||
});
|
||
}
|
||
|
||
searchEl.addEventListener('input', debounce(renderTable, 120));
|
||
filterSelect.addEventListener('change', () => {
|
||
const activeBtn = Array.from(groupsEl.querySelectorAll('.level-link')).find(btn => btn.textContent === filterSelect.value);
|
||
groupsEl.querySelectorAll('.level-link').forEach(btn => btn.classList.toggle('active', btn === activeBtn));
|
||
renderTable();
|
||
});
|
||
|
||
loadPlayerStats();
|
||
bindLiveUpdates();
|
||
onRunsUpdate(() => {
|
||
loadPlayerStats();
|
||
});
|
||
onLiveUpdate(() => {
|
||
loadPlayerStats();
|
||
});
|
||
}
|
||
|
||
function initListPage(){
|
||
const levelsEl = qs('levels'); const listArea = qs('list-area'); const titleEl = qs('list-title');
|
||
const searchEl = qs('search');
|
||
const filterSelect = qs('level-filter');
|
||
let currentItems = [];
|
||
let controlsBound = false;
|
||
// Load hard-coded data file data.txt (category|position|title|url per line)
|
||
function loadData(){
|
||
const run = ()=>{
|
||
loadItems().then(items=>{
|
||
applyItems(items);
|
||
}).catch(err=>{listArea.innerHTML='<p class="muted">Failed to load list data.</p>'; console.error(err)});
|
||
};
|
||
fedlRefreshAuthState()
|
||
.then(()=> fedlPullUserStateToLocal(fedlServerUserId))
|
||
.finally(run);
|
||
}
|
||
|
||
function computeCategories(items){
|
||
const max = items.reduce((m,it)=>Math.max(m, Number(it.position)||0), 0);
|
||
const cats = ['Full List'];
|
||
for(let i=1;i<=max;i+=10){
|
||
const start = i; const end = Math.min(i+9, max);
|
||
cats.push(`Top ${start}-${end}`);
|
||
}
|
||
return cats;
|
||
}
|
||
|
||
function setupLevels(items){
|
||
const categories = computeCategories(items);
|
||
levelsEl.innerHTML='';
|
||
filterSelect.innerHTML = '<option value="all">Full List</option>';
|
||
categories.forEach(cat=>{
|
||
const li = document.createElement('li');
|
||
const btn = document.createElement('button');
|
||
btn.type = 'button';
|
||
btn.textContent = cat;
|
||
btn.className = 'level-link';
|
||
btn.addEventListener('click', ()=> {
|
||
selectLevel(cat, items, btn);
|
||
filterSelect.value = cat;
|
||
});
|
||
li.appendChild(btn);
|
||
levelsEl.appendChild(li);
|
||
|
||
const opt = document.createElement('option'); opt.value = cat; opt.textContent = cat; filterSelect.appendChild(opt);
|
||
});
|
||
if(!controlsBound){
|
||
searchEl.addEventListener('input', debounce(()=> renderTable(currentItems), 120));
|
||
filterSelect.addEventListener('change', ()=> renderTable(currentItems));
|
||
controlsBound = true;
|
||
}
|
||
}
|
||
|
||
function selectLevel(level, items, linkEl){
|
||
levelsEl.querySelectorAll('.level-link').forEach(a=>a.classList.remove('active'));
|
||
if(linkEl) linkEl.classList.add('active');
|
||
qs('level-filter').value = level;
|
||
renderTable(items);
|
||
}
|
||
|
||
function renderTable(items){
|
||
const q = (searchEl && searchEl.value || '').toLowerCase();
|
||
const levelFilter = (filterSelect && filterSelect.value) || 'all';
|
||
const filtered = items.filter(it=>{
|
||
// apply level / category filter (support range categories like "Top 1-10")
|
||
if(levelFilter && levelFilter!=='all' && levelFilter!=='Full List'){
|
||
const m = levelFilter.match(/Top\s*(\d+)-(\d+)/i);
|
||
if(m){
|
||
const s = Number(m[1]); const e = Number(m[2]); const pos = Number(it.position)||0;
|
||
if(pos < s || pos > e) return false;
|
||
}
|
||
}
|
||
if(!q) return true;
|
||
return (it.title||'').toLowerCase().includes(q) || (it.level||'').toLowerCase().includes(q);
|
||
}).sort((a,b)=> (Number(a.position)||0)-(Number(b.position)||0));
|
||
|
||
const tbody = qs('list-area'); tbody.innerHTML='';
|
||
if(!filtered.length){
|
||
tbody.innerHTML = '<tr><td colspan="4" class="muted">No levels match this search or range.</td></tr>';
|
||
return;
|
||
}
|
||
const accId = fedlDataUserId();
|
||
const fragment = document.createDocumentFragment();
|
||
filtered.forEach(it=>{
|
||
const tr = document.createElement('tr');
|
||
const tdNum = document.createElement('td'); tdNum.textContent = it.position;
|
||
const tdTitle = document.createElement('td'); tdTitle.textContent = it.title;
|
||
const tdPct = document.createElement('td');
|
||
tdPct.className = 'list-my-progress-cell';
|
||
if(accId){
|
||
const inp = document.createElement('input');
|
||
inp.type = 'text';
|
||
inp.className = 'list-progress-input';
|
||
inp.value = fedlGetLevelPercent(accId, it.title) || '';
|
||
inp.placeholder = '%';
|
||
inp.title = 'Your progress for this level (this browser)';
|
||
inp.addEventListener('change', ()=>{
|
||
fedlSetLevelPercent(accId, it.title, inp.value);
|
||
});
|
||
tdPct.appendChild(inp);
|
||
}else{
|
||
const span = document.createElement('span');
|
||
span.className = 'muted';
|
||
span.textContent = '—';
|
||
span.title = 'Create a profile on the Roulette page to save progress';
|
||
tdPct.appendChild(span);
|
||
}
|
||
const tdAct = document.createElement('td');
|
||
const a = document.createElement('a'); a.textContent='Open'; a.href='#'; a.className='btn';
|
||
a.addEventListener('click', (e)=>{e.preventDefault(); openVideoModal(it, {showRuns:true})});
|
||
tdAct.appendChild(a);
|
||
tr.appendChild(tdNum); tr.appendChild(tdTitle); tr.appendChild(tdPct); tr.appendChild(tdAct);
|
||
fragment.appendChild(tr);
|
||
});
|
||
tbody.appendChild(fragment);
|
||
}
|
||
|
||
function applyItems(items){
|
||
const previousFilter = filterSelect.value || 'all';
|
||
currentItems = items.slice();
|
||
setupLevels(currentItems);
|
||
const availableFilters = Array.from(filterSelect.options).map(option=>option.value);
|
||
filterSelect.value = availableFilters.includes(previousFilter) ? previousFilter : 'all';
|
||
const activeText = filterSelect.value === 'all' ? 'Full List' : filterSelect.value;
|
||
levelsEl.querySelectorAll('.level-link').forEach(btn=>{
|
||
btn.classList.toggle('active', btn.textContent === activeText);
|
||
});
|
||
renderTable(currentItems);
|
||
}
|
||
|
||
loadData();
|
||
return {applyItems};
|
||
}
|
||
|
||
// Lists page
|
||
if(page==='lists'){
|
||
const listPage = initListPage();
|
||
document.addEventListener('fedl-auth-updated', ()=>{
|
||
loadItems().then(items=>listPage.applyItems(items)).catch(()=>{});
|
||
});
|
||
bindLiveUpdates();
|
||
onLiveUpdate(function(updatedItems){
|
||
listPage.applyItems(updatedItems);
|
||
});
|
||
}
|
||
|
||
if(page==='admelist'){
|
||
fedlRefreshAuthState().then(j=>{
|
||
if(!j) return;
|
||
const username = (j.username || '').toLowerCase();
|
||
if(!username || !MOD_USERS.map(m=>m.toLowerCase()).includes(username)){
|
||
window.location.href = 'index.html';
|
||
}
|
||
});
|
||
const loginScreenEl = qs('admin-login-screen');
|
||
const adminShellContentEl = qs('admin-shell-content');
|
||
const loginFormEl = qs('admin-login-form');
|
||
const adminPasswordEl = qs('admin-password');
|
||
const authStatusEl = qs('admin-auth-status');
|
||
const statusEl = qs('admin-status');
|
||
const listTbody = qs('admin-list-body');
|
||
const addBtn = qs('add-row');
|
||
const addRowBottomBtn = qs('add-row-bottom');
|
||
const saveBtn = qs('save-list');
|
||
const searchEl = qs('admin-search');
|
||
const runsStatusEl = qs('runs-admin-status');
|
||
const runsTbody = qs('run-admin-body');
|
||
const runSearchEl = qs('run-search');
|
||
const importStatusEl = qs('import-status');
|
||
const importPointercrateBtn = qs('import-pointercrate');
|
||
const importAredlBtn = qs('import-aredl');
|
||
const importTargetedOpenBtn = qs('import-targeted-open');
|
||
const importTargetedModal = qs('import-targeted-modal');
|
||
const importTargetedForm = qs('import-targeted-form');
|
||
const importTargetedSourceEl = qs('import-targeted-source');
|
||
const importTargetedQueryEl = qs('import-targeted-query');
|
||
const importTargetedQueryLabelEl = qs('import-targeted-query-label');
|
||
const importTargetedSubmitBtn = qs('import-targeted-submit');
|
||
const importTargetedCancelBtn = qs('import-targeted-cancel');
|
||
const bulkApproveOpenBtn = qs('bulk-approve-open');
|
||
const bulkApproveModal = qs('bulk-approve-modal');
|
||
const bulkApproveForm = qs('bulk-approve-form');
|
||
const bulkApprovePlayerInput = qs('bulk-approve-player');
|
||
const bulkApproveNotesInput = qs('bulk-approve-notes');
|
||
const bulkApprovePreviewEl = qs('bulk-approve-preview');
|
||
const bulkApproveCancelBtn = qs('bulk-approve-cancel');
|
||
const bulkApproveSubmitBtn = qs('bulk-approve-submit');
|
||
let items = [];
|
||
let runs = [];
|
||
const adminPasswordKey = 'fedl_admin_password';
|
||
|
||
function getAdminPassword(){
|
||
try{return sessionStorage.getItem(adminPasswordKey) || '';}
|
||
catch(e){return '';}
|
||
}
|
||
|
||
function setAdminPassword(password){
|
||
try{
|
||
if(password) sessionStorage.setItem(adminPasswordKey, password);
|
||
else sessionStorage.removeItem(adminPasswordKey);
|
||
}catch(e){}
|
||
if(adminPasswordEl) adminPasswordEl.value = password;
|
||
if(authStatusEl){
|
||
authStatusEl.textContent = password ? 'Password saved for this browser session.' : 'Saved only in this browser session.';
|
||
if(password) authStatusEl.classList.remove('error-text');
|
||
}
|
||
}
|
||
|
||
function authHeaders(extraHeaders){
|
||
const headers = Object.assign({}, extraHeaders || {});
|
||
const password = getAdminPassword();
|
||
if(password){
|
||
headers.Authorization = `Basic ${btoa(`fedl:${password}`)}`;
|
||
}
|
||
return headers;
|
||
}
|
||
|
||
function handleAdminAuthFailure(message){
|
||
setAdminPassword('');
|
||
document.body.classList.add('admin-locked');
|
||
if(adminShellContentEl) adminShellContentEl.hidden = true;
|
||
if(loginScreenEl) loginScreenEl.hidden = false;
|
||
if(authStatusEl){
|
||
authStatusEl.textContent = message || 'Admin password required or incorrect.';
|
||
authStatusEl.classList.add('error-text');
|
||
}
|
||
}
|
||
|
||
function unlockAdminShell(){
|
||
document.body.classList.remove('admin-locked');
|
||
if(loginScreenEl) loginScreenEl.hidden = true;
|
||
if(adminShellContentEl) adminShellContentEl.hidden = false;
|
||
}
|
||
|
||
function verifyAdminPassword(){
|
||
if(!getAdminPassword()){
|
||
handleAdminAuthFailure('Enter the admin password to continue.');
|
||
return Promise.resolve(false);
|
||
}
|
||
return fetch(`${liveRunsUrl}/__authcheck__`, {
|
||
method:'DELETE',
|
||
headers:authHeaders()
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(r.status !== 404 && r.status !== 204) throw new Error('Verify failed');
|
||
return true;
|
||
}).then(ok=>{
|
||
unlockAdminShell();
|
||
loadAdmin();
|
||
loadRunsAdmin();
|
||
return ok;
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
handleAdminAuthFailure('Wrong admin password. Try again.');
|
||
return false;
|
||
});
|
||
}
|
||
|
||
if(loginFormEl){
|
||
loginFormEl.addEventListener('submit', function(event){
|
||
event.preventDefault();
|
||
setAdminPassword((adminPasswordEl && adminPasswordEl.value || '').trim());
|
||
if(authStatusEl){
|
||
authStatusEl.textContent = 'Checking password...';
|
||
authStatusEl.classList.remove('error-text');
|
||
}
|
||
verifyAdminPassword();
|
||
});
|
||
}
|
||
|
||
if(getAdminPassword()){
|
||
verifyAdminPassword();
|
||
}
|
||
|
||
function setStatus(message, isError){
|
||
if(!statusEl) return;
|
||
statusEl.textContent = message;
|
||
statusEl.classList.toggle('error-text', !!isError);
|
||
}
|
||
|
||
function setRunsStatus(message, isError){
|
||
if(!runsStatusEl) return;
|
||
runsStatusEl.textContent = message;
|
||
runsStatusEl.classList.toggle('error-text', !!isError);
|
||
}
|
||
|
||
function filteredItems(){
|
||
const query = (searchEl && searchEl.value || '').trim().toLowerCase();
|
||
if(!query) return items;
|
||
return items.filter(item=>{
|
||
return [item.level, item.position, item.title, item.url].some(value=>
|
||
String(value || '').toLowerCase().includes(query)
|
||
);
|
||
});
|
||
}
|
||
|
||
function normalizePositions(){
|
||
let position = 1;
|
||
items.forEach(item=>{
|
||
if(item._isDraft){
|
||
item.position = '';
|
||
return;
|
||
}
|
||
item.position = String(position);
|
||
position += 1;
|
||
});
|
||
}
|
||
|
||
function moveItemToPosition(index, rawPosition){
|
||
if(!items[index]) return;
|
||
const parsedPosition = Number(rawPosition);
|
||
if(!Number.isFinite(parsedPosition) || parsedPosition < 1) return;
|
||
const nextPosition = Math.max(1, parsedPosition);
|
||
const [item] = items.splice(index, 1);
|
||
item._isDraft = false;
|
||
const drafts = items.filter(entry=>entry._isDraft);
|
||
const ranked = items.filter(entry=>!entry._isDraft);
|
||
const targetIndex = Math.min(ranked.length, nextPosition - 1);
|
||
ranked.splice(targetIndex, 0, item);
|
||
items = drafts.concat(ranked);
|
||
normalizePositions();
|
||
}
|
||
|
||
function renderAdminTable(){
|
||
const rows = filteredItems();
|
||
listTbody.innerHTML = '';
|
||
rows.forEach(item=>{
|
||
const actualIndex = items.indexOf(item);
|
||
const tr = document.createElement('tr');
|
||
tr.innerHTML = `
|
||
<td><input data-field="position" data-index="${actualIndex}" type="number" min="1" value="${escapeAttr(item.position)}"></td>
|
||
<td><input data-field="level" data-index="${actualIndex}" type="text" value="${escapeAttr(item.level)}"></td>
|
||
<td><input data-field="title" data-index="${actualIndex}" type="text" value="${escapeAttr(item.title)}"></td>
|
||
<td><input data-field="url" data-index="${actualIndex}" type="url" value="${escapeAttr(item.url)}"></td>
|
||
<td><button type="button" class="btn danger-btn small-btn" data-delete="${actualIndex}">Delete</button></td>
|
||
`;
|
||
listTbody.appendChild(tr);
|
||
});
|
||
if(!rows.length){
|
||
const tr = document.createElement('tr');
|
||
tr.innerHTML = '<td colspan="5" class="muted">No rows match your search.</td>';
|
||
listTbody.appendChild(tr);
|
||
}
|
||
}
|
||
|
||
function filteredRuns(){
|
||
const query = (runSearchEl && runSearchEl.value || '').trim().toLowerCase();
|
||
if(!query) return runs;
|
||
return runs.filter(run=>{
|
||
return [
|
||
run.status,
|
||
run.playerName,
|
||
run.levelTitle,
|
||
run.videoUrl,
|
||
run.rawFootageUrl,
|
||
run.notes,
|
||
run.reviewNotes
|
||
].some(value=>String(value || '').toLowerCase().includes(query));
|
||
});
|
||
}
|
||
|
||
function formatDate(value){
|
||
if(!value) return 'Unknown';
|
||
const date = new Date(value);
|
||
if(Number.isNaN(date.getTime())) return 'Unknown';
|
||
return date.toLocaleString();
|
||
}
|
||
|
||
function renderRunsTable(){
|
||
const rows = filteredRuns();
|
||
runsTbody.innerHTML = '';
|
||
rows.forEach(run=>{
|
||
const tr = document.createElement('tr');
|
||
tr.innerHTML = `
|
||
<td><span class="status-pill status-${escapeAttr(run.status || 'pending')}">${escapeHtml(run.status || 'pending')}</span></td>
|
||
<td><strong>${escapeHtml(run.playerName || 'Unknown')}</strong></td>
|
||
<td><strong>${escapeHtml(run.percent || '100')}%</strong></td>
|
||
<td>
|
||
<div class="run-admin-cell">
|
||
<strong>${escapeHtml(run.levelTitle || 'Untitled')}</strong>
|
||
<span class="muted small">${escapeHtml(run.notes || 'No submission notes.')}</span>
|
||
</div>
|
||
</td>
|
||
<td>${escapeHtml(formatDate(run.submittedAt))}</td>
|
||
<td>
|
||
<div class="run-admin-actions">
|
||
<a class="btn ghost-btn small-btn" href="${escapeAttr(run.videoUrl || '#')}" target="_blank" rel="noopener noreferrer">Video</a>
|
||
<button type="button" class="btn ghost-btn small-btn" data-run-action="approved" data-run-id="${escapeAttr(run.id)}">Approve</button>
|
||
<button type="button" class="btn ghost-btn small-btn" data-run-action="rejected" data-run-id="${escapeAttr(run.id)}">Reject</button>
|
||
<button type="button" class="btn danger-btn small-btn" data-run-delete="${escapeAttr(run.id)}">Delete</button>
|
||
</div>
|
||
</td>
|
||
`;
|
||
runsTbody.appendChild(tr);
|
||
|
||
const detailRow = document.createElement('tr');
|
||
detailRow.className = 'run-admin-detail-row';
|
||
detailRow.innerHTML = `
|
||
<td colspan="6">
|
||
<div class="run-admin-detail">
|
||
<span><strong>Raw:</strong> ${run.rawFootageUrl ? `<a href="${escapeAttr(run.rawFootageUrl)}" target="_blank" rel="noopener noreferrer">${escapeHtml(run.rawFootageUrl)}</a>` : 'None provided'}</span>
|
||
<span><strong>Percent:</strong> ${escapeHtml(run.percent || '100')}%</span>
|
||
<span><strong>Reviewed by:</strong> ${escapeHtml(run.reviewedBy || 'Unassigned')}</span>
|
||
<span><strong>Review notes:</strong> ${escapeHtml(run.reviewNotes || 'No review notes yet.')}</span>
|
||
</div>
|
||
</td>
|
||
`;
|
||
runsTbody.appendChild(detailRow);
|
||
});
|
||
if(!rows.length){
|
||
const tr = document.createElement('tr');
|
||
tr.innerHTML = '<td colspan="6" class="muted">No run submissions match your search.</td>';
|
||
runsTbody.appendChild(tr);
|
||
}
|
||
}
|
||
|
||
function saveItems(){
|
||
if(!canUseLiveServer){
|
||
setStatus('Start the Node server to save the live list.', true);
|
||
return Promise.resolve();
|
||
}
|
||
const hasUnplacedDraft = items.some(item=>{
|
||
const hasContent = String(item.title || '').trim() || String(item.url || '').trim() || String(item.level || '').trim();
|
||
return item._isDraft && hasContent;
|
||
});
|
||
if(hasUnplacedDraft){
|
||
setStatus('Give each new row a number before saving.', true);
|
||
return Promise.resolve();
|
||
}
|
||
items = items
|
||
.map(item=>({
|
||
level: String(item.level || '').trim() || 'new',
|
||
position: String(item.position || '').trim(),
|
||
title: String(item.title || '').trim(),
|
||
url: String(item.url || '').trim()
|
||
}))
|
||
.filter(item=>item.title);
|
||
normalizePositions();
|
||
return fetch(liveApiUrl, {
|
||
method:'PUT',
|
||
headers:authHeaders({'Content-Type':'application/json'}),
|
||
body: JSON.stringify({text: formatData(items)})
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(!r.ok) throw new Error('Save failed');
|
||
clearItemsCache();
|
||
renderAdminTable();
|
||
setStatus('Saved. Live pages update automatically.');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above, then try again.', setStatus);
|
||
return;
|
||
}
|
||
setStatus('Could not save. Check the live server endpoint.', true);
|
||
});
|
||
}
|
||
|
||
function loadAdmin(){
|
||
loadItems().then(loaded=>{
|
||
items = loaded.slice().sort((a,b)=>(Number(a.position) || 0) - (Number(b.position) || 0)).map(item=>({
|
||
level: item.level,
|
||
position: item.position,
|
||
title: item.title,
|
||
url: item.url,
|
||
_isDraft: false
|
||
}));
|
||
normalizePositions();
|
||
renderAdminTable();
|
||
setStatus('Connected to live list data.');
|
||
updateStats();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setStatus('Could not load list data.', true);
|
||
});
|
||
}
|
||
|
||
function loadRunsAdmin(){
|
||
loadRuns().then(loadedRuns=>{
|
||
runs = loadedRuns.slice().sort((a,b)=>new Date(b.submittedAt) - new Date(a.submittedAt));
|
||
renderRunsTable();
|
||
setRunsStatus('Connected to live run submissions.');
|
||
updateStats();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setRunsStatus('Could not load run submissions.', true);
|
||
});
|
||
}
|
||
|
||
function updateRunStatus(runId, status){
|
||
if(!canUseLiveServer){
|
||
setRunsStatus('Start the Node server to review submissions.', true);
|
||
return;
|
||
}
|
||
const run = runs.find(entry=>entry.id === runId);
|
||
if(!run) return;
|
||
const reviewNotes = window.prompt(`Review notes for ${run.levelTitle} (${status})`, run.reviewNotes || '');
|
||
if(reviewNotes === null) return;
|
||
fetch(`${liveRunsUrl}/${encodeURIComponent(runId)}`, {
|
||
method:'PUT',
|
||
headers:authHeaders({'Content-Type':'application/json'}),
|
||
body: JSON.stringify({
|
||
...run,
|
||
status,
|
||
reviewNotes,
|
||
reviewedBy: fedlServerUsername || 'FEDL Admin'
|
||
})
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(!r.ok) throw new Error('Run update failed');
|
||
clearRunsCache();
|
||
setRunsStatus(`Run marked ${status}.`);
|
||
return refreshRuns();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above to review runs.', setRunsStatus);
|
||
return;
|
||
}
|
||
setRunsStatus('Could not update that run.', true);
|
||
});
|
||
}
|
||
|
||
function deleteRun(runId){
|
||
if(!canUseLiveServer){
|
||
setRunsStatus('Start the Node server to delete submissions.', true);
|
||
return;
|
||
}
|
||
fetch(`${liveRunsUrl}/${encodeURIComponent(runId)}`, {
|
||
method:'DELETE',
|
||
headers:authHeaders()
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(!r.ok) throw new Error('Run delete failed');
|
||
clearRunsCache();
|
||
setRunsStatus('Run removed from the queue.');
|
||
return refreshRuns();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above to delete runs.', setRunsStatus);
|
||
return;
|
||
}
|
||
setRunsStatus('Could not delete that run.', true);
|
||
});
|
||
}
|
||
|
||
listTbody.addEventListener('input', function(event){
|
||
const target = event.target;
|
||
const field = target.getAttribute('data-field');
|
||
const index = Number(target.getAttribute('data-index'));
|
||
if(!field || Number.isNaN(index) || !items[index]) return;
|
||
if(field === 'position') return;
|
||
items[index][field] = target.value;
|
||
setStatus('Unsaved changes');
|
||
});
|
||
|
||
listTbody.addEventListener('focusout', function(event){
|
||
const target = event.target;
|
||
if(!(target instanceof HTMLElement)) return;
|
||
const field = target.getAttribute('data-field');
|
||
const index = Number(target.getAttribute('data-index'));
|
||
if(field !== 'position' || Number.isNaN(index) || !items[index]) return;
|
||
moveItemToPosition(index, target.value);
|
||
renderAdminTable();
|
||
setStatus('Unsaved changes');
|
||
});
|
||
|
||
listTbody.addEventListener('click', function(event){
|
||
const deleteButton = event.target.closest('[data-delete]');
|
||
if(deleteButton){
|
||
const deleteIndex = deleteButton.getAttribute('data-delete');
|
||
if(deleteIndex == null) return;
|
||
const index = Number(deleteIndex);
|
||
if(Number.isNaN(index)) return;
|
||
items.splice(index, 1);
|
||
normalizePositions();
|
||
renderAdminTable();
|
||
setStatus('Row removed. Save when ready.');
|
||
}
|
||
});
|
||
|
||
runsTbody.addEventListener('click', function(event){
|
||
const actionButton = event.target.closest('[data-run-action]');
|
||
if(actionButton){
|
||
updateRunStatus(
|
||
actionButton.getAttribute('data-run-id'),
|
||
actionButton.getAttribute('data-run-action')
|
||
);
|
||
return;
|
||
}
|
||
const deleteButton = event.target.closest('[data-run-delete]');
|
||
if(deleteButton){
|
||
const runId = deleteButton.getAttribute('data-run-delete');
|
||
if(runId && window.confirm('Delete this run submission?')){
|
||
deleteRun(runId);
|
||
}
|
||
}
|
||
});
|
||
|
||
addBtn.addEventListener('click', function(){
|
||
items.unshift({level:'new', position:'', title:'', url:'', _isDraft:true});
|
||
normalizePositions();
|
||
renderAdminTable();
|
||
setStatus('New row added at the top. Give it a number when you want to place it.');
|
||
});
|
||
|
||
if(addRowBottomBtn){
|
||
addRowBottomBtn.addEventListener('click', function(){
|
||
items.push({level:'new', position:'', title:'', url:'', _isDraft:true});
|
||
normalizePositions();
|
||
renderAdminTable();
|
||
setStatus('New row added at the bottom.');
|
||
});
|
||
}
|
||
|
||
saveBtn.addEventListener('click', function(){
|
||
saveItems();
|
||
});
|
||
|
||
if(searchEl){
|
||
searchEl.addEventListener('input', renderAdminTable);
|
||
}
|
||
if(runSearchEl){
|
||
runSearchEl.addEventListener('input', renderRunsTable);
|
||
}
|
||
if(adminPasswordEl){
|
||
setAdminPassword(getAdminPassword());
|
||
}
|
||
|
||
function setImportStatus(message, isError){
|
||
if(!importStatusEl) return;
|
||
importStatusEl.textContent = message;
|
||
importStatusEl.classList.toggle('error-text', !!isError);
|
||
}
|
||
|
||
function toggleImportButtons(enabled){
|
||
[importPointercrateBtn, importAredlBtn, importTargetedOpenBtn, bulkApproveOpenBtn].forEach(btn=>{ if(btn) btn.disabled = !enabled; });
|
||
}
|
||
|
||
function updateImportTargetedQueryLabel(){
|
||
if(!importTargetedQueryLabelEl) return;
|
||
const levelRadio = document.querySelector('input[name="import-targeted-filter"][value="level"]');
|
||
const isLevel = levelRadio && levelRadio.checked;
|
||
importTargetedQueryLabelEl.textContent = isLevel ? 'Level name or id' : 'Player name';
|
||
if(importTargetedQueryEl){
|
||
importTargetedQueryEl.placeholder = isLevel ? 'e.g. Acheron or demon id' : 'Name as on the list';
|
||
}
|
||
}
|
||
function openImportTargetedModal(){
|
||
if(!importTargetedModal) return;
|
||
importTargetedModal.hidden = false;
|
||
if(importTargetedForm) importTargetedForm.reset();
|
||
const playerRadio = document.querySelector('input[name="import-targeted-filter"][value="player"]');
|
||
if(playerRadio) playerRadio.checked = true;
|
||
updateImportTargetedQueryLabel();
|
||
if(importTargetedQueryEl) importTargetedQueryEl.focus();
|
||
}
|
||
function closeImportTargetedModal(){
|
||
if(importTargetedModal) importTargetedModal.hidden = true;
|
||
}
|
||
function submitImportTargeted(event){
|
||
event.preventDefault();
|
||
if(!canUseLiveServer){
|
||
setImportStatus('Start the Node server to use the import tool.', true);
|
||
return;
|
||
}
|
||
const source = importTargetedSourceEl && String(importTargetedSourceEl.value || '').trim();
|
||
const filterRadio = document.querySelector('input[name="import-targeted-filter"]:checked');
|
||
const filter = filterRadio && String(filterRadio.value || '').trim();
|
||
const query = importTargetedQueryEl && String(importTargetedQueryEl.value || '').trim();
|
||
if(!source || !filter || !query) return;
|
||
if(importTargetedSubmitBtn) importTargetedSubmitBtn.disabled = true;
|
||
setImportStatus(`Fetching ${source} records…`);
|
||
toggleImportButtons(false);
|
||
fetch(liveApiPath('/api/import/targeted'), {
|
||
method: 'POST',
|
||
headers: authHeaders({'Content-Type':'application/json'}),
|
||
body: JSON.stringify({ source, filter, query })
|
||
}).then(async response=>{
|
||
const payload = await response.json().catch(()=>({}));
|
||
if(response.status === 401) throw new Error('Admin auth failed');
|
||
if(!response.ok) throw new Error(payload.error || `Import failed (${response.status})`);
|
||
return payload;
|
||
}).then(payload=>{
|
||
clearRunsCache();
|
||
const matched = Number(payload.matched) || 0;
|
||
const added = Number(payload.added) || 0;
|
||
const skipped = Number(payload.skipped) || 0;
|
||
setImportStatus(
|
||
`Targeted import: ${matched} API record${matched === 1 ? '' : 's'} matched, ${added} added, ${skipped} skipped (duplicates or missing video). Notes set to “Valid run”.`
|
||
);
|
||
closeImportTargetedModal();
|
||
return refreshRuns();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above, then try again.', setImportStatus);
|
||
closeImportTargetedModal();
|
||
return;
|
||
}
|
||
setImportStatus(err.message || 'Targeted import failed.', true);
|
||
}).finally(()=>{
|
||
if(importTargetedSubmitBtn) importTargetedSubmitBtn.disabled = false;
|
||
toggleImportButtons(true);
|
||
});
|
||
}
|
||
|
||
let bulkApprovePreviewTimer = null;
|
||
function countPendingRunsForPlayer(name){
|
||
const q = String(name || '').trim().toLowerCase();
|
||
if(!q) return 0;
|
||
return runs.filter(run=>{
|
||
const st = String(run.status || 'pending').toLowerCase();
|
||
const pn = String(run.playerName || '').trim().toLowerCase();
|
||
return st === 'pending' && pn === q;
|
||
}).length;
|
||
}
|
||
function updateBulkApprovePreview(){
|
||
if(!bulkApprovePreviewEl || !bulkApprovePlayerInput) return;
|
||
const n = countPendingRunsForPlayer(bulkApprovePlayerInput.value);
|
||
const label = String(bulkApprovePlayerInput.value || '').trim();
|
||
if(!label){
|
||
bulkApprovePreviewEl.textContent = '';
|
||
return;
|
||
}
|
||
bulkApprovePreviewEl.textContent = n
|
||
? `${n} pending run${n === 1 ? '' : 's'} match this name in the current queue.`
|
||
: 'No pending runs match this name in the current queue.';
|
||
}
|
||
function openBulkApproveModal(){
|
||
if(!bulkApproveModal) return;
|
||
bulkApproveModal.hidden = false;
|
||
if(bulkApproveForm) bulkApproveForm.reset();
|
||
updateBulkApprovePreview();
|
||
if(bulkApprovePlayerInput){
|
||
bulkApprovePlayerInput.focus();
|
||
}
|
||
}
|
||
function closeBulkApproveModal(){
|
||
if(bulkApproveModal) bulkApproveModal.hidden = true;
|
||
if(bulkApprovePreviewTimer){
|
||
clearTimeout(bulkApprovePreviewTimer);
|
||
bulkApprovePreviewTimer = null;
|
||
}
|
||
}
|
||
function submitBulkApprove(event){
|
||
event.preventDefault();
|
||
if(!canUseLiveServer){
|
||
setImportStatus('Start the Node server to use the import tool.', true);
|
||
return;
|
||
}
|
||
const playerName = bulkApprovePlayerInput && String(bulkApprovePlayerInput.value || '').trim();
|
||
if(!playerName) return;
|
||
const reviewNotesRaw = bulkApproveNotesInput && String(bulkApproveNotesInput.value || '').trim();
|
||
const body = { playerName };
|
||
if(reviewNotesRaw) body.reviewNotes = reviewNotesRaw;
|
||
if(bulkApproveSubmitBtn) bulkApproveSubmitBtn.disabled = true;
|
||
setImportStatus('Bulk-approving pending runs for that player...');
|
||
fetch(`${liveRunsUrl}/bulk-approve`, {
|
||
method: 'POST',
|
||
headers: authHeaders({'Content-Type':'application/json'}),
|
||
body: JSON.stringify(body)
|
||
}).then(async response=>{
|
||
const payload = await response.json().catch(()=>({}));
|
||
if(response.status === 401) throw new Error('Admin auth failed');
|
||
if(!response.ok) throw new Error(payload.error || `Bulk approve failed (${response.status})`);
|
||
return payload;
|
||
}).then(payload=>{
|
||
clearRunsCache();
|
||
const n = Number(payload.approved) || 0;
|
||
setImportStatus(n ? `Bulk approve done: ${n} pending run${n === 1 ? '' : 's'} approved for ${playerName}.` : `No pending runs to approve for ${playerName}.`);
|
||
closeBulkApproveModal();
|
||
return refreshRuns();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above, then try again.', setImportStatus);
|
||
closeBulkApproveModal();
|
||
return;
|
||
}
|
||
setImportStatus(err.message || 'Bulk approve failed.', true);
|
||
}).finally(()=>{
|
||
if(bulkApproveSubmitBtn) bulkApproveSubmitBtn.disabled = false;
|
||
});
|
||
}
|
||
|
||
function runImport(path, label){
|
||
setImportStatus(`Importing ${label} runs...`);
|
||
toggleImportButtons(false);
|
||
return fetch(liveApiPath(path), {
|
||
method: 'POST',
|
||
headers: authHeaders({'Content-Type':'application/json'})
|
||
}).then(async response => {
|
||
const payload = await response.json().catch(()=>({}));
|
||
if(response.status === 401){
|
||
throw new Error('Admin auth failed');
|
||
}
|
||
if(!response.ok){
|
||
throw new Error(payload.error || `Import failed with status ${response.status}`);
|
||
}
|
||
return payload;
|
||
}).then(payload => {
|
||
setImportStatus(`${label} import complete. Added ${payload.added || 0} runs, skipped ${payload.skipped || 0}.`);
|
||
refreshRuns().catch(()=>{});
|
||
}).catch(error => {
|
||
console.error(error);
|
||
if(error.message === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above, then try again.', setImportStatus);
|
||
return;
|
||
}
|
||
setImportStatus(error.message || 'Import failed.', true);
|
||
}).finally(()=>{
|
||
toggleImportButtons(true);
|
||
});
|
||
}
|
||
|
||
if(importPointercrateBtn){
|
||
importPointercrateBtn.addEventListener('click', ()=> runImport('/api/import/pointercrate', 'Pointercrate'));
|
||
}
|
||
if(importAredlBtn){
|
||
importAredlBtn.addEventListener('click', ()=> runImport('/api/import/aredl', 'AREDL'));
|
||
}
|
||
|
||
if(importTargetedOpenBtn){
|
||
importTargetedOpenBtn.addEventListener('click', ()=> openImportTargetedModal());
|
||
}
|
||
if(importTargetedCancelBtn){
|
||
importTargetedCancelBtn.addEventListener('click', ()=> closeImportTargetedModal());
|
||
}
|
||
if(importTargetedModal){
|
||
importTargetedModal.addEventListener('click', event=>{
|
||
if(event.target === importTargetedModal) closeImportTargetedModal();
|
||
});
|
||
}
|
||
if(importTargetedForm){
|
||
importTargetedForm.addEventListener('submit', submitImportTargeted);
|
||
importTargetedForm.querySelectorAll('input[name="import-targeted-filter"]').forEach(radio=>{
|
||
radio.addEventListener('change', updateImportTargetedQueryLabel);
|
||
});
|
||
}
|
||
|
||
if(bulkApproveOpenBtn){
|
||
bulkApproveOpenBtn.addEventListener('click', ()=> openBulkApproveModal());
|
||
}
|
||
if(bulkApproveCancelBtn){
|
||
bulkApproveCancelBtn.addEventListener('click', ()=> closeBulkApproveModal());
|
||
}
|
||
if(bulkApproveModal){
|
||
bulkApproveModal.addEventListener('click', event=>{
|
||
if(event.target === bulkApproveModal) closeBulkApproveModal();
|
||
});
|
||
}
|
||
if(bulkApproveForm){
|
||
bulkApproveForm.addEventListener('submit', submitBulkApprove);
|
||
}
|
||
if(bulkApprovePlayerInput){
|
||
bulkApprovePlayerInput.addEventListener('input', ()=>{
|
||
if(bulkApprovePreviewTimer) clearTimeout(bulkApprovePreviewTimer);
|
||
bulkApprovePreviewTimer = setTimeout(updateBulkApprovePreview, 200);
|
||
});
|
||
}
|
||
document.addEventListener('keydown', event=>{
|
||
if(event.key !== 'Escape') return;
|
||
if(importTargetedModal && !importTargetedModal.hidden){
|
||
closeImportTargetedModal();
|
||
return;
|
||
}
|
||
if(bulkApproveModal && !bulkApproveModal.hidden) closeBulkApproveModal();
|
||
});
|
||
document.addEventListener('keydown', event=>{
|
||
if(event.target.tagName === 'INPUT' || event.target.tagName === 'TEXTAREA') return;
|
||
const key = event.key.toLowerCase();
|
||
if(key === '/' && !event.ctrlKey && !event.metaKey){
|
||
event.preventDefault();
|
||
const searchInput = document.querySelector('.search-row input[type="text"], #list-search, .levels-table input');
|
||
if(searchInput) searchInput.focus();
|
||
}
|
||
if(key === 'h' && !event.ctrlKey && !event.metaKey){
|
||
window.location.href = 'index.html';
|
||
}
|
||
if(key === 'l' && !event.ctrlKey && !event.metaKey){
|
||
window.location.href = 'lists.html';
|
||
}
|
||
if(key === 'r' && !event.ctrlKey && !event.metaKey){
|
||
window.location.href = 'run.html';
|
||
}
|
||
if(key === '?' && !event.ctrlKey && !event.metaKey){
|
||
window.location.href = 'rules.html';
|
||
}
|
||
});
|
||
|
||
bindLiveUpdates();
|
||
onLiveUpdate(function(updatedItems){
|
||
items = updatedItems.slice().sort((a,b)=>(Number(a.position) || 0) - (Number(b.position) || 0)).map(item=>({
|
||
level: item.level,
|
||
position: item.position,
|
||
title: item.title,
|
||
url: item.url,
|
||
_isDraft: false
|
||
}));
|
||
normalizePositions();
|
||
renderAdminTable();
|
||
setStatus('List reloaded from live server.');
|
||
});
|
||
onRunsUpdate(function(updatedRuns){
|
||
runs = updatedRuns.slice().sort((a,b)=>new Date(b.submittedAt) - new Date(a.submittedAt));
|
||
renderRunsTable();
|
||
setRunsStatus('Run queue reloaded from the live server.');
|
||
});
|
||
|
||
loadAdmin();
|
||
loadRunsAdmin();
|
||
|
||
const bugReportsBody = qs('bug-reports-body');
|
||
const bugReportSearchEl = qs('bug-report-search');
|
||
const bugReportsStatusEl = qs('bug-reports-admin-status');
|
||
let bugReports = [];
|
||
|
||
function setBugReportsStatus(message, isError){
|
||
if(!bugReportsStatusEl) return;
|
||
bugReportsStatusEl.textContent = message;
|
||
bugReportsStatusEl.classList.toggle('error-text', !!isError);
|
||
}
|
||
|
||
function loadBugReports(){
|
||
if(!canUseLiveServer){
|
||
setBugReportsStatus('Start the Node server to load bug reports.', true);
|
||
return Promise.resolve([]);
|
||
}
|
||
return fetch(`${liveServerBase}/api/bugreports`, {
|
||
method: 'GET',
|
||
headers: authHeaders()
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(!r.ok) throw new Error('Failed to load bug reports');
|
||
return r.json();
|
||
}).then(payload=>{
|
||
return Array.isArray(payload.items) ? payload.items : [];
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setBugReportsStatus('Could not load bug reports.', true);
|
||
return [];
|
||
});
|
||
}
|
||
|
||
function refreshBugReports(){
|
||
return loadBugReports().then(loaded=>{
|
||
bugReports = loaded.slice().sort((a,b)=>new Date(b.submittedAt) - new Date(a.submittedAt));
|
||
renderBugReportsTable();
|
||
updateStats();
|
||
});
|
||
}
|
||
|
||
function filteredBugReports(){
|
||
const query = (bugReportSearchEl && bugReportSearchEl.value || '').trim().toLowerCase();
|
||
if(!query) return bugReports;
|
||
return bugReports.filter(report=>{
|
||
return [
|
||
report.category,
|
||
report.status,
|
||
report.subject,
|
||
report.description,
|
||
report.accountUsername
|
||
].some(value=>String(value || '').toLowerCase().includes(query));
|
||
});
|
||
}
|
||
|
||
function renderBugReportsTable(){
|
||
const rows = filteredBugReports();
|
||
if(!bugReportsBody) return;
|
||
bugReportsBody.innerHTML = '';
|
||
rows.forEach(report=>{
|
||
const tr = document.createElement('tr');
|
||
tr.innerHTML = `
|
||
<td><span class="status-pill status-${escapeAttr(report.category || 'other')}">${escapeHtml(report.category || 'other')}</span></td>
|
||
<td><span class="status-pill status-${escapeAttr(report.status || 'open')}">${escapeHtml(report.status || 'open')}</span></td>
|
||
<td><strong>${escapeHtml(report.accountUsername || 'Anonymous')}</strong></td>
|
||
<td>
|
||
<div class="run-admin-cell">
|
||
<strong>${escapeHtml(report.subject || 'Untitled')}</strong>
|
||
<span class="muted small">${escapeHtml((report.description || '').slice(0, 100))}${report.description && report.description.length > 100 ? '...' : ''}</span>
|
||
</div>
|
||
</td>
|
||
<td>${escapeHtml(formatDate(report.submittedAt))}</td>
|
||
<td>
|
||
<div class="run-admin-actions">
|
||
<button type="button" class="btn ghost-btn small-btn" data-bug-action="resolved" data-bug-id="${escapeAttr(report.id)}">Resolve</button>
|
||
<button type="button" class="btn danger-btn small-btn" data-bug-delete="${escapeAttr(report.id)}">Delete</button>
|
||
</div>
|
||
</td>
|
||
`;
|
||
bugReportsBody.appendChild(tr);
|
||
|
||
const detailRow = document.createElement('tr');
|
||
detailRow.className = 'bug-report-detail-row';
|
||
detailRow.innerHTML = `
|
||
<td colspan="6">
|
||
<div class="bug-report-detail">
|
||
<span><strong>Email:</strong> ${report.email ? escapeHtml(report.email) : 'Not provided'}</span>
|
||
<span><strong>Description:</strong> ${escapeHtml(report.description || 'No description')}</span>
|
||
</div>
|
||
</td>
|
||
`;
|
||
bugReportsBody.appendChild(detailRow);
|
||
});
|
||
if(!rows.length){
|
||
const tr = document.createElement('tr');
|
||
tr.innerHTML = '<td colspan="6" class="muted">No bug reports match your search.</td>';
|
||
bugReportsBody.appendChild(tr);
|
||
}
|
||
}
|
||
|
||
function updateBugReportStatus(reportId, status){
|
||
if(!canUseLiveServer){
|
||
setBugReportsStatus('Start the Node server to update bug reports.', true);
|
||
return;
|
||
}
|
||
const report = bugReports.find(entry=>entry.id === reportId);
|
||
if(!report) return;
|
||
fetch(`${liveServerBase}/api/bugreports/${encodeURIComponent(reportId)}`, {
|
||
method:'PUT',
|
||
headers:authHeaders({'Content-Type':'application/json'}),
|
||
body: JSON.stringify({
|
||
...report,
|
||
status
|
||
})
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(!r.ok) throw new Error('Bug report update failed');
|
||
return refreshBugReports();
|
||
}).then(()=>{
|
||
setBugReportsStatus(`Bug report marked ${status}.`);
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above to update bug reports.', setBugReportsStatus);
|
||
return;
|
||
}
|
||
setBugReportsStatus('Could not update that bug report.', true);
|
||
});
|
||
}
|
||
|
||
function deleteBugReport(reportId){
|
||
if(!canUseLiveServer){
|
||
setBugReportsStatus('Start the Node server to delete bug reports.', true);
|
||
return;
|
||
}
|
||
fetch(`${liveServerBase}/api/bugreports/${encodeURIComponent(reportId)}`, {
|
||
method:'DELETE',
|
||
headers:authHeaders()
|
||
}).then(r=>{
|
||
if(r.status === 401) throw new Error('Admin auth failed');
|
||
if(!r.ok) throw new Error('Bug report delete failed');
|
||
return refreshBugReports();
|
||
}).then(()=>{
|
||
setBugReportsStatus('Bug report removed.');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
if(String(err && err.message || '') === 'Admin auth failed'){
|
||
handleAdminAuthFailure('Wrong admin password. Enter it above to delete bug reports.', setBugReportsStatus);
|
||
return;
|
||
}
|
||
setBugReportsStatus('Could not delete that bug report.', true);
|
||
});
|
||
}
|
||
|
||
if(bugReportsBody){
|
||
bugReportsBody.addEventListener('click', function(event){
|
||
const actionButton = event.target.closest('[data-bug-action]');
|
||
if(actionButton){
|
||
updateBugReportStatus(
|
||
actionButton.getAttribute('data-bug-id'),
|
||
actionButton.getAttribute('data-bug-action')
|
||
);
|
||
return;
|
||
}
|
||
const deleteButton = event.target.closest('[data-bug-delete]');
|
||
if(deleteButton){
|
||
const reportId = deleteButton.getAttribute('data-bug-delete');
|
||
if(reportId && window.confirm('Delete this bug report?')){
|
||
deleteBugReport(reportId);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
if(bugReportSearchEl){
|
||
bugReportSearchEl.addEventListener('input', renderBugReportsTable);
|
||
}
|
||
|
||
function updateStats(){
|
||
const totalRuns = Array.isArray(runs) ? runs.length : 0;
|
||
const pendingRuns = Array.isArray(runs) ? runs.filter(r=>String(r.status || '').toLowerCase() === 'pending').length : 0;
|
||
const levelsCount = items ? items.filter(i=>i && i.title && !i._isDraft).length : 0;
|
||
const openReports = Array.isArray(bugReports) ? bugReports.filter(r=>String(r.status || '').toLowerCase() === 'open').length : 0;
|
||
const statTotalRuns = qs('stat-total-runs');
|
||
const statPendingRuns = qs('stat-pending-runs');
|
||
const statLevelsCount = qs('stat-levels-count');
|
||
const statBugReports = qs('stat-bug-reports');
|
||
const statsStatusEl = qs('admin-stats-status');
|
||
if(statTotalRuns) statTotalRuns.textContent = totalRuns;
|
||
if(statPendingRuns) statPendingRuns.textContent = pendingRuns;
|
||
if(statLevelsCount) statLevelsCount.textContent = levelsCount;
|
||
if(statBugReports) statBugReports.textContent = openReports;
|
||
if(statsStatusEl) statsStatusEl.textContent = 'Stats loaded.';
|
||
}
|
||
|
||
if(bugReportsBody || qs('stat-total-runs')){
|
||
refreshBugReports().then(()=>{
|
||
setBugReportsStatus('Bug reports loaded.');
|
||
});
|
||
}
|
||
|
||
onLiveUpdate(function(updatedItems){
|
||
items = updatedItems.slice().sort((a,b)=>(Number(a.position) || 0) - (Number(b.position) || 0)).map(item=>({
|
||
level: item.level,
|
||
position: item.position,
|
||
title: item.title,
|
||
url: item.url,
|
||
_isDraft: false
|
||
}));
|
||
normalizePositions();
|
||
renderAdminTable();
|
||
setStatus('List reloaded from live server.');
|
||
updateStats();
|
||
});
|
||
onRunsUpdate(function(updatedRuns){
|
||
runs = updatedRuns.slice().sort((a,b)=>new Date(b.submittedAt) - new Date(a.submittedAt));
|
||
renderRunsTable();
|
||
setRunsStatus('Run queue reloaded from the live server.');
|
||
updateStats();
|
||
});
|
||
|
||
const adminTabButtons = document.querySelectorAll('.admin-tab');
|
||
const adminTabPanels = document.querySelectorAll('.admin-tab-panel');
|
||
|
||
function switchAdminTab(tabName){
|
||
adminTabButtons.forEach(btn=>{
|
||
btn.classList.toggle('active', btn.getAttribute('data-tab') === tabName);
|
||
});
|
||
adminTabPanels.forEach(panel=>{
|
||
panel.hidden = panel.id !== `tab-${tabName}`;
|
||
});
|
||
}
|
||
|
||
adminTabButtons.forEach(btn=>{
|
||
btn.addEventListener('click', ()=>{
|
||
const tab = btn.getAttribute('data-tab');
|
||
if(tab) switchAdminTab(tab);
|
||
});
|
||
});
|
||
}
|
||
|
||
if(page==='run'){
|
||
const form = qs('run-form');
|
||
const formStatusEl = qs('run-form-status');
|
||
const listStatusEl = qs('run-list-status');
|
||
const submissionsEl = qs('run-submissions');
|
||
const levelOptionsEl = qs('run-level-options');
|
||
const myRunsSection = qs('run-my-runs-section');
|
||
const savedRunsListEl = qs('run-saved-runs-list');
|
||
const saveAccountBtn = qs('run-save-account');
|
||
const playerNameInput = qs('run-player-name');
|
||
|
||
function setRunFormStatus(message, isError, isSuccess){
|
||
if(!formStatusEl) return;
|
||
formStatusEl.textContent = message;
|
||
formStatusEl.classList.toggle('error-text', !!isError);
|
||
formStatusEl.classList.toggle('success-text', !!isSuccess);
|
||
}
|
||
|
||
function setRunListStatus(message, isError){
|
||
if(!listStatusEl) return;
|
||
listStatusEl.textContent = message;
|
||
listStatusEl.classList.toggle('error-text', !!isError);
|
||
}
|
||
|
||
function showRunSubmissionsShimmer(){
|
||
if(!submissionsEl) return;
|
||
submissionsEl.textContent = '';
|
||
for(let i = 0; i < 4; i += 1){
|
||
const card = document.createElement('article');
|
||
card.className = 'submission-card submission-card--shimmer';
|
||
card.setAttribute('aria-hidden', 'true');
|
||
submissionsEl.appendChild(card);
|
||
}
|
||
}
|
||
|
||
function applyRunPlayerDefault(){
|
||
if(!playerNameInput || !fedlServerUsername) return;
|
||
if(String(playerNameInput.value || '').trim() !== '') return;
|
||
playerNameInput.value = fedlServerUsername;
|
||
}
|
||
|
||
function renderRunSubmissions(runs){
|
||
submissionsEl.innerHTML = '';
|
||
if(!runs.length){
|
||
submissionsEl.innerHTML = '<article class="submission-card"><strong>No runs submitted yet</strong><p>The live queue is empty right now.</p></article>';
|
||
return;
|
||
}
|
||
runs.slice(0, 8).forEach(run=>{
|
||
const card = document.createElement('article');
|
||
card.className = 'submission-card';
|
||
const acct = run.accountUsername
|
||
? ` • Account: ${escapeHtml(run.accountUsername)}`
|
||
: '';
|
||
card.innerHTML = `
|
||
<div class="submission-card-top">
|
||
<strong>${escapeHtml(run.levelTitle || 'Untitled')}</strong>
|
||
<span class="status-pill status-${escapeAttr(run.status || 'pending')}">${escapeHtml(run.status || 'pending')}</span>
|
||
</div>
|
||
<p class="submission-meta">By ${escapeHtml(run.playerName || 'Unknown')} • ${escapeHtml(run.percent || '100')}% • ${escapeHtml(new Date(run.submittedAt).toLocaleString())}${acct}</p>
|
||
<p>${escapeHtml(run.reviewNotes || run.notes || 'No notes yet.')}</p>
|
||
<div class="submission-links">
|
||
<a class="text-link" href="${escapeAttr(run.videoUrl || '#')}" target="_blank" rel="noopener noreferrer">Watch run</a>
|
||
</div>
|
||
`;
|
||
submissionsEl.appendChild(card);
|
||
});
|
||
}
|
||
|
||
function renderMySavedRuns(){
|
||
if(!myRunsSection || !savedRunsListEl) return;
|
||
if(!fedlServerUserId){
|
||
myRunsSection.hidden = true;
|
||
if(saveAccountBtn) saveAccountBtn.hidden = true;
|
||
return;
|
||
}
|
||
myRunsSection.hidden = false;
|
||
if(saveAccountBtn) saveAccountBtn.hidden = false;
|
||
const p = fedlGetAccountPayload(fedlServerUserId);
|
||
const runs = p.savedRuns || [];
|
||
savedRunsListEl.textContent = '';
|
||
if(!runs.length){
|
||
const empty = document.createElement('p');
|
||
empty.className = 'muted';
|
||
empty.textContent = 'No runs saved yet. Fill the form and use “Save to my account” to keep drafts, or submit to the live queue.';
|
||
savedRunsListEl.appendChild(empty);
|
||
return;
|
||
}
|
||
runs.forEach(entry=>{
|
||
const card = document.createElement('article');
|
||
card.className = 'submission-card run-saved-card';
|
||
const top = document.createElement('div');
|
||
top.className = 'submission-card-top';
|
||
const strong = document.createElement('strong');
|
||
strong.textContent = entry.levelTitle || 'Untitled';
|
||
top.appendChild(strong);
|
||
const pill = document.createElement('span');
|
||
pill.className = 'status-pill status-pending';
|
||
pill.textContent = 'Saved';
|
||
top.appendChild(pill);
|
||
card.appendChild(top);
|
||
const meta = document.createElement('p');
|
||
meta.className = 'submission-meta';
|
||
meta.textContent = `${entry.playerName || '—'} • ${entry.percent || '100'}% • ${entry.savedAt ? new Date(entry.savedAt).toLocaleString() : ''}`;
|
||
card.appendChild(meta);
|
||
if(entry.videoUrl){
|
||
const link = document.createElement('a');
|
||
link.className = 'text-link';
|
||
link.href = entry.videoUrl;
|
||
link.target = '_blank';
|
||
link.rel = 'noopener noreferrer';
|
||
link.textContent = 'Video link';
|
||
card.appendChild(link);
|
||
}
|
||
const actions = document.createElement('div');
|
||
actions.className = 'run-saved-card-actions';
|
||
const fillBtn = document.createElement('button');
|
||
fillBtn.type = 'button';
|
||
fillBtn.className = 'btn ghost-btn small-btn';
|
||
fillBtn.textContent = 'Load into form';
|
||
fillBtn.addEventListener('click', ()=>{
|
||
qs('run-player-name').value = entry.playerName || '';
|
||
qs('run-level-title').value = entry.levelTitle || '';
|
||
qs('run-video-url').value = entry.videoUrl || '';
|
||
qs('run-percent').value = entry.percent || '100';
|
||
qs('run-raw-footage-url').value = entry.rawFootageUrl || '';
|
||
qs('run-notes').value = entry.notes || '';
|
||
setRunFormStatus('Loaded this run into the form. Submit or edit, then save or send to the queue.', false, false);
|
||
});
|
||
const delBtn = document.createElement('button');
|
||
delBtn.type = 'button';
|
||
delBtn.className = 'btn ghost-btn small-btn';
|
||
delBtn.textContent = 'Remove';
|
||
delBtn.addEventListener('click', ()=>{
|
||
fedlRemoveSavedRun(fedlServerUserId, entry.id);
|
||
renderMySavedRuns();
|
||
});
|
||
actions.appendChild(fillBtn);
|
||
actions.appendChild(delBtn);
|
||
card.appendChild(actions);
|
||
savedRunsListEl.appendChild(card);
|
||
});
|
||
}
|
||
|
||
function loadRunPage(){
|
||
loadItems().then(items=>{
|
||
const titles = items.map(item=>item.title).filter(Boolean);
|
||
levelOptionsEl.innerHTML = titles.map(title=>`<option value="${escapeAttr(title)}"></option>`).join('');
|
||
}).catch(err=>console.error(err));
|
||
|
||
showRunSubmissionsShimmer();
|
||
setRunListStatus('Loading recent submissions…');
|
||
|
||
loadRuns().then(runs=>{
|
||
const sortedRuns = runs.slice().sort((a,b)=>new Date(b.submittedAt) - new Date(a.submittedAt));
|
||
renderRunSubmissions(sortedRuns);
|
||
setRunListStatus('Live submissions are updating automatically.');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
renderRunSubmissions([]);
|
||
setRunListStatus('Could not load recent submissions.', true);
|
||
});
|
||
}
|
||
|
||
if(saveAccountBtn){
|
||
saveAccountBtn.addEventListener('click', ()=>{
|
||
const fields = {
|
||
playerName: qs('run-player-name').value.trim(),
|
||
levelTitle: qs('run-level-title').value.trim(),
|
||
videoUrl: qs('run-video-url').value.trim(),
|
||
percent: qs('run-percent').value.trim(),
|
||
rawFootageUrl: qs('run-raw-footage-url').value.trim(),
|
||
notes: qs('run-notes').value.trim()
|
||
};
|
||
const res = fedlAddSavedRun(fedlServerUserId, fields);
|
||
if(!res.ok){
|
||
setRunFormStatus(res.error, true);
|
||
return;
|
||
}
|
||
setRunFormStatus('Run saved to your account. You can keep multiple saved runs and load them anytime.', false, true);
|
||
renderMySavedRuns();
|
||
});
|
||
}
|
||
|
||
document.addEventListener('fedl-auth-updated', ()=>{
|
||
renderMySavedRuns();
|
||
applyRunPlayerDefault();
|
||
});
|
||
|
||
form.addEventListener('submit', function(event){
|
||
event.preventDefault();
|
||
if(!canUseLiveServer){
|
||
setRunFormStatus('Submitting runs is not available right now.', true);
|
||
return;
|
||
}
|
||
const payload = {
|
||
playerName: qs('run-player-name').value.trim(),
|
||
levelTitle: qs('run-level-title').value.trim(),
|
||
videoUrl: qs('run-video-url').value.trim(),
|
||
percent: qs('run-percent').value.trim(),
|
||
rawFootageUrl: qs('run-raw-footage-url').value.trim(),
|
||
notes: qs('run-notes').value.trim()
|
||
};
|
||
setRunFormStatus('Sending your run to the live queue...');
|
||
const headers = { 'Content-Type': 'application/json' };
|
||
const tok = fedlGetAuthToken();
|
||
if(tok){
|
||
headers.Authorization = `Bearer ${tok}`;
|
||
}
|
||
fetch(liveRunsUrl, {
|
||
method:'POST',
|
||
headers,
|
||
body: JSON.stringify(payload)
|
||
}).then(async r=>{
|
||
if(!r.ok){
|
||
const { message } = await fedlReadJsonResponse(r);
|
||
throw new Error(message);
|
||
}
|
||
clearRunsCache();
|
||
form.reset();
|
||
applyRunPlayerDefault();
|
||
const okMsg = fedlServerUsername
|
||
? `Run submitted successfully. It is linked to your account (${fedlServerUsername}) for moderators.`
|
||
: 'Run submitted successfully. The admin panel can review it now.';
|
||
setRunFormStatus(okMsg, false, true);
|
||
return refreshRuns();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setRunFormStatus(err.message || 'Could not submit the run. Check the server and try again.', true);
|
||
});
|
||
});
|
||
|
||
bindLiveUpdates();
|
||
onRunsUpdate(function(updatedRuns){
|
||
const sortedRuns = updatedRuns.slice().sort((a,b)=>new Date(b.submittedAt) - new Date(a.submittedAt));
|
||
renderRunSubmissions(sortedRuns);
|
||
setRunListStatus('Recent submissions reloaded.');
|
||
});
|
||
|
||
fedlRefreshAuthState()
|
||
.then(()=> fedlPullUserStateToLocal(fedlServerUserId))
|
||
.finally(()=>{
|
||
renderMySavedRuns();
|
||
fedlUpdateAuthNav();
|
||
applyRunPlayerDefault();
|
||
});
|
||
|
||
loadRunPage();
|
||
}
|
||
|
||
const FEDL_USERNAME_RE = /^[a-z0-9_]{3,24}$/;
|
||
const FEDL_EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
||
const FEDL_AUTH_REDIRECT_MS = 1400;
|
||
function fedlSetFormStatus(el, msg, kind){
|
||
if (!el) {
|
||
return;
|
||
}
|
||
el.textContent = msg || '';
|
||
el.className =
|
||
kind === 'error' ? 'muted error-text' : kind === 'success' ? 'muted success-text' : 'muted';
|
||
}
|
||
|
||
if (page === 'signup') {
|
||
const form = qs('signup-form');
|
||
const statusEl = qs('signup-status');
|
||
const submitBtn = qs('signup-submit');
|
||
function setSignupStatus(msg, kind){
|
||
fedlSetFormStatus(statusEl, msg, kind);
|
||
}
|
||
function checkTurnstile(){
|
||
const turnstileEl = window.turnstile;
|
||
if(turnstileEl){
|
||
const token = turnstileEl.getResponse();
|
||
if(!token){
|
||
setSignupStatus('Please complete the verification challenge.', 'error');
|
||
return false;
|
||
}
|
||
}
|
||
return true;
|
||
}
|
||
form.addEventListener('submit', function(ev){
|
||
ev.preventDefault();
|
||
if(!checkTurnstile()) return;
|
||
if (!canUseLiveServer) {
|
||
setSignupStatus('Sign up is not available right now.', 'error');
|
||
return;
|
||
}
|
||
const username = String(qs('signup-username').value || '').trim().toLowerCase();
|
||
const password = qs('signup-password').value || '';
|
||
const password2 = qs('signup-password2').value || '';
|
||
if (!FEDL_USERNAME_RE.test(username)) {
|
||
setSignupStatus('Use 3–24 characters: lowercase letters, numbers, or underscore only.', 'error');
|
||
return;
|
||
}
|
||
if (password.length < 8) {
|
||
setSignupStatus('Password must be at least 8 characters.', 'error');
|
||
return;
|
||
}
|
||
if (password !== password2) {
|
||
setSignupStatus('Passwords do not match.', 'error');
|
||
return;
|
||
}
|
||
submitBtn.disabled = true;
|
||
setSignupStatus('Creating account…');
|
||
fetch(liveApiPath('/api/auth/signup'), {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ username, password })
|
||
}).then(async r=>{
|
||
const { data, message } = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(message || 'Sign up failed');
|
||
}
|
||
fedlSetAuthToken(data.token);
|
||
fedlServerUserId = data.userId;
|
||
fedlServerUsername = data.username;
|
||
document.dispatchEvent(new CustomEvent('fedl-auth-updated'));
|
||
setSignupStatus('Account created successfully. Loading your data…', 'success');
|
||
return fedlPullUserStateToLocal(data.userId);
|
||
}).then(()=>{
|
||
setSignupStatus('You are signed in. Redirecting…', 'success');
|
||
setTimeout(()=>{
|
||
const params = new URLSearchParams(window.location.search);
|
||
const returnUrl = params.get('return') || 'index.html';
|
||
window.location.href = returnUrl;
|
||
}, FEDL_AUTH_REDIRECT_MS);
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setSignupStatus(err.message || 'Could not sign up.', 'error');
|
||
submitBtn.disabled = false;
|
||
});
|
||
});
|
||
}
|
||
|
||
if (page === 'login') {
|
||
const form = qs('login-form');
|
||
const statusEl = qs('login-status');
|
||
const submitBtn = qs('login-submit');
|
||
function setLoginStatus(msg, kind){
|
||
fedlSetFormStatus(statusEl, msg, kind);
|
||
}
|
||
function checkTurnstile(){
|
||
const turnstileEl = window.turnstile;
|
||
if(turnstileEl){
|
||
const token = turnstileEl.getResponse();
|
||
if(!token){
|
||
setLoginStatus('Please complete the verification challenge.', 'error');
|
||
return false;
|
||
}
|
||
}
|
||
return true;
|
||
}
|
||
form.addEventListener('submit', function(ev){
|
||
ev.preventDefault();
|
||
if(!checkTurnstile()) return;
|
||
if (!canUseLiveServer) {
|
||
setLoginStatus('Log in is not available right now.', 'error');
|
||
return;
|
||
}
|
||
const username = String(qs('login-username').value || '').trim().toLowerCase();
|
||
const password = qs('login-password').value || '';
|
||
if (!username) {
|
||
setLoginStatus('Enter your username.', 'error');
|
||
return;
|
||
}
|
||
submitBtn.disabled = true;
|
||
setLoginStatus('Signing in…');
|
||
fetch(liveApiPath('/api/auth/login'), {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ username, password })
|
||
}).then(async r=>{
|
||
const { data, message } = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(message || 'Log in failed');
|
||
}
|
||
fedlSetAuthToken(data.token);
|
||
fedlServerUserId = data.userId;
|
||
fedlServerUsername = data.username;
|
||
document.dispatchEvent(new CustomEvent('fedl-auth-updated'));
|
||
setLoginStatus('Signed in successfully. Loading your data…', 'success');
|
||
return fedlPullUserStateToLocal(data.userId);
|
||
}).then(()=>{
|
||
setLoginStatus('Welcome back. Redirecting…', 'success');
|
||
setTimeout(()=>{
|
||
const params = new URLSearchParams(window.location.search);
|
||
const returnUrl = params.get('return') || 'index.html';
|
||
window.location.href = returnUrl;
|
||
}, FEDL_AUTH_REDIRECT_MS);
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setLoginStatus(err.message || 'Could not log in.', 'error');
|
||
submitBtn.disabled = false;
|
||
});
|
||
});
|
||
}
|
||
|
||
if (page === 'account') {
|
||
const FEDL_THEME_KEY = 'fedl_theme';
|
||
const themeStatusEl = qs('account-theme-status');
|
||
|
||
const themes = {
|
||
dark: { '--bg': '#0f1724', '--panel': '#071326', '--accent': '#5cc5ff', '--muted': '#9fb3c8', '--text': '#e6eef8', '--card': '#081220', '--accent-warm': '#ffb84d' },
|
||
light: { '--bg': '#f0f4f8', '--panel': '#e2e8f0', '--accent': '#0284c7', '--muted': '#64748b', '--text': '#1e293b', '--card': '#cbd5e1', '--accent-warm': '#f59e0b' },
|
||
blue: { '--bg': '#0d1b2a', '--panel': '#1b3a5f', '--accent': '#38bdf8', '--muted': '#94a3b8', '--text': '#e0f2fe', '--card': '#142d4c', '--accent-warm': '#fbbf24' },
|
||
midnight: { '--bg': '#0a0a12', '--panel': '#12121f', '--accent': '#a78bfa', '--muted': '#6b7280', '--text': '#e5e7eb', '--card': '#0f0f1a', '--accent-warm': '#f472b6' },
|
||
cyberpunk: { '--bg': '#0f0f1a', '--panel': '#1a0a2e', '--accent': '#00ff9f', '--muted': '#b388ff', '--text': '#e0f7fa', '--card': '#150f25', '--accent-warm': '#ff00a8' },
|
||
earth: { '--bg': '#1a2f1a', '--panel': '#2d4a2d', '--accent': '#84cc16', '--muted': '#a3c9a3', '--text': '#ecfccb', '--card': '#223d22', '--accent-warm': '#fbbf24' },
|
||
retro: { '--bg': '#1a1208', '--panel': '#2b1a0a', '--accent': '#ff9f1c', '--muted': '#c9a66b', '--text': '#ffe4b5', '--card': '#241809', '--accent-warm': '#ff6b35' },
|
||
matrix: { '--bg': '#000a00', '--panel': '#001100', '--accent': '#00ff00', '--muted': '#00aa00', '--text': '#00ff00', '--card': '#001100', '--accent-warm': '#88ff88' },
|
||
synthwave: { '--bg': '#1a0a2e', '--panel': '#2d1b4e', '--accent': '#ff2a6d', '--muted': '#c792ea', '--text': '#f4e9ff', '--card': '#251440', '--accent-warm': '#05d9e8' },
|
||
fire: { '--bg': '#1a0505', '--panel': '#2d0a0a', '--accent': '#ff4500', '--muted': '#cc5500', '--text': '#ffd4b8', '--card': '#250a0a', '--accent-warm': '#ffaa00' },
|
||
galaxy: { '--bg': '#0a0612', '--panel': '#150f25', '--accent': '#e056fd', '--muted': '#7c3aed', '--text': '#f0e6ff', '--card': '#0f0818', '--accent-warm': '#f9ca24' },
|
||
candy: { '--bg': '#fdf2f8', '--panel': '#fce7f3', '--accent': '#f472b6', '--muted': '#94a3b8', '--text': '#831843', '--card': '#fbcfe8', '--accent-warm': '#34d399' },
|
||
highcontrast: { '--bg': '#000000', '--panel': '#111111', '--accent': '#ffffff', '--muted': '#cccccc', '--text': '#ffffff', '--card': '#0a0a0a', '--accent-warm': '#ffff00' },
|
||
original: { '--bg': '#0f1724', '--panel': '#071326', '--accent': '#5cc5ff', '--muted': '#9fb3c8', '--text': '#e6eef8', '--card': '#081220', '--accent-warm': '#ffb84d' }
|
||
};
|
||
|
||
function applyTheme(name) {
|
||
const root = document.documentElement;
|
||
const vars = themes[name];
|
||
if (!vars) return;
|
||
Object.entries(vars).forEach(([k, v]) => root.style.setProperty(k, v));
|
||
document.body.dataset.theme = name;
|
||
}
|
||
|
||
function setThemeStatus(msg, kind) {
|
||
fedlSetFormStatus(themeStatusEl, msg, kind);
|
||
}
|
||
|
||
function loadTheme() {
|
||
const saved = localStorage.getItem(FEDL_THEME_KEY) || 'dark';
|
||
applyTheme(saved);
|
||
document.querySelectorAll('input[name="theme"]').forEach(el => {
|
||
el.checked = el.value === saved;
|
||
});
|
||
}
|
||
|
||
document.querySelectorAll('input[name="theme"]').forEach(el => {
|
||
el.addEventListener('change', function() {
|
||
const name = this.value;
|
||
localStorage.setItem(FEDL_THEME_KEY, name);
|
||
applyTheme(name);
|
||
const activeId = fedlAccountId();
|
||
if (activeId) {
|
||
const accounts = fedlListAccounts();
|
||
const account = accounts.find(a => a.id === activeId);
|
||
if (account) {
|
||
account.theme = name;
|
||
fedlSaveAccountsList(accounts);
|
||
const userData = fedlGetAccountPayload(activeId);
|
||
userData.theme = name;
|
||
write(`fedl_user_data_${activeId}`, userData);
|
||
}
|
||
}
|
||
setThemeStatus('Theme saved!', 'success');
|
||
});
|
||
});
|
||
|
||
function loadAccountTheme() {
|
||
const activeId = fedlAccountId();
|
||
if (activeId) {
|
||
const userData = fedlGetAccountPayload(activeId);
|
||
if (userData && userData.theme) {
|
||
localStorage.setItem(FEDL_THEME_KEY, userData.theme);
|
||
applyTheme(userData.theme);
|
||
}
|
||
}
|
||
}
|
||
|
||
loadTheme();
|
||
loadAccountTheme();
|
||
|
||
const overviewStatusEl = qs('account-overview-status');
|
||
const accountUsernameEl = qs('account-username');
|
||
const accountCreatedEl = qs('account-created');
|
||
const resetBtn = qs('account-reset-email-btn');
|
||
const resetStatusEl = qs('account-reset-status');
|
||
const passwordForm = qs('account-password-form');
|
||
const passwordStatusEl = qs('account-password-status');
|
||
const passwordSubmit = qs('account-password-submit');
|
||
|
||
function setOverviewStatus(msg, kind){
|
||
fedlSetFormStatus(overviewStatusEl, msg, kind);
|
||
}
|
||
function setResetStatus(msg, kind){
|
||
fedlSetFormStatus(resetStatusEl, msg, kind);
|
||
}
|
||
function setPasswordStatus(msg, kind){
|
||
fedlSetFormStatus(passwordStatusEl, msg, kind);
|
||
}
|
||
function formatJoinedDate(iso){
|
||
if (!iso) return 'Unknown';
|
||
const d = new Date(iso);
|
||
if (Number.isNaN(d.getTime())) return 'Unknown';
|
||
return d.toLocaleDateString(undefined, { year: 'numeric', month: 'long', day: 'numeric' });
|
||
}
|
||
function authHeaders(){
|
||
return {
|
||
'Content-Type': 'application/json',
|
||
Authorization: `Bearer ${fedlGetAuthToken()}`
|
||
};
|
||
}
|
||
function loadAccount(){
|
||
if (!fedlGetAuthToken()) {
|
||
window.location.replace('login.html?return=' + encodeURIComponent('account.html'));
|
||
return Promise.resolve();
|
||
}
|
||
setOverviewStatus('Loading your account…');
|
||
return fetch(liveApiPath('/api/account'), {
|
||
headers: { Authorization: `Bearer ${fedlGetAuthToken()}` },
|
||
cache: 'no-store'
|
||
}).then(async r=>{
|
||
const { data, message } = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(message || 'Could not load account details.');
|
||
}
|
||
if (accountUsernameEl) {
|
||
accountUsernameEl.textContent = data.username || 'Unknown';
|
||
}
|
||
if (accountCreatedEl) {
|
||
accountCreatedEl.textContent = formatJoinedDate(data.createdAt);
|
||
}
|
||
setOverviewStatus('');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setOverviewStatus(err.message || 'Could not load your account.', 'error');
|
||
if (String(err.message || '').toLowerCase().includes('not signed in')) {
|
||
window.location.replace('login.html?return=' + encodeURIComponent('account.html'));
|
||
}
|
||
});
|
||
}
|
||
|
||
if (resetBtn) {
|
||
resetBtn.addEventListener('click', function(){
|
||
resetBtn.disabled = true;
|
||
setResetStatus('Sending reset code to your messages…');
|
||
fetch(liveApiPath('/api/account/password-reset-email'), {
|
||
method: 'POST',
|
||
headers: { Authorization: `Bearer ${fedlGetAuthToken()}` }
|
||
}).then(async r=>{
|
||
const { message } = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(message || 'Could not send reset code.');
|
||
}
|
||
setResetStatus('Reset code sent! Check your messages.', 'success');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setResetStatus(err.message || 'Could not send reset code.', 'error');
|
||
}).finally(()=>{
|
||
resetBtn.disabled = false;
|
||
});
|
||
});
|
||
}
|
||
|
||
if (passwordForm) {
|
||
passwordForm.addEventListener('submit', function(ev){
|
||
ev.preventDefault();
|
||
const currentPassword = String(qs('account-current-password').value || '');
|
||
const newPassword = String(qs('account-new-password').value || '');
|
||
const confirmPassword = String(qs('account-confirm-password').value || '');
|
||
if (!currentPassword) {
|
||
setPasswordStatus('Enter your current password.', 'error');
|
||
return;
|
||
}
|
||
if (newPassword.length < 8) {
|
||
setPasswordStatus('New password must be at least 8 characters.', 'error');
|
||
return;
|
||
}
|
||
if (newPassword !== confirmPassword) {
|
||
setPasswordStatus('New passwords do not match.', 'error');
|
||
return;
|
||
}
|
||
if (passwordSubmit) {
|
||
passwordSubmit.disabled = true;
|
||
}
|
||
setPasswordStatus('Updating password…');
|
||
fetch(liveApiPath('/api/account/password'), {
|
||
method: 'PUT',
|
||
headers: authHeaders(),
|
||
body: JSON.stringify({ currentPassword, newPassword })
|
||
}).then(async r=>{
|
||
const { data, message } = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(message || 'Could not update password.');
|
||
}
|
||
if (data && data.token) {
|
||
fedlSetAuthToken(data.token);
|
||
}
|
||
passwordForm.reset();
|
||
setPasswordStatus('Password updated.', 'success');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setPasswordStatus(err.message || 'Could not update password.', 'error');
|
||
}).finally(()=>{
|
||
if (passwordSubmit) {
|
||
passwordSubmit.disabled = false;
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
loadAccount();
|
||
}
|
||
|
||
if (page === 'reset-password') {
|
||
const requestForm = qs('reset-request-form');
|
||
const requestStatusEl = qs('reset-request-status');
|
||
const requestSubmit = qs('reset-request-submit');
|
||
const requestInput = qs('reset-identifier');
|
||
const tokenInput = qs('reset-token');
|
||
const resetForm = qs('reset-password-form');
|
||
const resetStatusEl = qs('reset-password-status');
|
||
const resetSubmit = qs('reset-password-submit');
|
||
|
||
function setRequestStatus(msg, kind){
|
||
fedlSetFormStatus(requestStatusEl, msg, kind);
|
||
}
|
||
function setResetPasswordStatus(msg, kind){
|
||
fedlSetFormStatus(resetStatusEl, msg, kind);
|
||
}
|
||
|
||
if (tokenInput) {
|
||
const params = new URLSearchParams(window.location.search);
|
||
tokenInput.value = params.get('token') || '';
|
||
}
|
||
|
||
if (requestForm) {
|
||
requestForm.addEventListener('submit', function(ev){
|
||
ev.preventDefault();
|
||
if (!canUseLiveServer) {
|
||
setRequestStatus('Password reset is not available right now.', 'error');
|
||
return;
|
||
}
|
||
const identifier = String(requestInput ? requestInput.value : '').trim().toLowerCase();
|
||
if (!identifier) {
|
||
setRequestStatus('Enter your username or email.', 'error');
|
||
return;
|
||
}
|
||
if (requestSubmit) {
|
||
requestSubmit.disabled = true;
|
||
}
|
||
setRequestStatus('Checking for your account…');
|
||
fetch(liveApiPath('/api/auth/request-password-reset'), {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ identifier })
|
||
}).then(async r=>{
|
||
const data = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(data.message || 'Could not request password reset.');
|
||
}
|
||
setRequestStatus(data.message || 'Check your messages for the reset code.', 'success');
|
||
if (requestInput) {
|
||
requestInput.value = '';
|
||
}
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setRequestStatus(err.message || 'Could not request password reset.', 'error');
|
||
}).finally(()=>{
|
||
if (requestSubmit) {
|
||
requestSubmit.disabled = false;
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
if (resetForm) {
|
||
resetForm.addEventListener('submit', function(ev){
|
||
ev.preventDefault();
|
||
if (!canUseLiveServer) {
|
||
setResetPasswordStatus('Password reset is not available right now.', 'error');
|
||
return;
|
||
}
|
||
const token = String(tokenInput ? tokenInput.value : '').trim();
|
||
const newPassword = String(qs('reset-new-password').value || '');
|
||
const confirmPassword = String(qs('reset-confirm-password').value || '');
|
||
if (!token) {
|
||
setResetPasswordStatus('Paste the reset code below.', 'error');
|
||
return;
|
||
}
|
||
if (newPassword.length < 8) {
|
||
setResetPasswordStatus('New password must be at least 8 characters.', 'error');
|
||
return;
|
||
}
|
||
if (newPassword !== confirmPassword) {
|
||
setResetPasswordStatus('New passwords do not match.', 'error');
|
||
return;
|
||
}
|
||
if (resetSubmit) {
|
||
resetSubmit.disabled = true;
|
||
}
|
||
setResetPasswordStatus('Resetting your password…');
|
||
fetch(liveApiPath('/api/auth/reset-password'), {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({ token, newPassword })
|
||
}).then(async r=>{
|
||
const { message } = await fedlReadJsonResponse(r);
|
||
if (!r.ok) {
|
||
throw new Error(message || 'Could not reset password.');
|
||
}
|
||
resetForm.reset();
|
||
if (tokenInput) {
|
||
tokenInput.value = '';
|
||
}
|
||
setResetPasswordStatus('Password reset complete. You can log in with your new password now.', 'success');
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setResetPasswordStatus(err.message || 'Could not reset password.', 'error');
|
||
}).finally(()=>{
|
||
if (resetSubmit) {
|
||
resetSubmit.disabled = false;
|
||
}
|
||
});
|
||
});
|
||
}
|
||
}
|
||
|
||
if(page==='contact'){
|
||
const form = qs('contact-form');
|
||
const formStatusEl = qs('contact-form-status');
|
||
const categoryEl = qs('contact-category');
|
||
const subjectEl = qs('contact-subject');
|
||
const descriptionEl = qs('contact-description');
|
||
const emailEl = qs('contact-email');
|
||
|
||
function setContactFormStatus(message, isError){
|
||
if(!formStatusEl) return;
|
||
formStatusEl.textContent = message;
|
||
if(isError){
|
||
formStatusEl.classList.add('error-text');
|
||
formStatusEl.classList.remove('success-text');
|
||
}else{
|
||
formStatusEl.classList.remove('error-text');
|
||
formStatusEl.classList.add('success-text');
|
||
}
|
||
}
|
||
|
||
if(form){
|
||
form.addEventListener('submit', function(event){
|
||
event.preventDefault();
|
||
if(!canUseLiveServer){
|
||
setContactFormStatus('Reports are not available right now.', true);
|
||
return;
|
||
}
|
||
const payload = {
|
||
category: categoryEl ? categoryEl.value : 'other',
|
||
subject: subjectEl ? subjectEl.value.trim() : '',
|
||
description: descriptionEl ? descriptionEl.value.trim() : '',
|
||
email: emailEl ? emailEl.value.trim() : ''
|
||
};
|
||
if(!payload.subject || !payload.description){
|
||
setContactFormStatus('Subject and description are required.', true);
|
||
return;
|
||
}
|
||
setContactFormStatus('Submitting your report...');
|
||
const headers = { 'Content-Type': 'application/json' };
|
||
const tok = fedlGetAuthToken();
|
||
if(tok){
|
||
headers.Authorization = `Bearer ${tok}`;
|
||
}
|
||
fetch(`${liveServerBase}/api/bugreports`, {
|
||
method:'POST',
|
||
headers,
|
||
body: JSON.stringify(payload)
|
||
}).then(async r=>{
|
||
if(!r.ok){
|
||
const { message } = await fedlReadJsonResponse(r);
|
||
throw new Error(message || 'Submit failed');
|
||
}
|
||
return r.json();
|
||
}).then(()=>{
|
||
setContactFormStatus('Thank you! Your report has been submitted. The admins will review it soon.');
|
||
if(form) form.reset();
|
||
}).catch(err=>{
|
||
console.error(err);
|
||
setContactFormStatus(err.message || 'Could not submit your report. Try again later.', true);
|
||
});
|
||
});
|
||
}
|
||
}
|
||
|
||
injectFedlAuthNav();
|
||
fedlRefreshAuthState().finally(()=>{
|
||
fedlUpdateAuthNav();
|
||
if ((page === 'signup' || page === 'login') && fedlServerUsername) {
|
||
window.location.replace('index.html');
|
||
}
|
||
});
|
||
|
||
// Utility
|
||
function escapeHtml(s){return String(s).replace(/[&<>"']/g, c=>({"&":"&","<":"<",">":">","\"":""","'":"'"})[c])}
|
||
function escapeAttr(s){return escapeHtml(String(s == null ? '' : s))}
|
||
})();
|