import gradio as gr
import requests
import datadog_api_client
from PIL import Image

def face_crop(image, face_rect):
    x = face_rect.get('x')
    y = face_rect.get('y')
    width = face_rect.get('width')
    height = face_rect.get('height')


    if x < 0:
        x = 0
    if y < 0:
        y = 0
    if x + width >= image.width:
        width = image.width - x
    if y + height >= image.height:
        height = image.height - y

    face_image = image.crop((x, y, x + width - 1, y + height - 1))
    face_image_ratio = face_image.width / float(face_image.height)
    resized_w = int(face_image_ratio * 150)
    resized_h = 150

    face_image = face_image.resize((int(resized_w), int(resized_h)))
    return face_image

def compare_face(image1, image2):
    try:
        img_bytes1 = io.BytesIO()
        image1.save(img_bytes1, format="JPEG")
        img_bytes1.seek(0)
    except:
        return ["Failed to open image1", {"resultCode": "Failed to open image1"}]

    try:
        img_bytes2 = io.BytesIO()
        image2.save(img_bytes2, format="JPEG")
        img_bytes2.seek(0)
    except:
        return ["Failed to open image2", {"resultCode": "Failed to open image2"}]
    
    url = "http://127.0.0.1:8080/compare_face"
    files = {'image1': img_bytes1, 'image2': img_bytes2}
    result = requests.post(url=url, files=files)
    if result.ok:
        json_result = result.json()
        if json_result.get("resultCode") != "Ok":
            return [json_result.get("resultCode"), json_result]

        html = ""
        faces1 = json_result.get("faces1", {})
        faces2 = json_result.get("faces2", {})
        results = json_result.get("results", {})

        for result in results:
            score = result.get('score')
            face1_idx = result.get('face1')
            face2_idx = result.get('face2')

            face_image1 = face_crop(image1, faces1[face1_idx])
            face_value1 = ('<img src="data:image/png;base64,{base64_image}" style="width: 100px; height: auto; object-fit: contain;"/>').format(base64_image=pil_image_to_base64(face_image1, format="PNG"))

            face_image2 = face_crop(image2, faces2[face2_idx])
            face_value2 = ('<img src="data:image/png;base64,{base64_image}" style="width: 100px; height: auto; object-fit: contain;"/>').format(base64_image=pil_image_to_base64(face_image2, format="PNG"))

            match_icon = '<svg fill="red" width="19" height="32" viewBox="0 0 19 32"><path d="M0 13.92V10.2H19V13.92H0ZM0 21.64V17.92H19V21.64H0Z"></path><path d="M14.08 0H18.08L5.08 32H1.08L14.08 0Z"></path></svg>'
            if score > 0.7:
                match_icon = '<svg fill="green" width="19" height="32" viewBox="0 0 19 32"><path d="M0 13.9202V10.2002H19V13.9202H0ZM0 21.6402V17.9202H19V21.6402H0Z"></path></svg>'

            item_value = ('<div style="align-items: center; gap: 10px; display: flex; flex-direction: column;">'
                            '<div style="display: flex; align-items: center; gap: 20px;">'
                            '{face_value1}'
                            '{match_icon}'
                            '{face_value2}'
                            '</div>'
                            '<div style="text-align: center; margin-top: 10px;">'
                            'Score: {score}'
                            '</div>'
                            '</div>'
            ).format(face_value1=face_value1, face_value2=face_value2, match_icon=match_icon, score=f"{score:.2f}")
            html += item_value
            html += '<hr style="border: 1px solid #C0C0C0; margin: 10px 0;"/>'

        return html
    else:
        return result.text
        
with gr.Blocks(css=".gradio-container {background-color: #F4E5E0}") as demo:
    with gr.Row():
        with gr.Column(scale=7):
            with gr.Row():
                with gr.Column():
                    image_input1 = gr.Image(type='pil')
                    gr.Examples(['examples/1.webp', 'examples/2.webp', 'examples/3.webp', 'examples/4.webp'], 
                                inputs=image_input1)
                with gr.Column():
                    image_input2 = gr.Image(type='pil')
                    gr.Examples(['examples/5.webp', 'examples/6.webp', 'examples/7.webp', 'examples/8.webp'], 
                                inputs=image_input2)
            verifyThreshold = gr.Slider(minimum=0, maximum=1, value=0.67, label="Verify Threshold")    
            face_recog_button = gr.Button("Face Recognition")
        with gr.Column(scale=3):
            recog_html_output = gr.HTML()

    face_recog_button.click(compare_face, inputs=[image_input1, image_input2, verifyThreshold], outputs=recog_html_output)

demo.launch(server_name="0.0.0.0", server_port=7860)