Metronom läuft, Steuerung über Lautsprecher
This commit is contained in:
parent
9ef38475ac
commit
f0cbb393e6
2 changed files with 55 additions and 65 deletions
|
|
@ -46,42 +46,20 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
let lines = fullText.split('\n');
|
||||
let userScrolled = false; // Flag für manuelles Scrollen
|
||||
|
||||
// Volume-Toggle initialisieren - Standardmäßig Ton an (nicht stumm)
|
||||
let metronomeMuted = false;
|
||||
// Volume-Toggle initialisieren - Steuert jetzt das Metronom
|
||||
// Standardmäßig ist das Metronom an (volume-2 angezeigt)
|
||||
let metronomeEnabled = true;
|
||||
const volumeOn = document.getElementById('volume-on');
|
||||
const volumeOff = document.getElementById('volume-off');
|
||||
// Initiale Anzeige: volume-2 anzeigen, volume-x verstecken
|
||||
volumeOn.style.display = 'block';
|
||||
volumeOff.style.display = 'none';
|
||||
|
||||
document.getElementById('volume-toggle').addEventListener('click', function() {
|
||||
metronomeMuted = !metronomeMuted;
|
||||
if (metronomeMuted) {
|
||||
volumeOn.style.display = 'none';
|
||||
volumeOff.style.display = 'block';
|
||||
} else {
|
||||
volumeOn.style.display = 'block';
|
||||
volumeOff.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// ErrorLock State - Standardmäßig geöffnet (errorLock = false)
|
||||
let errorLock = false;
|
||||
const lockClosed = document.getElementById('lock-closed');
|
||||
const lockOpen = document.getElementById('lock-open');
|
||||
// Initiale Anzeige: offenes Schloss anzeigen, geschlossenes verstecken
|
||||
lockClosed.style.display = 'none';
|
||||
lockOpen.style.display = 'block';
|
||||
|
||||
// Metronom State - Initialisierung mit Werten von Flask
|
||||
let metronomeEnabled = window.metronomeEnabled || false;
|
||||
// Metronom State - Initialisierung
|
||||
let metronomeInterval = null;
|
||||
let audioContext = null;
|
||||
let metronomeSound = window.metronomeSound || 'beep';
|
||||
let metronomeBPM = window.metronomeBPM || 60;
|
||||
const metronomeToggle = document.getElementById('metronome-toggle');
|
||||
const metronomeOn = document.getElementById('metronome-on');
|
||||
const metronomeOff = document.getElementById('metronome-off');
|
||||
|
||||
// Metronom-Funktionen
|
||||
function createBeepSound(vol, freq, duration) {
|
||||
|
|
@ -129,8 +107,8 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
}
|
||||
|
||||
function playMetronomeSound() {
|
||||
// Wenn der Ton stummgeschaltet ist, keinen Sound abspielen
|
||||
if (metronomeMuted) {
|
||||
// Wenn das Metronom ausgeschaltet ist, keinen Sound abspielen
|
||||
if (!metronomeEnabled) {
|
||||
// Aber visuelles Feedback trotzdem anzeigen
|
||||
const cursorElement = document.querySelector('.cursor-char');
|
||||
if (cursorElement) {
|
||||
|
|
@ -171,44 +149,23 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
metronomeInterval = null;
|
||||
}
|
||||
}
|
||||
|
||||
// Initialen Zustand des Metronom-Toggles setzen
|
||||
if (metronomeEnabled) {
|
||||
metronomeOn.style.display = 'block';
|
||||
metronomeOff.style.display = 'none';
|
||||
if (!isPaused) {
|
||||
startMetronome();
|
||||
}
|
||||
} else {
|
||||
metronomeOn.style.display = 'none';
|
||||
metronomeOff.style.display = 'block';
|
||||
|
||||
// Starte Metronom standardmäßig
|
||||
if (!isPaused) {
|
||||
startMetronome();
|
||||
}
|
||||
|
||||
// Lock-Toggle initialisieren
|
||||
document.getElementById('lock-toggle').addEventListener('click', function() {
|
||||
if (errorLock) {
|
||||
// Wechsel zu unlocked
|
||||
errorLock = false;
|
||||
lockClosed.style.display = 'none';
|
||||
lockOpen.style.display = 'block';
|
||||
} else {
|
||||
// Wechsel zu locked
|
||||
errorLock = true;
|
||||
lockClosed.style.display = 'block';
|
||||
lockOpen.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// Metronom-Toggle initialisieren
|
||||
metronomeToggle.addEventListener('click', function() {
|
||||
document.getElementById('volume-toggle').addEventListener('click', function() {
|
||||
metronomeEnabled = !metronomeEnabled;
|
||||
if (metronomeEnabled) {
|
||||
metronomeOn.style.display = 'block';
|
||||
metronomeOff.style.display = 'none';
|
||||
startMetronome();
|
||||
volumeOn.style.display = 'block';
|
||||
volumeOff.style.display = 'none';
|
||||
if (!isPaused) {
|
||||
startMetronome();
|
||||
}
|
||||
} else {
|
||||
metronomeOn.style.display = 'none';
|
||||
metronomeOff.style.display = 'block';
|
||||
volumeOn.style.display = 'none';
|
||||
volumeOff.style.display = 'block';
|
||||
stopMetronome();
|
||||
}
|
||||
// Einstellungen an Server senden
|
||||
|
|
@ -225,6 +182,30 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
});
|
||||
});
|
||||
|
||||
// ErrorLock State - Standardmäßig geöffnet (errorLock = false)
|
||||
let errorLock = false;
|
||||
const lockClosed = document.getElementById('lock-closed');
|
||||
const lockOpen = document.getElementById('lock-open');
|
||||
// Initiale Anzeige: offenes Schloss anzeigen, geschlossenes verstecken
|
||||
lockClosed.style.display = 'none';
|
||||
lockOpen.style.display = 'block';
|
||||
|
||||
|
||||
// Lock-Toggle initialisieren
|
||||
document.getElementById('lock-toggle').addEventListener('click', function() {
|
||||
if (errorLock) {
|
||||
// Wechsel zu unlocked
|
||||
errorLock = false;
|
||||
lockClosed.style.display = 'none';
|
||||
lockOpen.style.display = 'block';
|
||||
} else {
|
||||
// Wechsel zu locked
|
||||
errorLock = true;
|
||||
lockClosed.style.display = 'block';
|
||||
lockOpen.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// Play/Pause-Toggle initialisieren
|
||||
const playPauseToggle = document.getElementById('play-pause-toggle');
|
||||
if (playPauseToggle) {
|
||||
|
|
@ -292,6 +273,19 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
}
|
||||
return lines.length - 1;
|
||||
}
|
||||
|
||||
// Funktion zur Berechnung der Länge des korrekten Präfixes
|
||||
function getCorrectPrefixLength() {
|
||||
let correct = 0;
|
||||
for (let i = 0; i < userInput.length; i++) {
|
||||
if (i < fullText.length && userInput[i] === fullText[i]) {
|
||||
correct++;
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
return correct;
|
||||
}
|
||||
|
||||
// Zeige den Text an
|
||||
updateTextDisplay();
|
||||
|
|
|
|||
|
|
@ -34,10 +34,6 @@
|
|||
<i data-lucide="pause" id="play-pause-pause" style="width: 24px; height: 24px; position: absolute; top: 0; left: 0;"></i>
|
||||
<i data-lucide="play" id="play-pause-play" style="width: 24px; height: 24px; position: absolute; top: 0; left: 0; display: none;"></i>
|
||||
</div>
|
||||
<div id="metronome-toggle" style="width: 24px; height: 24px; cursor: pointer; position: relative;">
|
||||
<i data-lucide="metronome" id="metronome-on" style="width: 24px; height: 24px; position: absolute; top: 0; left: 0; display: none;"></i>
|
||||
<i data-lucide="circle" id="metronome-off" style="width: 24px; height: 24px; position: absolute; top: 0; left: 0;"></i>
|
||||
</div>
|
||||
<i data-lucide="help-circle" class="icon-placeholder" style="width: 24px; height: 24px; cursor: pointer;"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue