133 lines
5.6 KiB
HTML
133 lines
5.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Timer Leaderboard</title>
|
|
<link rel="icon" type="image/x-icon" href="/pictures/favicon.ico">
|
|
<script src="/js/page-tracking.js"></script>
|
|
<link rel="stylesheet" href="/css/leaderboard.css">
|
|
</head>
|
|
<body>
|
|
<!-- Notification Bubble -->
|
|
<div class="notification-bubble" id="notificationBubble">
|
|
<div class="notification-content">
|
|
<div class="notification-icon">🏁</div>
|
|
<div class="notification-text">
|
|
<div class="notification-title" id="notificationTitle">Neue Zeit!</div>
|
|
<div class="notification-subtitle" id="notificationSubtitle">Ein neuer Rekord wurde erstellt</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="main-container">
|
|
<!-- Admin Login Button -->
|
|
<a href="/login" class="admin-login-btn" id="adminLoginBtn">🔐 Login</a>
|
|
<a href="/dashboard" class="dashboard-btn" id="dashboardBtn" style="display: none;">📊 Dashboard</a>
|
|
<button class="logout-btn" id="logoutBtn" onclick="logout()" style="display: none;">🚪 Logout</button>
|
|
|
|
<div class="header-section">
|
|
<h1 class="main-title">NINJACROSS LEADERBOARD</h1>
|
|
<p class="tagline">Die ultimative NinjaCross-Rangliste</p>
|
|
</div>
|
|
|
|
<div class="dashboard-grid">
|
|
<div class="control-panel">
|
|
<div class="control-group">
|
|
<label class="control-label">Standort</label>
|
|
<div class="location-control">
|
|
<select class="custom-select location-select" id="locationSelect">
|
|
<option value="all">🌍 Alle Standorte</option>
|
|
<!-- Standorte werden dynamisch geladen -->
|
|
</select>
|
|
<button class="location-btn" id="findLocationBtn" onclick="findNearestLocation()" title="Nächstgelegenen Standort finden">
|
|
📍 Mein Standort
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="control-group">
|
|
<label class="control-label">Zeitraum</label>
|
|
<div class="time-tabs">
|
|
<button class="time-tab" data-period="today">
|
|
<span class="tab-icon">📅</span>
|
|
<span class="tab-text">Heute</span>
|
|
</button>
|
|
<button class="time-tab" data-period="week">
|
|
<span class="tab-icon">📊</span>
|
|
<span class="tab-text">Diese Woche</span>
|
|
</button>
|
|
<button class="time-tab" data-period="month">
|
|
<span class="tab-icon">📈</span>
|
|
<span class="tab-text">Dieser Monat</span>
|
|
</button>
|
|
<button class="time-tab active" data-period="all">
|
|
<span class="tab-icon">♾️</span>
|
|
<span class="tab-text">Alle Zeiten</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="refresh-btn pulse-animation" onclick="loadData()">
|
|
⚡ Live Update
|
|
</button>
|
|
</div>
|
|
|
|
<div class="stats-panel">
|
|
<div class="stats-grid">
|
|
<div class="stat-card">
|
|
<div class="stat-value" id="totalPlayers">0</div>
|
|
<div class="stat-label">Teilnehmer</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value" id="bestTime">--:--</div>
|
|
<div class="stat-label">Rekordzeit</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-value" id="totalRecords">0</div>
|
|
<div class="stat-label">Läufe</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="leaderboard-container">
|
|
<div class="leaderboard-header">
|
|
<div class="active-filters" id="currentSelection">
|
|
🌍 Alle Standorte • ♾️ Alle Zeiten
|
|
</div>
|
|
<div class="last-sync" id="lastUpdated">
|
|
Letzter Sync: Loading...
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rankings-list" id="rankingList">
|
|
<!-- Rankings werden hier eingefügt -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="footer-content">
|
|
<div class="footer-links">
|
|
<a href="/impressum.html" class="footer-link">Impressum</a>
|
|
<a href="/datenschutz.html" class="footer-link">Datenschutz</a>
|
|
<button id="cookie-settings-footer" class="footer-link cookie-settings-btn">Cookie-Einstellungen</button>
|
|
</div>
|
|
<div class="footer-text">
|
|
<p>© 2024 NinjaCross. Alle Rechte vorbehalten.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- External Libraries -->
|
|
<script src="https://unpkg.com/@supabase/supabase-js@2"></script>
|
|
<script src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script>
|
|
|
|
<!-- Application JavaScript -->
|
|
<script src="/js/cookie-consent.js"></script>
|
|
<script src="/js/leaderboard.js"></script>
|
|
</body>
|
|
</html>
|