// Get references to HTML elements
const uploadButton = document.getElementById("upload-button");
const imageUpload = document.getElementById("image-upload");
const resultsOutput = document.getElementById("results-output");

// Function to handle image upload
function handleImageUpload() {
    const file = imageUpload.files[0];
    if (!file) {
        alert("Please select an image file.");
        return;
    }

    // Create a FormData object to send the image file to the server
    const formData = new FormData();
    formData.append("file", file);

    // Send the image to the server using fetch
    fetch("/", {
        method: "POST",
        body: formData,
    })
        // .then((response) => response.json())
        // .then((data) => {
        //     // Display the results in the resultsOutput element
        //     resultsOutput.innerHTML = "<h2>Results</h2>";
        //     for (const key in data) {
        //         if (data.hasOwnProperty(key)) {
        //             resultsOutput.innerHTML += `<p>${key}: ${data[key]}</p>`;
        //         }
        //     }
        // })
        .catch((error) => {
            console.error("Error uploading image:", error);
            alert("Error uploading image. Please try again.");
        });
}

// Add a click event listener to the upload button
uploadButton.addEventListener("click", handleImageUpload);