Lane difficulty added

This commit is contained in:
Carsten Graf
2025-09-11 13:56:07 +02:00
parent 3aac843736
commit 4f0fc68d41
7 changed files with 279 additions and 1 deletions

View File

@@ -101,6 +101,55 @@
</form>
</div>
<!-- Lane Configuration Section -->
<div class="section">
<h2>🏊‍♀️ Lane-Konfiguration</h2>
<form id="laneForm">
<div class="form-group">
<label>Lane-Typ auswählen:</label>
<div class="mode-toggle">
<button type="button" class="mode-button active" data-lane-type="identical" onclick="selectLaneType('identical')">
⚖️ Identische Lanes
</button>
<button type="button" class="mode-button" data-lane-type="different" onclick="selectLaneType('different')">
⚡ Unterschiedliche Lanes
</button>
</div>
</div>
<div id="laneDifficultySelection" class="lane-difficulty-selection" style="display: none;">
<div class="form-group">
<label>Lane 1 Schwierigkeit:</label>
<div class="mode-toggle">
<button type="button" class="mode-button active" data-lane="1" data-difficulty="light" onclick="selectLaneDifficulty(1, 'light')">
🟢 Leicht
</button>
<button type="button" class="mode-button" data-lane="1" data-difficulty="heavy" onclick="selectLaneDifficulty(1, 'heavy')">
🔴 Schwer
</button>
</div>
</div>
<div class="form-group">
<label>Lane 2 Schwierigkeit:</label>
<div class="mode-toggle">
<button type="button" class="mode-button active" data-lane="2" data-difficulty="light" onclick="selectLaneDifficulty(2, 'light')">
🟢 Leicht
</button>
<button type="button" class="mode-button" data-lane="2" data-difficulty="heavy" onclick="selectLaneDifficulty(2, 'heavy')">
🔴 Schwer
</button>
</div>
</div>
</div>
<div class="button-group">
<button type="submit" class="btn btn-primary">
💾 Lane-Konfiguration speichern
</button>
</div>
</form>
</div>
<!-- Basic Settings Section -->
<div class="section">
@@ -357,6 +406,7 @@
updateCurrentTimeDisplay();
loadWifiSettings();
loadMode();
loadLaneConfig();
};
// Aktuelle Zeit anzeigen (Live-Update)
@@ -554,6 +604,110 @@
});
}
// Lane Type selection function
function selectLaneType(type) {
// Remove active class from all lane type buttons
document.querySelectorAll('[data-lane-type]').forEach(button => {
button.classList.remove('active');
});
// Add active class to selected button
document.querySelector(`[data-lane-type="${type}"]`).classList.add('active');
// Show/hide lane difficulty selection
const difficultySelection = document.getElementById('laneDifficultySelection');
if (type === 'different') {
difficultySelection.style.display = 'block';
} else {
difficultySelection.style.display = 'none';
}
}
// Lane Difficulty selection function
function selectLaneDifficulty(lane, difficulty) {
// Remove active class from all buttons for this lane
document.querySelectorAll(`[data-lane="${lane}"]`).forEach(button => {
button.classList.remove('active');
});
// Add active class to selected button
document.querySelector(`[data-lane="${lane}"][data-difficulty="${difficulty}"]`).classList.add('active');
}
// Lane form handler
document.getElementById('laneForm').addEventListener('submit', function(e) {
e.preventDefault();
const activeLaneTypeButton = document.querySelector('[data-lane-type].active');
const laneType = activeLaneTypeButton ? activeLaneTypeButton.getAttribute('data-lane-type') : 'identical';
let laneConfig = {
type: laneType
};
if (laneType === 'different') {
const lane1Difficulty = document.querySelector('[data-lane="1"].active')?.getAttribute('data-difficulty') || 'light';
const lane2Difficulty = document.querySelector('[data-lane="2"].active')?.getAttribute('data-difficulty') || 'light';
laneConfig.lane1Difficulty = lane1Difficulty;
laneConfig.lane2Difficulty = lane2Difficulty;
}
fetch('/api/set-lane-config', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(laneConfig)
})
.then(response => response.json())
.then(data => {
if (data.success) {
showMessage('Lane-Schwierigkeits-Konfiguration erfolgreich gespeichert!', 'success');
} else {
showMessage('Fehler beim Speichern der Lane-Schwierigkeits-Konfiguration', 'error');
}
})
.catch(error => showMessage('Verbindungsfehler', 'error'));
});
function loadLaneConfig() {
fetch("/api/get-lane-config")
.then((response) => response.json())
.then((data) => {
const laneType = data.type || "identical";
const lane1Difficulty = data.lane1Difficulty || "light";
const lane2Difficulty = data.lane2Difficulty || "light";
// Set lane type
document.querySelectorAll('[data-lane-type]').forEach(button => {
button.classList.remove('active');
});
const laneTypeBtn = document.querySelector(`[data-lane-type="${laneType}"]`);
if (laneTypeBtn) laneTypeBtn.classList.add('active');
// Set lane difficulties
document.querySelectorAll('[data-lane]').forEach(button => {
button.classList.remove('active');
});
const lane1Btn = document.querySelector(`[data-lane="1"][data-difficulty="${lane1Difficulty}"]`);
const lane2Btn = document.querySelector(`[data-lane="2"][data-difficulty="${lane2Difficulty}"]`);
if (lane1Btn) lane1Btn.classList.add('active');
if (lane2Btn) lane2Btn.classList.add('active');
// Show/hide difficulty selection
const difficultySelection = document.getElementById('laneDifficultySelection');
if (laneType === 'different') {
difficultySelection.style.display = 'block';
} else {
difficultySelection.style.display = 'none';
}
})
.catch((error) => {
showMessage("Fehler beim Laden der Lane-Schwierigkeits-Konfiguration", "error");
});
}
// Einstellungen laden
function loadSettings() {