import pandas as pd
import gradio as gr
 
df = pd.read_csv("liked_images.csv")
df['url'] = df['url'].apply(lambda x: '<a href= "' + str(x) + '" target="_blank"> <img src= "' + str(x) + '"/> </a>') #'<img src= "' + str(x) + '"/> </a>')
df['seed'] = df['seed'].apply(lambda x: str(x))
df['width'] = df['width'].apply(lambda x: str(x))
df['height'] = df['height'].apply(lambda x: str(x))
df['steps'] = df['steps'].apply(lambda x: str(x))
df['source'] = df['source'].apply(lambda x: str(x))
df = df[[ 'url', 'prompt', 'seed', 'width', 'height', 'steps', 'source']]

def display_df():
  df_images = df.head()
  return df_images

def display_next10(dataframe, end):
  start = (end  or dataframe.index[-1]) + 1
  end = start + 9
  df_images = df.loc[start:end]
  return df_images, end
  
#Gradio Blocks
with gr.Blocks() as demo:
  gr.Markdown("<h1><center>Utility Gradio Space for viewing PlaygroundAI Images</center></h1>")
  #gr.Markdown("""<img src='https://xxxxxxxx.jpg' class='center'> <br>  """) 
  gr.Markdown(
        """<div align="center">This Tool helps you to analyze and inspect the images and corresponding prompts from <a href = "https://playgroundai.com/">Playground AI</a> Images.<br><a href="https://twitter.com/Suhail">Suhail</a> has recently shared an open dataset of all the liked images and their prompts from PlaygroundAI on <a href="https://github.com/playgroundai/liked_images">Github here</a>. This is an attempt to explore this dataset beautifully using the power and flexibility of Gradio!<br><b>To use the tool:<br>First, click on the 'Initial' button, and then iteratively on the 'Next 10' button.<br><b>Bonus:</b>Click on images to get the original PlaygroundAI image displayed on next tab</div>""")

  with gr.Row():
    num_end = gr.Number(visible=False)
    b1 = gr.Button("Get Initial dataframe")
    b2 = gr.Button("Next 10 Rows")
    
  with gr.Row():
    out_dataframe = gr.Dataframe(wrap=True, max_rows=10, overflow_row_behaviour= "paginate", datatype = ["markdown", "markdown", "str", "str", "str", "str", "str", "str"])
    
  b1.click(fn=display_df, outputs=out_dataframe) 
  b2.click(fn=display_next10, inputs= [out_dataframe, num_end ], outputs=[out_dataframe, num_end])
  
demo.launch(debug=True, show_error=True)