Update app.py

app.py

@@ -15,6 +15,11 @@ IMG_SIZE = 512
 
 print(f"Running on: {device}")
 
+
+# === AUDIO-URL ===
+AUDIO_URL = "https://dn721801.ca.archive.org/0/items/emotional-soft-piano-music-413513-2/emotional-soft-piano-music-413513%202.mp3"
+
+
 # === TEXT INTEGRATION IMPORT ===
 from text_integration import (
     add_text_to_image, 
@@ -190,8 +195,17 @@ def update_live_preview(image, bbox_x1, bbox_y1, bbox_x2, bbox_y2, face_preserve
     
     return create_preview_image(image, bbox_coords, face_preserve, mode_color)
 
+# === AUDIO-FUNKTION ===
+def play_audio_on_image_click():
+    """Startet die Musikwiedergabe bei Klick auf das Bild"""
+    print("🎵 Musikwiedergabe wird gestartet...")
+    return gr.Audio(AUDIO_URL, autoplay=True, visible=True, label="Hintergrundmusik")
 
-
+# === NEUE FUNKTION: STOP AUDIO BEIM TAB-WECHSEL ===
+def stop_audio_on_tab_change():
+    """Stoppt die Musik beim Tab-Wechsel"""
+    print("🔇 Musik wird beim Tab-Wechsel gestoppt")
+    return None
 
 def process_image_upload(image):
     """Verarbeitet Bild-Upload und gibt Bild + Koordinaten zurück"""
@@ -377,7 +391,7 @@ def main_ui():
         <div style="font-size: 1.2em; font-weight: bold; color: #4F46E5; margin-bottom: 15px;"><strong>🎯 Projekt & Kompetenzen</strong></div>
         Dieses 4-Wochen-Projekt ist ein kleines <strong>Demo</strong> um meine zentralen Kompetenzen als <strong>AI-Engineer</strong> – sowohl in der technischen Umsetzung <br>
         als auch in der strukturierten Entwicklung komplexer Workflows zu präsentieren. Es bildet <strong>grundlegende Stable-Diffusion-Prozesse</strong> ab, während ich in anderen <br>
-        GPU-basierten Umgebungen <strong>erweiterte Text-to-Image und Image-to-Image-Pipelines mit präzisem Inpainting über ControlNet</strong> realisiere. Durch den Einsatz von <br>
+        GPU-basierten Umgebungen <strong>erweitered Text-to-Image und Image-to-Image-Pipelines mit präzisem Inpainting über ControlNet</strong> realisiere. Durch den Einsatz von <br>
         <strong>multi-modalen Modellen mit höherer Parameteranzahl</strong> wird eine deutlich detailliertere und kontrolliertere Bildgenerierung ermöglicht.
         </div>
         <br>
@@ -432,6 +446,10 @@ def main_ui():
         &nbsp;&nbsp;2. Gezielte Transformation über <strong>Bild-zu-Bild</strong><br>
         &nbsp;&nbsp;3. Optionale Textintegration auf generierten oder originalen Basis-Bildern<br>
 
+        <strong>Audio-Unterstützung:</strong><br>
+        Im Arbeitsbereich Text-zu-Bild steht eine <strong>Hintergrundmusik-Funktion</strong> zur Verfügung, die die Generierungszeit überbrückt. Der integrierte Audio-Player <br>
+        wird beim Tab-Wechsel unterbrochen.<br>
+
         <strong>Die Textintegration </strong> ist verfügbar für generierte Bilder in beiden Arbeitsbereichen sowie für externe Bildquellen im Arbeitsbereich Bild zu Bild.<br>
         Es werden alle gängigen Bildformate (JPG, PNG, WEBP, BMP, TIFF) unterstützt. Die maximale Dateigröße beträgt 15 MB.
         </div>
@@ -472,7 +490,7 @@ def main_ui():
         with gr.Column(visible=False) as content_area:
             
             # === TAB: TEXT ZU BILD ===
-            with gr.Tab("Text zu Bild"):
+            with gr.Tab("Text zu Bild") as tab_text_to_image:
                 gr.Markdown("**Beschreibe dein gewünschtes Bild:**")
                 
                 with gr.Row():
@@ -514,6 +532,30 @@ def main_ui():
                             height=400,
                             sources=[] #Button verschwinden, download trotzdem möglich! Gradio-Problem
                         )
+                        
+
+                # SICHTBARER AUDIO-PLAYER FÜR TEXT-ZU-BILD
+                hidden_audio_t2i = gr.Audio(
+                    visible=True, 
+                    label="🎵 Hintergrundmusik zur Überbrückung der Wartezeit", 
+                    autoplay=True  # WICHTIG: Hier autoplay setzen
+                )
+
+
+                # Klickbarer Bereich um das Bild
+                with gr.Row():
+                    music_btn = gr.Button(
+                        "🎵 Musik abspielen",
+                        variant="secondary",
+                        size="sm"
+                )
+
+                # Klick-Event für den Button
+                music_btn.click(
+                    fn=play_audio_on_image_click,
+                    outputs=hidden_audio_t2i
+                )
+                
                 
                 # TEXT INTEGRATION UNTERHALB DER BILDER
                 with gr.Row():
@@ -623,7 +665,7 @@ def main_ui():
                 )
 
             # === TAB: BILD ZU BILD ===
-            with gr.Tab("Bild zu Bild"):
+            with gr.Tab("Bild zu Bild") as tab_image_to_image:
                 gr.Markdown("**Lade ein Bild hoch und beschreibe die gewünschte Veränderung:**")
                 
                 with gr.Row():
@@ -841,6 +883,12 @@ def main_ui():
                     outputs=[img_input, img_output]
                 )
 
+            # === NEUER EVENT-HANDLER: STOP AUDIO BEIM TAB-WECHSEL ===
+            tab_image_to_image.select(
+                fn=stop_audio_on_tab_change,
+                outputs=hidden_audio_t2i
+            )
+
         # === START-BUTTON HANDLER ===
         info_components = [child for child in demo.children if child != content_area]