import streamlit as st
from io import BytesIO
import imageio.v3 as iio
import cv2
import os

def get_image_path(img):
    # Create a directory and save the uploaded image.
    file_path = f"data/uploadedImages/{img.name}"
    os.makedirs(os.path.dirname(file_path), exist_ok=True)
    with open(file_path, "wb") as img_file:
        img_file.write(img.getbuffer())
    return file_path

uploaded_file = st.file_uploader("**Upload a Chest X-Ray Image**", type= ['png', 'jpg'] )
if uploaded_file is not None:
    # Get actual image file
    bytes_data = get_image_path(uploaded_file)
    st.image(bytes_data)
    # ReSize
    item = cv2.resize(bytes_data,dsize=(224,224), interpolation=cv2.INTER_CUBIC)
    # ReScale Values
    item = item / 255

    
# Create a sidebar to display the list of uploaded files
uploaded_files = st.sidebar.empty()

# Use the file uploader to accept multiple files
files = st.file_uploader("Choose files", accept_multiple_files=True)

# Create a div to display the uploaded files
div = st.empty()

# Initialize a list to store the uploaded files
file_list = []

# Loop through the uploaded files and add them to the file list
for file in files:
    # Read the file as bytes
    bytes_data = file.read()

    # Add the file to the file list
    file_list.append(bytes_data)

    # Update the sidebar to display the list of uploaded files
    uploaded_files.write([file.name for file in files])

# Use HTML and CSS to style the div and move it around the screen
div.markdown("""
    <style>
        .sticky {
            position: fixed;
            bottom: 20px;
            right: 20px;
            padding: 10px;
            background-color: #f5f5f5;
            border: 1px solid #d3d3d3;
            border-radius: 4px;
            text-align: center;
            font-size: 18px;
            box-shadow: 2px 2px #888888;
        }
    </style>
""", unsafe_allow_html=True)

# Add the uploaded files to the div as an anchor tag with an image that opens in a new tab
if file_list:
    for file in file_list:
        url = "https://huggingface.co/spaces/awacke1/CardCrafter-CraftCustomCards"  # Replace with the URL to open when the image is clicked
        div.markdown(f'<a href="{url}" target="_blank"><img src="{file.name}" class="sticky"></a>', unsafe_allow_html=True)