app.py

import tempfile
import edge_tts
import gradio as gr

language_dict = {
    "English": {
        "Jenny": "en-US-JennyNeural",
        "Guy": "en-US-GuyNeural",
        "Ana": "en-US-AnaNeural",
        "Aria": "en-US-AriaNeural"
    },
    "Arabic": {
        "Hamed": "ar-SA-HamedNeural",
        "Zariyah": "ar-SA-ZariyahNeural",
        "Fatima": "ar-AE-FatimaNeural",
        "Hamdan": "ar-AE-HamdanNeural"
    }
}

async def text_to_speech_edge(text, language_code, speaker):
    voice = language_dict[language_code][speaker]
    communicate = edge_tts.Communicate(text, voice)
    with tempfile.NamedTemporaryFile(delete=False, suffix=".mp3") as tmp_file:
        tmp_path = tmp_file.name
        await communicate.save(tmp_path)

    return tmp_path

def get_speakers(language):
    speakers = list(language_dict[language].keys())[:4]  # Limit to 4 speakers
    return gr.Dropdown(choices=speakers, value=speakers[0], interactive=True)

default_language = None
default_speaker = None
css_style = """
    body {
        background-image: url('https://cdna.artstation.com/p/assets/images/images/074/776/904/large/pietro-chiovaro-r1-castle-chp.jpg?1712916847');
        background-size: cover;
        background-position: center;
        color: #fff;  /* General text color */
        font-family: 'Arial', sans-serif;
    }
    .title {
        text-align: center;
        font-size: 3.5em;
        margin: 20px 0;
        text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);
        color: #FFD700; /* Gold color for title */
    }
    .subtitle {
        text-align: center;
        font-size: 2.5em;
        color: #FFD700;
    }
    .output {
        margin-top: 20px;
        padding: 15px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.7); /* Dark background for output area */
    }
    /* Styling for the examples */
    .gr-examples {
        background-color: transparent !important; /* Transparent background */
        color: white; /* White text for examples */
        padding: 10px; /* Optional padding */
    }
    .gr-examples button {
        color: white !important; /* White text for buttons */
        background-color: transparent !important; /* Transparent background for buttons */
        border: 1px solid white; /* Add a white border to buttons */
    }
"""

examples = [ ["Once upon a time in a small village, there lived a kind-hearted girl named Ella. Every day, she would help her neighbors and spread joy wherever she went.", "English", "Jenny"],
            ["في قديم الزمان، كان هناك فتاة طيبة القلب تعيش في قرية صغيرة تُدعى ليلى. كانت ليلى تساعد جيرانها كل يوم وتنشر الفرح في كل مكان تذهب إليه.", "Arabic", "Hamed"] ]
        
with gr.Blocks(css = css_style) as demo:
    
    gr.HTML("<div class='title'> Storytelling</div>")
    gr.HTML("<div class='subtitle'>Bring your stories to life with captivating voices!</div>")
    
    with gr.Row():
        with gr.Column():
            input_text = gr.Textbox(lines=5, label="Input Text", placeholder="Enter the story you want to tell...")
            language = gr.Dropdown(
                choices=list(language_dict.keys()), value=default_language, label="Select Language", interactive=True
            )
            speaker = gr.Dropdown(choices=[], value=default_speaker, label="Choose a Speaker", interactive=False)
            run_btn = gr.Button(value="Generate Magical Audio", variant="primary")

        with gr.Column():
            output_audio = gr.Audio(type="filepath", label="Audio Output", elem_id="output_audio", elem_classes="output")
    
    with gr.Row():
        with gr.Column():
            gr.Markdown("### Example Prompts")
            gr.Examples(examples,
                        inputs=[input_text,language, speaker],
                        cache_examples=False)   
    language.change(get_speakers, inputs=[language], outputs=[speaker])
    run_btn.click(text_to_speech_edge, inputs=[input_text, language, speaker], outputs=[output_audio])

if __name__ == "__main__":
    demo.queue().launch(share=False)