import gradio as gr


# Handy constants
PHOTOPEA_MAIN_URL = "https://pixlr.com/kr/e/#editor"
PHOTOPEA_MAIN_URLS = "https://www.photopea.com/"
PHOTOPEA_IFRAME_ID = "workspace"
PHOTOPEA_IFRAME_HEIGHT = 768
PHOTOPEA_IFRAME_WIDTH = "100%"
PHOTOPEA_IFRAME_LOADED_EVENT = "onPhotopeaLoaded"
#https://www.photopea.com/
def get_photopea_url_params():
    return "#%7B%22resources%22:%5B%22data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIAAQMAAADOtka5AAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAANQTFRF////p8QbyAAAADZJREFUeJztwQEBAAAAgiD/r25IQAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAfBuCAAAB0niJ8AAAAABJRU5ErkJggg==%22%5D%7D"



with gr.Blocks(theme="derekzen/stardust",title="[ Free Web ] Photoshop") as demo:
    with gr.Tab("pixlr"):
        
        with gr.Row():
            # Add an iframe with Photopea directly in the tab.
            gr.HTML(
                f"""
                    <iframe class="iframe" id='{PHOTOPEA_IFRAME_ID}'
                        src = '{PHOTOPEA_MAIN_URL}'
                        width = '{PHOTOPEA_IFRAME_WIDTH}'
                        height = '{PHOTOPEA_IFRAME_HEIGHT}'
                        onload = '{PHOTOPEA_IFRAME_LOADED_EVENT}(this)'>
                """
            )
        # with gr.Row():
        #     gr.HTML(f"""

        #     <div>만든이 : sang_eo_.</div>
            
        #     """)
    with gr.Tab("Photopea"):
        
        with gr.Row():
            # Add an iframe with Photopea directly in the tab.
            gr.HTML(
                f"""
                    <iframe class="iframe" id='{PHOTOPEA_IFRAME_ID}'
                        src = '{PHOTOPEA_MAIN_URLS}{get_photopea_url_params()}'
                        width = '{PHOTOPEA_IFRAME_WIDTH}'
                        height = '{PHOTOPEA_IFRAME_HEIGHT}'
                        onload = '{PHOTOPEA_IFRAME_LOADED_EVENT}(this)'>
                """
            )
        # with gr.Row():
        #     gr.HTML(f"""

        #     <div>만든이 : sang_eo_.</div>
            
        #     """)

demo.launch()