Update app.py

app.py

@@ -1,52 +1,159 @@
+import gradio as gr
+import edge_tts
 import asyncio
-from pyglet import app, clock, textinput
-from microsoft_edge_tts import EdgeTTS
-
-async def generate_speech(text):
-    tts = EdgeTTS()
-    speech = await tts.speak_async(text)
-    return speech
-
-def handle_click(event):
-    global current_text, current_position
-    if event.button == 1:  # Left mouse button
-        current_position = event.x, event.y
-        print(f"Clicked at {current_position}")
-
-async def update_text():
-    global current_text, current_position
-    while True:
-        if current_text != original_text:
-            await generate_speech(current_text)
-            current_text = original_text
-        await asyncio.sleep(0.5)
-
-async def main():
-    global current_text, original_text
-    window = app.Window(width=800, height=600)
-
-    label = textinput.Label(
-        text="Click anywhere to start",
-        multiline=True,
-        width=700,
-        height=500,
-        x=50, y=50
-    )
-    window.add_handlers(label)
-    label.on_mouse_press = handle_click
+from typing import Optional
+import os
+
+# Global variables to manage playback
+current_playback_task = None
+current_position = 0
+stop_playback_flag = False
+
+async def text_to_speech(text: str, play_from: int = 0, voice: str = "en-US-GuyNeural") -> tuple[str, str]:
+    global current_playback_task, current_position, stop_playback_flag
+    
+    # Stop any ongoing playback
+    stop_playback()
+    
+    # Get only the text from the specified position
+    text_to_read = text[play_from:]
+    current_position = play_from
+    
+    # Create a new playback task
+    current_playback_task = asyncio.create_task(play_audio(text_to_read, voice))
+    
+    return text, f"Playing from position {play_from}..."
+
+async def play_audio(text: str, voice: str):
+    try:
+        communicate = edge_tts.Communicate(text, voice)
+        async for chunk in communicate.stream():
+            if stop_playback_flag:
+                break
+    except Exception as e:
+        print(f"Playback error: {e}")
+
+def stop_playback():
+    global current_playback_task, stop_playback_flag
+    if current_playback_task:
+        stop_playback_flag = True
+        current_playback_task.cancel()
+        stop_playback_flag = False
+
+def handle_word_click(word_index: int, text: str, voice: str) -> tuple[str, str]:
+    global current_position
+    
+    # Convert word index to character position
+    words = text.split()
+    if word_index < len(words):
+        # Find the character position of the clicked word
+        char_pos = 0
+        for i, word in enumerate(words):
+            if i == word_index:
+                break
+            char_pos += len(word) + 1  # +1 for the space
+        
+        # Start playback from this position
+        return asyncio.run(text_to_speech(text, char_pos, voice))
+    return text, "Invalid word selection"
+
+async def get_voices():
+    voices = await edge_tts.list_voices()
+    return [v["ShortName"] for v in voices if v["Locale"].startswith("en-")]
 
-    input_handler = textinput.TextInput()
-    window.add_handlers(input_handler)
-    input_handler.on_text_entry = lambda text: label.text = text
+# JavaScript for interactive text
+js = """
+function splitText(text) {
+    if (!text) return '';
+    const words = text.split(' ');
+    return words.map((word, index) => {
+        return `<span class="word" data-index="${index}" 
+                style="cursor:pointer; margin-right:5px;" 
+                onmouseover="this.style.backgroundColor='#f0f0f0'" 
+                onmouseout="this.style.backgroundColor='transparent'"
+                onclick="handleWordClick(this)">${word}</span>`;
+    }).join(' ');
+}
 
-    current_text = ""
-    original_text = ""
-    current_position = None
+function handleWordClick(element) {
+    const index = element.getAttribute('data-index');
+    document.getElementById('word-index').value = index;
+    document.getElementById('word-index').dispatchEvent(new Event('input'));
+}
 
-    clock.schedule_interval(update_text, 0.5)
+function updateTextDisplay(text) {
+    const container = document.getElementById('text-display');
+    container.innerHTML = splitText(text);
+}
 
-    async with window:
-        await app.run()
+document.addEventListener('DOMContentLoaded', function() {
+    // Update display when text changes
+    const textInput = document.querySelector('#text-input textarea');
+    if (textInput) {
+        textInput.addEventListener('input', function() {
+            updateTextDisplay(this.value);
+        });
+    }
+});
+"""
+
+css = """
+.word:hover { background-color: #f0f0f0; }
+#text-display { 
+    padding: 10px; 
+    border: 1px solid #ccc; 
+    border-radius: 5px; 
+    min-height: 100px;
+    white-space: pre-wrap;
+}
+"""
+
+with gr.Blocks(js=js, css=css) as demo:
+    gr.Markdown("# Interactive TTS Service (edge-tts)")
+    gr.Markdown("Enter text below and click 'Speak' to hear it. Click on any word to start playback from that point.")
+    
+    with gr.Row():
+        text_input = gr.Textbox(label="Input Text", lines=5, elem_id="text-input")
+        word_index = gr.Number(visible=False, elem_id="word-index")
+    
+    with gr.Row():
+        text_display = gr.HTML(elem_id="text-display")
+    
+    with gr.Row():
+        voice_dropdown = gr.Dropdown(label="Voice", choices=asyncio.run(get_voices()), value="en-US-GuyNeural")
+        rate_slider = gr.Slider(50, 200, value=100, label="Speed (%)")
+    
+    with gr.Row():
+        speak_btn = gr.Button("Speak", variant="primary")
+        stop_btn = gr.Button("Stop")
+    
+    status = gr.Textbox(label="Status", interactive=False)
+    
+    # Event handlers - updated syntax for Gradio 5.32.0
+    text_input.change(
+        lambda x: x,
+        inputs=text_input,
+        outputs=text_display,
+        js="(x) => { updateTextDisplay(x); return x; }"
+    )
+    
+    word_index.input(
+        handle_word_click,
+        inputs=[word_index, text_input, voice_dropdown],
+        outputs=[text_input, status]
+    )
+    
+    speak_btn.click(
+        lambda text, voice: asyncio.run(text_to_speech(text, 0, voice)),
+        inputs=[text_input, voice_dropdown],
+        outputs=[text_input, status]
+    )
+    
+    stop_btn.click(
+        stop_playback,
+        outputs=status,
+        js="() => { return 'Playback stopped'; }"
+    )
 
 if __name__ == "__main__":
-    asyncio.run(main())
+    demo.launch()