import os

import gradio as gr
from dotenv import load_dotenv
load_dotenv()


html = '''
<button id="my_btn" onclick="click_text()">Hello</button>
'''

# script = '''
# function test(){
#     let script = document.createElement('script');
#     script.innerHTML = "function click_text(){alert('click')}";
#     document.head.appendChild(script);   
# }
# '''
script = '''
import G6 from '@antv/g6';
function click_text(){
    const button = document.querySelector("#my_btn");
    button.addEventListener("click", e => {
        alert("Clicked")
    })
}
'''


demo = gr.Blocks(js = script)

with demo:
    gr.HTML(html)
    # demo.load( js = script)
    
if __name__ == "__main__":
    demo.launch( 
        server_name="0.0.0.0",
        server_port=int(os.environ.get("PORT")),
        auth=( os.environ.get("USER_NAME"), os.environ.get("PASSWORD"))
    )

    # block.close()