Spaces:
Running
Running
import gradio as gr | |
from jinja2 import Environment, FileSystemLoader | |
_ENV = Environment(loader=FileSystemLoader("app/assets/jinja-templates")) | |
_IMAGE_TEMPLATE = _ENV.get_template("image.j2") | |
from .visualizer_functions import render_image, toggle_navigation_button, activate_left_button, activate_right_button, right_button_click, left_button_click, update_image_caption | |
with gr.Blocks() as visualizer: | |
gr.Markdown( | |
"π The image to the below shows where Dawsonia found text in the image." | |
) | |
with gr.Row(): | |
# Annotated image panel | |
with gr.Column(scale=1): | |
image = gr.HTML( | |
label="Annotated image", | |
padding=False, | |
elem_classes="svg-image", | |
container=True, | |
min_height="40vh", | |
max_height="50vh", | |
show_label=True, | |
) | |
image_caption = gr.Markdown(elem_classes="button-group-viz") | |
with gr.Row(elem_classes="button-group-viz"): | |
left = gr.Button( | |
"β Previous", visible=False, interactive=False, scale=0 | |
) | |
right = gr.Button("Next β", visible=False, scale=0) | |
collection = gr.State() | |
current_page_index = gr.State(0) | |
# Wiring of navigation buttons | |
left.click(left_button_click, current_page_index, current_page_index) | |
right.click( | |
right_button_click, [collection, current_page_index], current_page_index | |
) | |
# Updates on collection change: | |
# - update the view | |
# - reset the page index (always start on page 0) | |
# - toggle visibility of navigation buttons (don't show them for single pages) | |
# - update the image caption | |
collection.change( | |
render_image, inputs=[collection, current_page_index], outputs=image | |
) | |
collection.change(lambda _: 0, current_page_index, current_page_index) | |
collection.change(toggle_navigation_button, collection, left) | |
collection.change(toggle_navigation_button, collection, right) | |
collection.change( | |
update_image_caption, | |
inputs=[collection, current_page_index], | |
outputs=image_caption, | |
) | |
# Updates on page change: | |
# - update the view | |
# - activate/deactivate buttons | |
# - update the image caption | |
current_page_index.change( | |
render_image, inputs=[collection, current_page_index], outputs=image | |
) | |
current_page_index.change(activate_left_button, current_page_index, left) | |
current_page_index.change( | |
activate_right_button, [collection, current_page_index], right | |
) | |
current_page_index.change( | |
update_image_caption, | |
inputs=[collection, current_page_index], | |
outputs=image_caption, | |
) | |