import gradio as gr
import sys
sys.path.append("scripts/")
from lib import init, refresh_character_thumb_image, get_prompt_manager
from lib import TITLE

if __name__ == '__main__':
    character_list, character_list_cn, LANG, JAVA_SCRIPT, CSS_SCRIPT = init()
    
    with gr.Blocks(js=JAVA_SCRIPT, css=CSS_SCRIPT, title=TITLE) as ui:
        with gr.Row():
            character1 = gr.Dropdown(
                choices=character_list,
                label=LANG["character1"],
                value='none',
                allow_custom_value=False,
            )
            
            character2 = gr.Dropdown(
                choices=character_list,
                label=LANG["character2"],
                value='none',
                allow_custom_value=False,
            )
                            
            character3 = gr.Dropdown(
                choices=character_list_cn,
                label=LANG["character3"],
                value='none',
                allow_custom_value=False,
            )                    
            
            dummy_dropdown = gr.Dropdown(visible=False, allow_custom_value=True)
            dummy_textbox = gr.Textbox(visible=False)
            
        with gr.Row(elem_classes='main_row'):            
            with gr.Column(elem_classes='column_prompts'):
                thumb_image = gr.Gallery(type="pil", columns=3, show_download_button=False, object_fit='contain', label="Thumb")    
                output_info = gr.Textbox(label="Characters' Info")
        with gr.Row():            
            with gr.Column():
                custom_prompt = gr.Textbox(value='', label='Semi-auto tag complete test. Try tag* *tag *tag* (e621_sfw.csv@DominikDoom)', elem_id="custom_prompt_text") 
            with gr.Column():
                gr.Markdown("<h2><span style=\"color:orangered\">Thumb Image create by waiNSFWIllustrious_v120.safetensors with ComfyUI</span></h2>",)
                gr.Markdown(f"<a href='https://github.com/mirabarukaso/character_select_stand_alone_app'>Character Select SAA</a>")            
            
        character1.change(fn=refresh_character_thumb_image,
                          inputs=[character1,character2,character3],
                          outputs=[thumb_image, output_info])
        character2.change(fn=refresh_character_thumb_image,
                          inputs=[character1,character2,character3],
                          outputs=[thumb_image, output_info])
        character3.change(fn=refresh_character_thumb_image,
                          inputs=[character1,character2,character3],
                          outputs=[thumb_image, output_info])
        
        # Prompt Auto Complete JS
        # Have to use dummy components
        # Use custom_prompt, the stupid js console will always report "api_info.ts:423  Too many arguments provided for the endpoint."
        dummy_textbox.change(fn=get_prompt_manager().update_suggestions_js, inputs=[dummy_textbox], outputs=[dummy_dropdown])
        
    ui.launch(server_name='0.0.0.0')