import gradio as gr
import os

# Function to show HTML content using an iframe
def show_html_in_iframe(page_idx, html_files, curr_split):
    # Construct the URL using the selected index
    url = f'https://wmtis.s3.eu-west-1.amazonaws.com/{curr_split}/{html_files[page_idx]}'
    iframe_html = f'<iframe src="{url}" width="100%" height="1000"></iframe>'
    return iframe_html

# Example lists of HTML files for 'test' and 'dev' instances
train_html_files = [f for f in os.listdir(os.path.join("html_files", "train")) if f.endswith('.html')]
dev_html_files = [f for f in os.listdir(os.path.join("html_files", "dev")) if f.endswith('.html')]

# Function to return the appropriate list based on instance type
def get_html_files_list(instance_type):
    return train_html_files if instance_type == 'train' else dev_html_files


with gr.Blocks() as demo:
    with gr.Row():
        instance_type_dropdown = gr.Dropdown(choices=['train', 'dev'], label='Instance Type')
        slider = gr.Slider(minimum=0, step=1, label='Data Instance')

    # Dynamic update of slider based on instance type
    def update_slider_options(instance_type):
        html_files = get_html_files_list(instance_type)
        slider.update(options=list(range(len(html_files))))
        return len(html_files) - 1  # Return maximum index as new value for slider

    # Link dropdown change to updating slider options
    instance_type_dropdown.change(fn=update_slider_options, inputs=instance_type_dropdown, outputs=slider)


    # Create the Gradio interface
    slider.release(show_html_in_iframe, inputs=[slider, html_files, instance_type_dropdown], outputs=[gr.HTML()], api_name="HTML Viewer with Event Listeners")

# Display the interface
demo.launch()