#!/usr/bin/env python

import pathlib

import gradio as gr


def set_example_image(example):
    return [
        gr.Image.update(value=example[0]),
        gr.Image.update(value=example[1])
    ]


def set_example_video(example):
    return [
        gr.Video.update(value=example[0]),
        gr.Video.update(value=example[1])
    ]


css = '''
div#image1 {
  max-width: 300px;
  max-height: 300px;
}
div#image2 {
  max-width: 300px;
  max-height: 300px;
}
div#video1 {
  max-width: 300px;
  max-height: 300px;
}
div#video2 {
  max-width: 300px;
  max-height: 300px;
}
'''

with gr.Blocks(css=css) as demo:
    with gr.Row():
        image1 = gr.Image(label='without gr.Group',
                          type='numpy',
                          elem_id='image1')
        with gr.Group():
            image2 = gr.Image(label='with gr.Group',
                              type='numpy',
                              elem_id='image2')

    paths = sorted(pathlib.Path('images').rglob('*.jpg'))
    example_images = gr.Dataset(components=[image1, image2],
                                samples=[[path.as_posix(),
                                          path.as_posix()] for path in paths])

    with gr.Row():
        video1 = gr.Video(label='without gr.Group',
                          format='mp4',
                          elem_id='video1')
        with gr.Group():
            video2 = gr.Video(label='with gr.Group',
                              format='mp4',
                              elem_id='video2')

    paths = sorted(pathlib.Path('videos').rglob('*.mp4'))
    example_videos = gr.Dataset(components=[video1, video2],
                                samples=[[path.as_posix(),
                                          path.as_posix()] for path in paths])

    example_images.click(fn=set_example_image,
                         inputs=example_images,
                         outputs=example_images.components)
    example_videos.click(fn=set_example_video,
                         inputs=example_videos,
                         outputs=example_videos.components)

demo.launch()