Loading...
'; try { - const rows = lb.mode === 'daily' - ? await DB.getDailyLeaderboard(Daily.getTodayISO()) - : await DB.getLeaderboard(lb.mode, lb.difficulty, lb.timeLimit); + let rows; + if (lb.mode === 'global') { + rows = await DB.getGlobalLeaderboard(); + } else if (lb.mode === 'daily') { + rows = await DB.getDailyLeaderboard(Daily.getTodayISO()); + } else { + rows = await DB.getLeaderboard(lb.mode, lb.difficulty, lb.timeLimit); + } if (rows.length === 0) { list.innerHTML = 'No scores yet. Be the first!
'; @@ -605,13 +614,20 @@ const App = (() => { } list.innerHTML = rows.map((row, i) => { - const username = row.profiles?.username ?? 'anonymous'; - const rank = i + 1; - const isMe = currentUsername && username === currentUsername; - const medal = rank === 1 ? '🥇' : rank === 2 ? '🥈' : rank === 3 ? '🥉' : `#${rank}`; - - let primary, secondary; - if (lb.mode === 'sprint') { + const username = lb.mode === 'global' + ? (row.username ?? 'anonymous') + : (row.profiles?.username ?? 'anonymous'); + const pos = i + 1; + const isMe = currentUsername && username === currentUsername; + const medal = pos === 1 ? '🥇' : pos === 2 ? '🥈' : pos === 3 ? '🥉' : `#${pos}`; + + let primary, secondary, rankBadge = ''; + if (lb.mode === 'global') { + const r = getRankForXP(row.total_xp ?? 0); + rankBadge = `${r.icon} ${r.name}`; + primary = (row.total_xp ?? 0) + ' XP'; + secondary = `streak ${row.current_streak ?? 0} days`; + } else if (lb.mode === 'sprint') { primary = row.elapsed_seconds.toFixed(2) + 's'; secondary = `${row.correct}/10 correct`; } else if (lb.mode === 'daily') { @@ -625,13 +641,19 @@ const App = (() => { return `Failed to load: ${e.message}
`; } @@ -796,6 +818,27 @@ const App = (() => { }); DuelClient.on('match_cancelled', () => UI.showScreen('menu')); + + DuelClient.on('reaction', ({ emoji }) => { + spawnReaction(emoji); + }); + + document.querySelectorAll('.reaction-btn').forEach(btn => { + btn.addEventListener('click', () => { + DuelClient.sendReaction(btn.dataset.emoji); + }); + }); + } + + function spawnReaction(emoji) { + const overlay = document.getElementById('reaction-overlay'); + const el = document.createElement('div'); + el.className = 'reaction-float'; + el.textContent = emoji; + el.style.left = `${20 + Math.random() * 60}%`; + el.style.top = `${30 + Math.random() * 30}%`; + overlay.appendChild(el); + el.addEventListener('animationend', () => el.remove()); } function startDuelSearch() { @@ -811,7 +854,7 @@ const App = (() => { // ── History ─────────────────────────────────────────────────────────────── function showHistory() { - const hist = JSON.parse(localStorage.getItem('mathblitz_history') || '[]'); + const hist = JSON.parse(localStorage.getItem('quantquiz_history') || '[]'); UI.renderHistory(hist); UI.showScreen('history'); } @@ -820,6 +863,55 @@ const App = (() => { document.getElementById('history-back').addEventListener('click', () => UI.showScreen('menu')); } + // ── Share ───────────────────────────────────────────────────────────────── + + function initShare() { + document.getElementById('share-btn').addEventListener('click', () => { + const score = document.getElementById('res-score').textContent; + const correct = document.getElementById('res-correct').textContent; + const acc = document.getElementById('res-accuracy').textContent; + const mode = settings.mode.charAt(0).toUpperCase() + settings.mode.slice(1); + const text = `QuantQuiz ${mode} — ${score} pts | ${correct} correct | ${acc} accuracy\nPlay at https://mathblitz-jade.vercel.app`; + + if (navigator.share) { + navigator.share({ title: 'QuantQuiz', text }).catch(() => {}); + } else { + navigator.clipboard.writeText(text).then(() => { + const btn = document.getElementById('share-btn'); + btn.textContent = 'Copied!'; + setTimeout(() => { btn.textContent = '↗ Share'; }, 2000); + }); + } + }); + } + + // ── Profile modal ───────────────────────────────────────────────────────── + + function initProfileModal() { + document.getElementById('profile-close-btn').addEventListener('click', () => { + document.getElementById('profile-modal').classList.remove('active'); + }); + } + + async function showProfile(username) { + document.getElementById('profile-username').textContent = username; + document.getElementById('profile-xp').textContent = '...'; + document.getElementById('profile-streak').textContent = '...'; + document.getElementById('profile-longest').textContent = '...'; + document.getElementById('profile-rank').innerHTML = ''; + document.getElementById('profile-modal').classList.add('active'); + + const data = await DB.getUserProfileByUsername(username); + if (!data) return; + + const rank = getRankForXP(data.total_xp ?? 0); + document.getElementById('profile-xp').textContent = data.total_xp ?? 0; + document.getElementById('profile-streak').textContent = data.current_streak ?? 0; + document.getElementById('profile-longest').textContent = data.longest_streak ?? 0; + document.getElementById('profile-rank').innerHTML = + `${rank.icon} ${rank.name}`; + } + // ── Submit Problem ──────────────────────────────────────────────────────── function initSubmitProblem() { @@ -907,6 +999,8 @@ const App = (() => { initServiceWorker(); initHistory(); initSubmitProblem(); + initShare(); + initProfileModal(); updateTimeSectionVisibility(); updateRankBadge(getTotalXP()); refreshBest(); diff --git a/js/sound.js b/js/sound.js index 987f989..ee0a6f2 100644 --- a/js/sound.js +++ b/js/sound.js @@ -67,10 +67,15 @@ const Sound = (() => { } } + function gameStart() { + if (!enabled) return; + vibrate([80, 40, 80, 40, 160]); + } + function toggle() { enabled = !enabled; return enabled; } - return { correct, wrong, streakMilestone, countdown, toggle }; + return { correct, wrong, streakMilestone, countdown, gameStart, toggle }; })(); diff --git a/js/ui.js b/js/ui.js index 083859f..c71dadb 100644 --- a/js/ui.js +++ b/js/ui.js @@ -166,22 +166,48 @@ const UI = (() => { list.innerHTML = 'No games yet.
'; return; } - list.innerHTML = entries.map(e => { + list.innerHTML = entries.map((e, i) => { const date = new Date(e.ts).toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' }); const mode = MODE_LABEL[e.mode] ?? e.mode; const diff = DIFF_LABEL[e.diff] ?? ''; const elapsed = e.mode === 'sprint' ? ` · ${e.elapsed}s` : ''; const total = e.correct + e.wrong; const acc = total > 0 ? Math.round((e.correct / total) * 100) : 0; + + const qaHtml = e.questions && e.questions.length + ? `