-
🏆 Leaderboard Sichtbarkeit
-
Bestimme, ob deine Zeiten im globalen Leaderboard angezeigt werden sollen.
+
🏆 Leaderboard Sichtbarkeit
+
Bestimme, ob deine Zeiten im globalen Leaderboard angezeigt werden sollen.
@@ -320,14 +328,14 @@
-
+
Hinweis: Wenn diese Option deaktiviert ist, werden deine Zeiten nur in deinem persönlichen Dashboard angezeigt, aber nicht im öffentlichen Leaderboard. Du kannst diese Einstellung jederzeit ändern.
- Einstellungen speichern
- Abbrechen
+ Einstellungen speichern
+ Abbrechen
@@ -337,12 +345,12 @@
diff --git a/public/index.html b/public/index.html
index fd1f6f2..3403b18 100644
--- a/public/index.html
+++ b/public/index.html
@@ -25,8 +25,8 @@
- 🇩🇪 Deutsch
- 🇺🇸 English
+ Deutsch
+ English
diff --git a/public/js/dashboard.js b/public/js/dashboard.js
index 66078cb..1510d49 100644
--- a/public/js/dashboard.js
+++ b/public/js/dashboard.js
@@ -7,6 +7,7 @@ const supabase = window.supabase.createClient(SUPABASE_URL, SUPABASE_ANON_KEY);
// Global variables
let currentUser = null;
+let currentLanguage = 'en'; // Default to English
// Check authentication and load dashboard
async function initDashboard() {
@@ -88,8 +89,123 @@ supabase.auth.onAuthStateChange((event, session) => {
}
});
+// Language Management
+function translateElement(element, language) {
+ if (element.dataset[language]) {
+ element.textContent = element.dataset[language];
+ }
+}
+
+// Change language function
+function changeLanguage() {
+ const languageSelect = document.getElementById('languageSelect');
+ currentLanguage = languageSelect.value;
+
+ // Save language preference
+ localStorage.setItem('ninjacross_language', currentLanguage);
+
+ // Update flag in select
+ updateLanguageFlag();
+
+ // Translate all elements with data attributes
+ const elementsToTranslate = document.querySelectorAll('[data-de][data-en]');
+ elementsToTranslate.forEach(element => {
+ translateElement(element, currentLanguage);
+ });
+
+ // Update dynamic content
+ updateDynamicContent();
+
+ console.log(`🌐 Language changed to: ${currentLanguage}`);
+}
+
+// Update flag in language selector
+function updateLanguageFlag() {
+ const languageSelect = document.getElementById('languageSelect');
+ if (languageSelect) {
+ if (currentLanguage === 'de') {
+ // German flag (black-red-gold)
+ languageSelect.style.backgroundImage = `url('data:image/svg+xml,
')`;
+ } else {
+ // USA flag
+ languageSelect.style.backgroundImage = `url('data:image/svg+xml,
')`;
+ }
+ }
+}
+
+// Update dynamic content that's not in HTML
+function updateDynamicContent() {
+ // Update achievement notifications
+ updateAchievementNotifications();
+
+ // Update time display formats
+ updateTimeDisplayFormats();
+
+ // Update achievement progress text
+ updateAchievementProgressText();
+
+ // Reload achievements if they're loaded
+ if (window.allAchievements && window.allAchievements.length > 0) {
+ displayAchievements();
+ }
+
+ // Reload times if they're loaded
+ if (document.getElementById('timesDisplay').style.display !== 'none') {
+ // Times are displayed, reload them
+ checkLinkStatusAndLoadTimes();
+ }
+}
+
+// Load saved language preference
+function loadLanguagePreference() {
+ const savedLanguage = localStorage.getItem('ninjacross_language');
+ if (savedLanguage && (savedLanguage === 'de' || savedLanguage === 'en')) {
+ currentLanguage = savedLanguage;
+ const languageSelect = document.getElementById('languageSelect');
+ if (languageSelect) {
+ languageSelect.value = currentLanguage;
+ // Update flag when loading
+ updateLanguageFlag();
+ }
+ }
+}
+
+// Update achievement notifications
+function updateAchievementNotifications() {
+ // This will be called when achievements are displayed
+}
+
+// Update time display formats
+function updateTimeDisplayFormats() {
+ // This will be called when times are displayed
+}
+
+// Update achievement progress text
+function updateAchievementProgressText() {
+ // This will be called when achievements are displayed
+}
+
+// Achievement translations are now handled by the database
+
+// Translate achievement data using database translations
+function translateAchievement(achievement) {
+ if (currentLanguage === 'en' && achievement.name_en) {
+ return {
+ ...achievement,
+ name: achievement.name_en,
+ description: achievement.description_en || achievement.description
+ };
+ }
+ return achievement;
+}
+
+
// Initialize dashboard when page loads
-initDashboard();
+document.addEventListener('DOMContentLoaded', function () {
+ loadLanguagePreference();
+ changeLanguage(); // Apply saved language
+ initDashboard();
+});
// Modal functions
function openModal(modalId) {
@@ -185,7 +301,10 @@ async function startQRScanner() {
} catch (error) {
console.error('Error accessing camera:', error);
- showMessage('rfidMessage', 'Kamera-Zugriff fehlgeschlagen. Bitte verwende die manuelle Eingabe.', 'error');
+ const cameraErrorMsg = currentLanguage === 'de' ?
+ 'Kamera-Zugriff fehlgeschlagen. Bitte verwende die manuelle Eingabe.' :
+ 'Camera access failed. Please use manual input.';
+ showMessage('rfidMessage', cameraErrorMsg, 'error');
}
}
@@ -265,21 +384,30 @@ async function handleQRCodeDetected(qrData) {
const rawUid = qrData.trim();
if (!rawUid) {
- showMessage('rfidMessage', 'QR-Code enthält keine gültige RFID UID', 'error');
+ const qrErrorMsg = currentLanguage === 'de' ?
+ 'QR-Code enthält keine gültige RFID UID' :
+ 'QR code contains no valid RFID UID';
+ showMessage('rfidMessage', qrErrorMsg, 'error');
return;
}
// Format the UID to match database format (XX:XX:XX:XX)
const formattedUid = formatRfidUid(rawUid);
- showMessage('rfidMessage', `QR-Code erkannt: ${rawUid} → ${formattedUid}`, 'info');
+ const qrDetectedMsg = currentLanguage === 'de' ?
+ `QR-Code erkannt: ${rawUid} → ${formattedUid}` :
+ `QR code detected: ${rawUid} → ${formattedUid}`;
+ showMessage('rfidMessage', qrDetectedMsg, 'info');
// Link the user using the formatted RFID UID
await linkUserByRfidUid(formattedUid);
} catch (error) {
console.error('Error formatting RFID UID:', error);
- showMessage('rfidMessage', `Fehler beim Formatieren der RFID UID: ${error.message}`, 'error');
+ const formatErrorMsg = currentLanguage === 'de' ?
+ `Fehler beim Formatieren der RFID UID: ${error.message}` :
+ `Error formatting RFID UID: ${error.message}`;
+ showMessage('rfidMessage', formatErrorMsg, 'error');
}
}
@@ -288,7 +416,10 @@ async function linkManualRfid() {
const rawUid = document.getElementById('manualRfidInput').value.trim();
if (!rawUid) {
- showMessage('rfidMessage', 'Bitte gib eine RFID UID ein', 'error');
+ const inputErrorMsg = currentLanguage === 'de' ?
+ 'Bitte gib eine RFID UID ein' :
+ 'Please enter a RFID UID';
+ showMessage('rfidMessage', inputErrorMsg, 'error');
return;
}
@@ -296,20 +427,29 @@ async function linkManualRfid() {
// Format the UID to match database format
const formattedUid = formatRfidUid(rawUid);
- showMessage('rfidMessage', `Formatiert: ${rawUid} → ${formattedUid}`, 'info');
+ const formattedMsg = currentLanguage === 'de' ?
+ `Formatiert: ${rawUid} → ${formattedUid}` :
+ `Formatted: ${rawUid} → ${formattedUid}`;
+ showMessage('rfidMessage', formattedMsg, 'info');
await linkUserByRfidUid(formattedUid);
} catch (error) {
console.error('Error formatting manual RFID UID:', error);
- showMessage('rfidMessage', `Fehler beim Formatieren: ${error.message}`, 'error');
+ const formatErrorMsg = currentLanguage === 'de' ?
+ `Fehler beim Formatieren: ${error.message}` :
+ `Error formatting: ${error.message}`;
+ showMessage('rfidMessage', formatErrorMsg, 'error');
}
}
// Link user by RFID UID (core function)
async function linkUserByRfidUid(rfidUid) {
if (!currentUser) {
- showMessage('rfidMessage', 'Benutzer nicht authentifiziert', 'error');
+ const authErrorMsg = currentLanguage === 'de' ?
+ 'Benutzer nicht authentifiziert' :
+ 'User not authenticated';
+ showMessage('rfidMessage', authErrorMsg, 'error');
return;
}
@@ -329,18 +469,27 @@ async function linkUserByRfidUid(rfidUid) {
const result = await response.json();
if (response.ok) {
- showMessage('rfidMessage', `✅ RFID erfolgreich verknüpft!\nSpieler: ${result.data.firstname} ${result.data.lastname}`, 'success');
+ const successMsg = currentLanguage === 'de' ?
+ `✅ RFID erfolgreich verknüpft!\nSpieler: ${result.data.firstname} ${result.data.lastname}` :
+ `✅ RFID successfully linked!\nPlayer: ${result.data.firstname} ${result.data.lastname}`;
+ showMessage('rfidMessage', successMsg, 'success');
setTimeout(() => {
closeModal('rfidModal');
// Reload times section after successful linking
checkLinkStatusAndLoadTimes();
}, 2000);
} else {
- showMessage('rfidMessage', result.message || 'Fehler beim Verknüpfen', 'error');
+ const errorMsg = currentLanguage === 'de' ?
+ result.message || 'Fehler beim Verknüpfen' :
+ result.message || 'Error linking';
+ showMessage('rfidMessage', errorMsg, 'error');
}
} catch (error) {
console.error('Error linking RFID:', error);
- showMessage('rfidMessage', 'Fehler beim Verknüpfen der RFID', 'error');
+ const linkErrorMsg = currentLanguage === 'de' ?
+ 'Fehler beim Verknüpfen der RFID' :
+ 'Error linking RFID';
+ showMessage('rfidMessage', linkErrorMsg, 'error');
}
}
@@ -349,6 +498,50 @@ function showTimesNotLinked() {
document.getElementById('timesLoading').style.display = 'none';
document.getElementById('timesNotLinked').style.display = 'block';
document.getElementById('timesDisplay').style.display = 'none';
+
+ // Update the text content for the not linked state
+ const notLinkedTitle = document.querySelector('#timesNotLinked h3');
+ const notLinkedDescription = document.querySelector('#timesNotLinked p');
+ const notLinkedButton = document.querySelector('#timesNotLinked button');
+ const notLinkedSteps = document.querySelectorAll('#timesNotLinked li');
+
+ if (notLinkedTitle) {
+ notLinkedTitle.textContent = currentLanguage === 'de' ?
+ 'RFID noch nicht verknüpft' :
+ 'RFID not linked yet';
+ }
+
+ if (notLinkedDescription) {
+ notLinkedDescription.textContent = currentLanguage === 'de' ?
+ 'Um deine persönlichen Zeiten zu sehen, musst du zuerst deine RFID-Karte mit deinem Account verknüpfen.' :
+ 'To see your personal times, you must first link your RFID card with your account.';
+ }
+
+ if (notLinkedButton) {
+ notLinkedButton.textContent = currentLanguage === 'de' ?
+ '🏷️ RFID jetzt verknüpfen' :
+ '🏷️ Link RFID now';
+ }
+
+ if (notLinkedSteps.length >= 3) {
+ notLinkedSteps[0].textContent = currentLanguage === 'de' ?
+ 'Klicke auf "RFID jetzt verknüpfen"' :
+ 'Click on "Link RFID now"';
+ notLinkedSteps[1].textContent = currentLanguage === 'de' ?
+ 'Scanne den QR-Code auf deiner RFID-Karte' :
+ 'Scan the QR code on your RFID card';
+ notLinkedSteps[2].textContent = currentLanguage === 'de' ?
+ 'Fertig! Deine Zeiten werden automatisch hier angezeigt' :
+ 'Done! Your times will be displayed here automatically';
+ }
+
+ // Update the "So funktioniert's" title
+ const howItWorksTitle = document.querySelector('#timesNotLinked h4');
+ if (howItWorksTitle) {
+ howItWorksTitle.textContent = currentLanguage === 'de' ?
+ 'So funktioniert\'s:' :
+ 'How it works:';
+ }
}
// Show loading state
@@ -356,6 +549,14 @@ function showTimesLoading() {
document.getElementById('timesLoading').style.display = 'block';
document.getElementById('timesNotLinked').style.display = 'none';
document.getElementById('timesDisplay').style.display = 'none';
+
+ // Update the loading text
+ const loadingText = document.querySelector('#timesLoading p');
+ if (loadingText) {
+ loadingText.textContent = currentLanguage === 'de' ?
+ 'Lade deine Zeiten...' :
+ 'Loading your times...';
+ }
}
// Load user times for the section
@@ -422,10 +623,15 @@ function displayUserTimes(times) {
const timesGrid = document.getElementById('userTimesGrid');
if (times.length === 0) {
+ const noTimesTitle = currentLanguage === 'de' ? 'Noch keine Zeiten aufgezeichnet' : 'No times recorded yet';
+ const noTimesDescription = currentLanguage === 'de' ?
+ 'Deine ersten Läufe werden hier angezeigt, sobald du sie abgeschlossen hast!' :
+ 'Your first runs will be displayed here as soon as you complete them!';
+
timesGrid.innerHTML = `
-
Noch keine Zeiten aufgezeichnet
-
Deine ersten Läufe werden hier angezeigt, sobald du sie abgeschlossen hast!
+
${noTimesTitle}
+
${noTimesDescription}
`;
return;
@@ -456,7 +662,7 @@ function displayUserTimes(times) {
let rankClass = '';
if (runIndex === 0) {
- rankBadge = '🥇 Beste';
+ rankBadge = currentLanguage === 'de' ? '🥇 Beste' : '🥇 Best';
rankClass = 'best';
} else if (runIndex === 1) {
rankBadge = '🥈 2.';
@@ -475,8 +681,8 @@ function displayUserTimes(times) {
${formatTime(run.recorded_time)}