Upload 2 files

app.py

@@ -0,0 +1,261 @@
+import spaces
+import gradio as gr
+import edge_tts
+import asyncio
+import tempfile
+import os
+import re
+
+# Get all available voices
+async def get_voices():
+    voices = await edge_tts.list_voices()
+    return {f"{v['ShortName']} - {v['Locale']} ({v['Gender']})": v['ShortName'] for v in voices}
+
+# Split text into sentences for interactive clicking
+def split_text_into_segments(text):
+    # Split by sentences, keeping punctuation
+    segments = re.split(r'([.!?]+)', text)
+    result = []
+    current_segment = ""
+    
+    for i, segment in enumerate(segments):
+        if segment.strip():
+            if re.match(r'^[.!?]+$', segment):
+                current_segment += segment
+                if current_segment.strip():
+                    result.append(current_segment.strip())
+                current_segment = ""
+            else:
+                current_segment += segment
+    
+    if current_segment.strip():
+        result.append(current_segment.strip())
+    
+    return [seg for seg in result if seg.strip()]
+
+# Create interactive HTML with clickable text segments
+def create_interactive_text(text):
+    if not text.strip():
+        return ""
+    
+    segments = split_text_into_segments(text)
+    html_parts = []
+    
+    html_parts.append("""
+    <div id="interactive-text" style="line-height: 1.8; font-size: 16px; padding: 20px; border: 1px solid #ddd; border-radius: 8px; background: #f9f9f9;">
+        <p style="margin-bottom: 15px; font-weight: bold; color: #555;">Click on any part of the text to start playback from that position:</p>
+    """)
+    
+    for i, segment in enumerate(segments):
+        html_parts.append(
+            f'<span class="text-segment" data-index="{i}" style="cursor: pointer; padding: 2px 4px; margin: 1px; border-radius: 3px; transition: background-color 0.2s;" '
+            f'onmouseover="this.style.backgroundColor=\'#e3f2fd\'" '
+            f'onmouseout="this.style.backgroundColor=\'transparent\'" '
+            f'onclick="playFromSegment({i})">{segment} </span>'
+        )
+    
+    html_parts.append("""
+    </div>
+    <script>
+        let currentSegments = [];
+        let currentSettings = {};
+        
+        function updateSegments(segments, voice, rate, pitch) {
+            currentSegments = segments;
+            currentSettings = {voice: voice, rate: rate, pitch: pitch};
+        }
+        
+        async function playFromSegment(startIndex) {
+            if (!currentSegments || currentSegments.length === 0) {
+                alert('Please generate the full audio first to enable interactive playback.');
+                return;
+            }
+            
+            // Highlight clicked segment
+            const segments = document.querySelectorAll('.text-segment');
+            segments.forEach(s => s.style.backgroundColor = 'transparent');
+            segments[startIndex].style.backgroundColor = '#bbdefb';
+            
+            // Get text from selected segment onwards
+            const textFromSegment = currentSegments.slice(startIndex).join(' ');
+            
+            // Trigger partial audio generation
+            const event = new CustomEvent('playFromSegment', {
+                detail: {
+                    text: textFromSegment,
+                    voice: currentSettings.voice,
+                    rate: currentSettings.rate,
+                    pitch: currentSettings.pitch,
+                    startIndex: startIndex
+                }
+            });
+            document.dispatchEvent(event);
+        }
+    </script>
+    """)
+    
+    return ''.join(html_parts)
+
+# Text-to-speech function
+async def text_to_speech(text, voice, rate, pitch):
+    if not text.strip():
+        return None, gr.Warning("Please enter text to convert.")
+    if not voice:
+        return None, gr.Warning("Please select a voice.")
+    
+    voice_short_name = voice.split(" - ")[0]
+    rate_str = f"{rate:+d}%"
+    pitch_str = f"{pitch:+d}Hz"
+    communicate = edge_tts.Communicate(text, voice_short_name, rate=rate_str, pitch=pitch_str)
+    with tempfile.NamedTemporaryFile(delete=False, suffix=".mp3") as tmp_file:
+        tmp_path = tmp_file.name
+        await communicate.save(tmp_path)
+    return tmp_path, None
+
+# Gradio interface function for full text
+@spaces.GPU
+def tts_interface(text, voice, rate, pitch):
+    audio, warning = asyncio.run(text_to_speech(text, voice, rate, pitch))
+    
+    # Create interactive text display
+    interactive_html = create_interactive_text(text)
+    
+    # Prepare segments for JavaScript
+    segments = split_text_into_segments(text) if text.strip() else []
+    
+    # Add JavaScript to update segments
+    if segments:
+        interactive_html += f"""
+        <script>
+            setTimeout(() => {{
+                updateSegments({segments}, '{voice}', {rate}, {pitch});
+            }}, 100);
+        </script>
+        """
+    
+    return audio, interactive_html, warning
+
+# Gradio interface function for partial text (from clicked segment)
+@spaces.GPU
+def tts_partial_interface(text, voice, rate, pitch):
+    if not text or not voice:
+        return None, gr.Warning("Missing text or voice selection.")
+    
+    audio, warning = asyncio.run(text_to_speech(text, voice, rate, pitch))
+    return audio, warning
+
+# Create Gradio application
+async def create_demo():
+    voices = await get_voices()
+    
+    description = """
+    Experience the power of Voicecloning.be for text-to-speech conversion with interactive text playback.
+    
+    **How to use:**
+    1. Enter your text and select voice settings
+    2. Click "Generate Full Audio" to create the complete audio
+    3. Click on any part of the displayed text to start playback from that position
+    """
+    
+    with gr.Blocks(title="Interactive Text-to-Speech", theme=gr.themes.Soft()) as demo:
+        gr.Markdown("# 🎤 Interactive Text-to-Speech")
+        gr.Markdown(description)
+        
+        with gr.Row():
+            with gr.Column(scale=2):
+                text_input = gr.Textbox(
+                    label="Input Text", 
+                    lines=8, 
+                    placeholder="Enter the text you want to convert to speech..."
+                )
+                
+                with gr.Row():
+                    voice_dropdown = gr.Dropdown(
+                        choices=[""] + list(voices.keys()), 
+                        label="Select Voice", 
+                        value=""
+                    )
+                
+                with gr.Row():
+                    rate_slider = gr.Slider(
+                        minimum=-50, 
+                        maximum=50, 
+                        value=0, 
+                        label="Speech Rate (%)", 
+                        step=1
+                    )
+                    pitch_slider = gr.Slider(
+                        minimum=-20, 
+                        maximum=20, 
+                        value=0, 
+                        label="Pitch (Hz)", 
+                        step=1
+                    )
+                
+                generate_btn = gr.Button(
+                    "🎵 Generate Full Audio", 
+                    variant="primary", 
+                    size="lg"
+                )
+            
+            with gr.Column(scale=2):
+                full_audio_output = gr.Audio(
+                    label="🔊 Full Audio", 
+                    type="filepath"
+                )
+                partial_audio_output = gr.Audio(
+                    label="🎯 Partial Audio (from clicked position)", 
+                    type="filepath"
+                )
+        
+        # Interactive text display
+        interactive_text_display = gr.HTML(
+            label="📝 Interactive Text (Click to play from position)",
+            value="<p style='color: #666; font-style: italic;'>Generate audio first to see interactive text here...</p>"
+        )
+        
+        # Warning display
+        warning_display = gr.Markdown(visible=False)
+        
+        # Hidden components for partial audio generation
+        partial_text = gr.Textbox(visible=False)
+        partial_voice = gr.Textbox(visible=False)
+        partial_rate = gr.Number(visible=False)
+        partial_pitch = gr.Number(visible=False)
+        
+        # Event handlers
+        generate_btn.click(
+            fn=tts_interface,
+            inputs=[text_input, voice_dropdown, rate_slider, pitch_slider],
+            outputs=[full_audio_output, interactive_text_display, warning_display]
+        )
+        
+        # JavaScript to handle segment clicks
+        demo.load(js="""
+        function setupInteractiveText() {
+            document.addEventListener('playFromSegment', async function(e) {
+                const detail = e.detail;
+                
+                // Update hidden inputs
+                const partialTextInput = document.querySelector('textarea[data-testid="textbox"]').parentElement.parentElement.parentElement.querySelector('textarea');
+                const partialVoiceInput = document.querySelector('input[type="text"]');
+                
+                // Trigger partial audio generation through Gradio
+                // This is a simplified approach - in a full implementation, you'd need to properly integrate with Gradio's state management system
+                console.log('Playing from segment:', detail.startIndex);
+                console.log('Text:', detail.text);
+                
+                // For now, show an alert with the functionality
+                alert(`Playing from segment ${detail.startIndex + 1}:\\n\\n"${detail.text.substring(0, 100)}${detail.text.length > 100 ? '...' : ''}"`);
+            });
+        }
+        
+        setTimeout(setupInteractiveText, 1000);
+        """)
+    
+    return demo
+
+# Run the application
+if __name__ == "__main__":
+    demo = asyncio.run(create_demo())
+    demo.launch()

requirements.txt

@@ -0,0 +1,2 @@
+edge_tts==6.1.12
+gradio==4.36.1