app.py

#Importing all the necessary libraries
import requests
import numpy as np
import pandas as pd
from io import BytesIO
import pickle

import gradio as gr
from PIL import Image as PILIMAGE
from IPython.display import Image
from IPython.core.display import HTML

from embedding_model import EmbeddingModel



# Load model
embed_model = EmbeddingModel()

# Load csv info data
imgs_info_df = pd.read_csv('15K Nocturna Valencia Banco Mediolanum_info.csv')

# Load embeddings data
with open('15K_Nocturna_Valencia_Banco_Mediolanum_embeddings.pkl', 'rb') as handle:
    embed_dict = pickle.load(handle)
    
img_names_list = list(embed_dict.keys())
img_embeddings_np = np.array(list(embed_dict.values()))



def find_best_matches(text_search, num_imgs=9):
    # Compute the similarity between the descrption and each photo using the Cosine similarity
    indexes = embed_model.get_similar_images_indexes(img_embeddings_np, text_search, n=num_imgs)
    target_img_filenames = [img_names_list[index] for index in indexes]
    target_urls = []
    for img_name in target_img_filenames:
        item = imgs_info_df[imgs_info_df['filename'] == img_name.rsplit('.', 1)[0]]
        target_urls.append(item['url'].values[0])
        
    matched_images = []
    for i, url in enumerate(target_urls):
        # Display the images
        response = requests.get(url + "?w=640")
        img = PILIMAGE.open(BytesIO(response.content))
        matched_images.append(img)
    
    return matched_images




# gr.Interface(fn=find_best_matches,
#                      inputs=[
#             gr.inputs.Textbox(lines=1, label="Text query", placeholder="Introduce the search text...",
#             )],
#             theme="grass",
#             outputs=gr.outputs.Carousel([gr.outputs.Image(type="pil")]), enable_queue=True, title="CLIP Image Search",
#         description="This application displays TOP THREE images from Unsplash dataset that best match the search query provided by the user. Moreover, the input can be provided via two modes ie text or image form.").launch()


iface = gr.Interface(
    title = "15K Nocturna valencia image search engine 📸",
    description = "Image search engine from a text input for the photo gallery of 15k Nocturna Valencia running race based on their semantic content.",
    article = "You find more information about this demo on my ✨ github repository [davertor](https://github.com/davertor/image-search-engine-for-flickr-photos-gallery)",
    fn=find_best_matches, 
    inputs=[
        gr.Textbox(
            lines=1,
            label="Write what you are looking for in an image...",
            placeholder="Text Here..."),
        gr.Slider(1, 9, step=1, value=3)
    ], 
    outputs=gr.Gallery().style(grid=[1], height="auto"),
    examples=[
        [("persons in the podium"), 3],
        [("a man with orange t-shirt"), 3], 
    ]
).launch()