diff --git a/public/css/dashboard.css b/public/css/dashboard.css index 110b3d7..56b0f6b 100644 --- a/public/css/dashboard.css +++ b/public/css/dashboard.css @@ -105,24 +105,97 @@ body { display: inline-block; } +/* ============================================================================ + NAVIGATION BUTTONS - COMPLETE REDESIGN + ============================================================================ */ + +/* Base button styles */ +.btn { + display: inline-flex; + align-items: center; + gap: 0.5rem; + padding: 0.75rem 1.5rem; + border: none; + border-radius: 0.5rem; + font-weight: 600; + font-size: 0.9rem; + text-decoration: none; + cursor: pointer; + transition: all 0.3s ease; + white-space: nowrap; +} + +/* Primary button (Dashboard) */ .btn-primary { - background: linear-gradient(135deg, #00d4ff, #0891b2); + background: #2563eb; color: white; } .btn-primary:hover { + background: #1d4ed8; transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(0, 212, 255, 0.3); + box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); } +/* Logout button */ .btn-logout { - background: linear-gradient(135deg, #dc3545, #c82333); + background: #dc2626; color: white; } .btn-logout:hover { + background: #b91c1c; transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(220, 53, 69, 0.3); + box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); +} + +/* Mobile navigation container */ +.mobile-nav-buttons { + display: flex; + gap: 1rem; + align-items: center; + justify-content: flex-end; + margin: 1rem 0; + flex-wrap: wrap; + position: absolute; + top: 1rem; + right: 1rem; +} + +/* Login button */ +.admin-login-btn { + background: #f59e0b; + color: white; +} + +.admin-login-btn:hover { + background: #d97706; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4); +} + +/* Dashboard button */ +.dashboard-btn { + background: #2563eb; + color: white; +} + +.dashboard-btn:hover { + background: #1d4ed8; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); +} + +/* Logout button */ +.logout-btn { + background: #dc2626; + color: white; +} + +.logout-btn:hover { + background: #b91c1c; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); } .dashboard-grid { diff --git a/public/css/leaderboard.css b/public/css/index.css similarity index 93% rename from public/css/leaderboard.css rename to public/css/index.css index 0f38426..05c5153 100644 --- a/public/css/leaderboard.css +++ b/public/css/index.css @@ -32,6 +32,70 @@ body { z-index: 1000; } +/* Mobile Navigation Buttons */ +.mobile-nav-buttons { + position: fixed; + top: 2rem; + right: 2rem; + display: flex; + gap: 1rem; + align-items: center; + z-index: 1000; +} + +.mobile-nav-buttons .admin-login-btn, +.mobile-nav-buttons .dashboard-btn, +.mobile-nav-buttons .logout-btn { + padding: 0.75rem 1.5rem; + border-radius: 0.5rem; + text-decoration: none; + font-weight: 600; + transition: all 0.3s ease; + border: none; + cursor: pointer; + display: inline-flex; + align-items: center; + gap: 0.5rem; + font-size: 0.9rem; +} + +.mobile-nav-buttons .admin-login-btn { + background: #f59e0b; + color: white; +} + +.mobile-nav-buttons .dashboard-btn { + background: #2563eb; + color: white; +} + +.mobile-nav-buttons .logout-btn { + background: #dc2626; + color: white; +} + +.mobile-nav-buttons .admin-login-btn:hover, +.mobile-nav-buttons .dashboard-btn:hover, +.mobile-nav-buttons .logout-btn:hover { + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); +} + +.mobile-nav-buttons .admin-login-btn:hover { + background: #d97706; + box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4); +} + +.mobile-nav-buttons .dashboard-btn:hover { + background: #1d4ed8; + box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); +} + +.mobile-nav-buttons .logout-btn:hover { + background: #b91c1c; + box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); +} + .language-selector select { padding: 0.5rem 1rem; background: rgba(15, 23, 42, 0.9); diff --git a/public/dashboard.html b/public/dashboard.html index 0e98516..4703ca7 100644 --- a/public/dashboard.html +++ b/public/dashboard.html @@ -6,6 +6,7 @@ SPEEDRUN ARENA - Admin Dashboard + diff --git a/public/index.html b/public/index.html index 3403b18..eb0c1e4 100644 --- a/public/index.html +++ b/public/index.html @@ -7,7 +7,7 @@ - + @@ -138,6 +138,6 @@ - + diff --git a/public/js/dashboard.js b/public/js/dashboard.js index 7e39f0a..512393f 100644 --- a/public/js/dashboard.js +++ b/public/js/dashboard.js @@ -34,7 +34,7 @@ async function initDashboard() { // User is authenticated, show dashboard if (session.user) { - console.log('User data:', session.user); + currentUser = session.user; displayUserInfo(session.user); } else { @@ -1041,6 +1041,8 @@ async function loadPlayerAchievements() { } const result = await response.json(); + + window.allAchievements = result.data; playerAchievements = result.data.filter(achievement => achievement.is_completed); @@ -1126,10 +1128,6 @@ function displayAchievements() { // Translate achievement const translatedAchievement = translateAchievement(achievement); - // Debug logging - if (achievement.name === 'Tageskönig') { - console.log('Tageskönig Debug:', { isCompleted, progress, earnedAt, completionCount }); - } let progressText = ''; if (isCompleted) { @@ -1155,6 +1153,7 @@ function displayAchievements() { const pointsText = currentLanguage === 'de' ? 'Punkte' : 'Points'; const totalPoints = completionCount > 0 ? achievement.points * completionCount : achievement.points; + return `
diff --git a/public/js/leaderboard.js b/public/js/index.js similarity index 100% rename from public/js/leaderboard.js rename to public/js/index.js diff --git a/public/pictures/icon-192.png b/public/pictures/icon-192.png new file mode 100644 index 0000000..556e396 Binary files /dev/null and b/public/pictures/icon-192.png differ diff --git a/routes/api.js b/routes/api.js index 74216a4..e26f0ba 100644 --- a/routes/api.js +++ b/routes/api.js @@ -3457,11 +3457,11 @@ router.get('/achievements/player/:playerId', async (req, res) => { MAX(pa.earned_at) as earned_at, COUNT(pa.id) as completion_count FROM achievements a - LEFT JOIN player_achievements pa ON a.id = pa.achievement_id AND pa.player_id = $1 AND pa.is_completed = true + LEFT JOIN player_achievements pa ON a.id = pa.achievement_id AND pa.player_id = $1 WHERE a.is_active = true GROUP BY a.id, a.name, a.name_en, a.description, a.description_en, a.category, a.icon, a.points ORDER BY - is_completed DESC, + COALESCE(COUNT(pa.id) > 0, false) DESC, a.category, a.points DESC `, [playerId]); @@ -3549,8 +3549,11 @@ router.post('/achievements/check/:playerId', async (req, res) => { }); } - // Run achievement check - await pool.query('SELECT check_all_achievements($1)', [playerId]); + // Run achievement check using AchievementSystem + const AchievementSystem = require('../lib/achievementSystem'); + const achievementSystem = new AchievementSystem(); + await achievementSystem.loadAchievements(); + const newAchievementsFromCheck = await achievementSystem.checkAllAchievements(playerId); // Get newly earned achievements const newAchievements = await pool.query(`