document.getElementById('uploadForm').addEventListener('submit', async function (event) {
    event.preventDefault();

    const formData = new FormData();
    const imageInput = document.getElementById('imageInput').files[0];

    if (!imageInput) {
        alert("Please select an image to upload.");
        return;
    }

    formData.append('image', imageInput);

    try {
        const response = await fetch('https://api.nevets.tech/igformatter/upload', {
            method: 'POST',
            body: formData
        });

        if (!response.ok) {
            throw new Error('Image upload failed');
        }

        const arrayBuffer = await response.arrayBuffer();
        downloadImage(arrayBuffer, imageInput.value);

    } catch (error) {
        console.error('Error:', error);
        alert('There was an error processing your image.');
    }
});

function downloadImage(arrayBuffer, fileName) {
    const blob = new Blob([arrayBuffer], { type: "image/png" });
    const cardElement = document.getElementById("card");

    let urlCreator = window.URL || window.webkitURL;
    cardElement.href = urlCreator.createObjectURL(blob);
    cardElement.style.display = 'unset';
    cardElement.download = fileName + ".png";
    cardElement.click();
}