Pausenmodus beim Start und blinkendes Pause-Symbol implementiert

- Training startet immer im Pausenmodus (bei Neustart und Lektionswechsel)
- Play-Symbol (Dreieck) blinkt im Sekundenrhythmus während Pause
- Metronom stoppt automatisch bei Lektionswechsel
- Session-Status wird korrekt im Pausenmodus gesetzt

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

app.py

@@ -415,7 +415,9 @@ def train():
         total_elapsed_time = session.get('total_elapsed_time', 0)
         net_training_time = session.get('net_training_time', 0)
         key_stroke_count = session.get('key_stroke_count', 0)
-        is_paused = session.get('is_paused', False)
+        # Starte immer im Pausenmodus
+        is_paused = True
+        session['is_paused'] = True
         
         return render_template('index.html',
                              current_text=current_text,
@@ -685,16 +687,20 @@ def next_text():
         progress.last_text = ""
 
         db.session.commit()
-        
+
+        # Setze Session in Pausenmodus
+        session['is_paused'] = True
+
         # Bestimme den Titel der neuen Lektion
         new_lesson = lessons[progress.current_text_index]
         lesson_title = new_lesson.get('title', f"Lektion {progress.current_text_index + 1}")
-        
+
         return jsonify({
             'text': new_lesson['text'],
             'index': progress.current_text_index,
             'total': len(lessons),
-            'title': lesson_title
+            'title': lesson_title,
+            'is_paused': True
         })
 
     except Exception as e:
@@ -723,14 +729,18 @@ def set_lesson():
         progress.last_text = ""
 
         db.session.commit()
-        
+
+        # Setze Session in Pausenmodus
+        session['is_paused'] = True
+
         # Bestimme den Titel der neuen Lektion
         new_lesson = lessons[lesson_index]
         lesson_title = new_lesson.get('title', f"Lektion {lesson_index + 1}")
-        
+
         return jsonify({
             'text': new_lesson['text'],
-            'title': lesson_title
+            'title': lesson_title,
+            'is_paused': True
         })
 
     except Exception as e:

static/css/style.css

@@ -44,6 +44,23 @@ body {
     }
 }
 
+/* Animation für blinkendes Pause-Symbol (Play-Icon) */
+@keyframes pauseBlink {
+    0%, 49% {
+        opacity: 1;
+    }
+    50%, 99% {
+        opacity: 0.3;
+    }
+    100% {
+        opacity: 1;
+    }
+}
+
+.pause-blink {
+    animation: pauseBlink 1s infinite;
+}
+
 /* Dark Theme Anpassungen für Cursor */
 [data-bs-theme="dark"] .cursor-char::after {
     background-color: #0cf;

static/js/main.js

@@ -478,14 +478,17 @@ class TypewriterApp {
             this.currentCharIndex = 0;
             this.userInput = '';
             this.sessionManager.reset();
-            this.sessionManager.resume();
+            this.sessionManager.pause();
+
+            // Stoppe Metronom
+            this.metronomePlayer.stop();
 
             this.textDisplayManager.updateText(this.fullText);
             this.textDisplayManager.resetScroll();
 
             this.uiManager.updateLessonTitle(data.title);
             this.uiManager.updateLessonHighlight(data.index);
-            this.uiManager.showPause();
+            this.uiManager.showPlay();
 
             this.updateDisplay();
             this.updateStatistics();
@@ -505,14 +508,17 @@ class TypewriterApp {
             this.currentCharIndex = 0;
             this.userInput = '';
             this.sessionManager.reset();
-            this.sessionManager.resume();
+            this.sessionManager.pause();
+
+            // Stoppe Metronom
+            this.metronomePlayer.stop();
 
             this.textDisplayManager.updateText(this.fullText);
             this.textDisplayManager.resetScroll();
 
             this.uiManager.updateLessonTitle(data.title);
             this.uiManager.updateLessonHighlight(lessonIndex);
-            this.uiManager.showPause();
+            this.uiManager.showPlay();
 
             this.updateDisplay();
             this.updateStatistics();

static/js/ui.js

@@ -96,16 +96,28 @@ export class UIManager {
      * Show pause icon (playing state)
      */
     showPause() {
-        if (this.playPausePause) this.playPausePause.style.display = 'block';
-        if (this.playPausePlay) this.playPausePlay.style.display = 'none';
+        if (this.playPausePause) {
+            this.playPausePause.style.display = 'block';
+            this.playPausePause.classList.remove('pause-blink');
+        }
+        if (this.playPausePlay) {
+            this.playPausePlay.style.display = 'none';
+            this.playPausePlay.classList.remove('pause-blink');
+        }
     }
 
     /**
-     * Show play icon (paused state)
+     * Show play icon (paused state) - with blinking animation
      */
     showPlay() {
-        if (this.playPausePause) this.playPausePause.style.display = 'none';
-        if (this.playPausePlay) this.playPausePlay.style.display = 'block';
+        if (this.playPausePause) {
+            this.playPausePause.style.display = 'none';
+            this.playPausePause.classList.remove('pause-blink');
+        }
+        if (this.playPausePlay) {
+            this.playPausePlay.style.display = 'block';
+            this.playPausePlay.classList.add('pause-blink');
+        }
     }
 
     /**