import gradio as gr
from datetime import datetime
from PIL import Image
import flag
import os

from libretranslatepy import LibreTranslateAPI
lt = LibreTranslateAPI("https://translate.argosopentech.com/")


stable_diffusion = gr.Blocks.load(name="spaces/stabilityai/stable-diffusion")
### ————————————————————————————————————————

title="Any Text to Stable Diffusion"


def get_translation(text):
  lang_detected = lt.detect(text)[0]['language']
  print(lang_detected)
  english_translated = lt.translate(text, lang_detected, "en")
  print(english_translated)
  return english_translated

def get_images(prompt):
    prompt_t = get_translation(prompt)
    gallery_dir = stable_diffusion(prompt_t, fn_index=2)
    return [os.path.join(gallery_dir, img) for img in os.listdir(gallery_dir)]

css = """
        .container {
            max-width: 880px;
            margin: auto;
            padding-top: 1.5rem;
        }
        a {
            text-decoration: underline;
        }
        h1 {
            font-weight: 900; 
            margin-bottom: 7px;
            text-align: center;
            font-size: 2em;
            margin-bottom: 1em;
        }
        #w2sd_container{
            margin-top: 20px;
        }
        .footer {
            margin-bottom: 45px;
            margin-top: 35px;
            text-align: center;
            border-bottom: 1px solid #e5e5e5;
        }
        .footer>p {
            font-size: .8rem;
            display: inline-block;
            padding: 0 10px;
            transform: translateY(10px);
            background: white;
        }
        .dark .footer {
            border-color: #303030;
        }
        .dark .footer>p {
            background: #0b0f19;
        }
        .tabitem {
            border-bottom-left-radius: 10px;
            border-bottom-right-radius: 10px;
        }
        #record_tab, #upload_tab {
            font-size: 1.2em;
        }
        #record_btn{
            
        }
        #record_btn > div > button > span {
            width: 2.375rem;
            height: 2.375rem;
        }
        #record_btn > div > button > span > span {
            width: 2.375rem;
            height: 2.375rem;
        }
        audio {
            margin-bottom: 10px;
        }
        div#record_btn > .mt-6{
            margin-top: 0!important;
        }
        div#record_btn > .mt-6 button {
            font-size: 2em;
            width: 100%;
            padding: 20px;
            height: 160px;
        }
        div#upload_area {
            height: 11.1rem;
        }
        div#upload_area > div.w-full > div {
            min-height: 9rem;
        }
        #check_btn_1, #check_btn_2{
            color: #fff;
            --tw-gradient-from: #4caf50;
            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
            --tw-gradient-to: #4caf50;
            border-color: #8bc34a;
        }
        #magic_btn_1, #magic_btn_2{
            color: #fff;
            --tw-gradient-from: #f44336;
            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
            --tw-gradient-to: #ff9800;
            border-color: #ff9800;
        }
        input::-webkit-inner-spin-button, input::-webkit-outer-spin-button {
            -webkit-appearance: none;
        }
        input[type=number] {
            -moz-appearance: textfield;
        }
        input[type=range] {
            -webkit-appearance: none;
            cursor: pointer;
            height: 1px;
            background: currentColor;
        }
        input[type=range]::-webkit-slider-thumb {
            -webkit-appearance: none;
            width: 0.5em;
            height: 1.2em;
            border-radius: 10px;
            background: currentColor;
        }
        input[type=range]::-moz-range-thumb{
            width: 0.5em;
            height: 1.2em;
            border-radius: 10px;
            background: currentColor;
        }
        div#spoken_lang textarea {
            font-size: 4em;
            line-height: 1em;
            text-align: center;
        }
        div#transcripted {
            flex: 4;
        }
        div#translated textarea {
            font-size: 1.5em;
            line-height: 1.25em;
        }
        #sd_settings {
            margin-bottom: 20px;
        }
        #diffuse_btn {
            color: #fff;
            font-size: 1em;
            margin-bottom: 20px;
            --tw-gradient-from: #4caf50;
            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
            --tw-gradient-to: #4caf50;
            border-color: #8bc34a;
        }
        #translate_btn {
            color: #fff;
            font-size: 1em;
            margin-bottom: 20px;
            --tw-gradient-from: #4caf50;
            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
            --tw-gradient-to: #4caf50;
            border-color: #8bc34a;
        }
        #notice {
            padding: 20px 14px 10px;
            display: flex;
            align-content: space-evenly;
            gap: 20px;
            line-height: 1em;
            font-size: .8em;
            border: 1px solid #374151;
            border-radius: 10px;
        }
        #about {
            padding: 20px;
        }
        #notice > div {
            flex: 1;
        }
        
"""   

### ————————————————————————————————————————
 
with gr.Blocks(css=css) as demo:
    with gr.Column():
        gr.HTML('''
            <h1>
                Any Text to Stable Diffusion
            </h1>
            <p style='text-align: center;'>
                Ask stable diffusion in any language !
            </p>
            
            <p style='text-align: center;'>
                This demo is connected to StableDiffusion Space • Offered by ddiddi <br />
            </p>
    
        ''')

                
     
        with gr.Accordion(label="Stable Diffusion Settings", elem_id="sd_settings", visible=False):
            with gr.Row():
                guidance_scale = gr.Slider(2, 15, value = 7, label = 'Guidance Scale')
                nb_iterations = gr.Slider(10, 50, value = 25, step = 1, label = 'Steps')
                seed = gr.Slider(label = "Seed", minimum = 0, maximum = 2147483647, step = 1, randomize = True)
        
        gr.Markdown(
            """
            ## 1. Enter prompt
            Here are some examples: \n
            Доброе утро \t
            おはようございます \t
            शुभ प्रभात \t
            Good morning
            """
            

        )
        
        with gr.Row():
         
            enter_prompt = gr.Textbox(
                                    label="Enter prompt", 
                                    lines=3,
                                    elem_id="transcript"
                                )
    
        with gr.Column():
            translated_output = gr.Textbox(
                                    label="in English", 
                                    lines=3,
                                    elem_id="translated"
                                )
            with gr.Row():
                clear_btn = gr.Button(value="Clear")
                translate_btn = gr.Button(value="Translate", elem_id="translate_btn")
                diffuse_btn = gr.Button(value="Translate >> SD!", elem_id="diffuse_btn")
                
                clear_btn.click(fn=lambda value: gr.update(value=""), inputs=clear_btn, outputs=translated_output)
    
                
                    
#            with gr.Column():
                
                
                    
        gr.Markdown("""
            ## 3. Stable Diffusion Results 
            Inference time is about ~30-40 seconds
            """
            ) 
        
        sd_output = gr.Gallery().style(grid=2, height="auto")
                
                
        gr.Markdown("""
            ### 📌 Resources
          
            </p>
            <p style='font-size: 1em;line-height: 1.5em;'>
            <strong>Stable Diffusion</strong> is a state of the art text-to-image model that generates images from text.
            </p>
            <div id="notice">
                <div>
                LICENSE 
                <p style='font-size: 0.8em;'> 
                The model is licensed with a <a href="https://huggingface.co/spaces/CompVis/stable-diffusion-license" target="_blank">CreativeML Open RAIL-M</a> license.</p>
                <p style='font-size: 0.8em;'>  
                The authors claim no rights on the outputs you generate, you are free to use them and are accountable for their use which must not go against the provisions set in this license.</p>
                <p style='font-size: 0.8em;'>  
                The license forbids you from sharing any content that violates any laws, produce any harm to a person, disseminate any personal information that would be meant for harm, spread misinformation and target vulnerable groups.</p>
                <p style='font-size: 0.8em;'>  
                For the full list of restrictions please <a href="https://huggingface.co/spaces/CompVis/stable-diffusion-license" target="_blank" target="_blank">read the license</a>.
                 </p>
                 </div>
                 <div>
                 Biases and content acknowledgment
                 <p style='font-size: 0.8em;'>
                 Despite how impressive being able to turn text into image is, beware to the fact that this model may output content that reinforces or exacerbates societal biases, as well as realistic faces, pornography and violence.</p>
                <p style='font-size: 0.8em;'>  
                The model was trained on the <a href="https://laion.ai/blog/laion-5b/" target="_blank">LAION-5B dataset</a>, which scraped non-curated image-text-pairs from the internet (the exception being the removal of illegal content) and is meant for research purposes.</p>
                <p style='font-size: 0.8em;'>  You can read more in the <a href="https://huggingface.co/CompVis/stable-diffusion-v1-4" target="_blank">model card</a>.
                 </p>
                 </div>
             </div>
    
        """, elem_id="about")
                
        
        diffuse_btn.click(get_images, 
                              inputs = [
                                  enter_prompt
                                  ], 
                              outputs = sd_output
                          )
        
        translate_btn.click(get_translation, 
                              inputs = [
                                  enter_prompt
                                  ], 
                              outputs = translated_output
                          )

    
if __name__ == "__main__":
    demo.launch()