// script.js
const apiUrl = 'http://fi4.bot-hosting.net:22869/api/image?prompt='; // Base URL của API

document.getElementById('apiForm').addEventListener('submit', async (e) => {
    e.preventDefault(); // Ngăn form gửi đi mặc định

    const promptInput = document.getElementById('promptInput').value; // Lấy giá trị prompt
    const loadingDiv = document.getElementById('loading'); // Hiển thị trạng thái loading
    const resultDiv = document.getElementById('result'); // Div hiển thị kết quả
    const errorMessage = document.getElementById('errorMessage');
    const generatedImage = document.getElementById('generatedImage');
    const downloadButton = document.getElementById('downloadButton'); // Nút download

    // Reset trạng thái
    loadingDiv.style.display = 'block';
    resultDiv.style.display = 'none';
    errorMessage.style.display = 'none';

    try {
        // Gửi request đến API
        const response = await fetch(`${apiUrl}${encodeURIComponent(promptInput)}`, {
            method: 'GET', // API sử dụng phương thức GET
        });

        if (!response.ok) {
            throw new Error(`API Error: ${response.status}`);
        }

        const data = await response.json(); // Parse kết quả JSON
        const imageUrl = data.image; // Lấy giá trị "image"

        // Hiển thị kết quả
        generatedImage.src = imageUrl;

        // Tải ảnh về
        const imageResponse = await fetch(imageUrl); // Fetch nội dung ảnh
        const imageBlob = await imageResponse.blob(); // Chuyển nội dung thành blob
        const blobUrl = URL.createObjectURL(imageBlob); // Tạo URL từ blob

        // Cập nhật nút download
        downloadButton.href = blobUrl;
        downloadButton.download = 'generated-image.png'; // Tên file khi tải về
        downloadButton.style.display = 'inline-block'; // Hiển thị nút download

        // Hiển thị URL và ảnh
        resultDiv.style.display = 'block';
    } catch (error) {
        // Hiển thị lỗi
        errorMessage.style.display = 'block';
        errorMessage.textContent = `Error: ${error.message}`;
    } finally {
        // Ẩn loading
        loadingDiv.style.display = 'none';
    }
});

// Nút Copy URL
document.getElementById('copyButton').addEventListener('click', () => {
    const imageUrl = document.getElementById('generatedImage').src;

    navigator.clipboard.writeText(imageUrl).then(() => {
        alert('Image URL copied to clipboard!');
    }).catch(() => {
        alert('Failed to copy URL.');
    });
});

document.addEventListener('DOMContentLoaded', () => {
    // Xóa bất kỳ phần tử con trỏ nào trước đó (để tránh nhân đôi)
    const existingCursor = document.querySelector('.cursor');
    if (existingCursor) existingCursor.remove();

    // Tạo phần tử con trỏ
    const cursor = document.createElement('div');
    cursor.classList.add('cursor');
    document.body.appendChild(cursor);

    let mouseX = 0, mouseY = 0;

    // Lắng nghe sự kiện di chuyển chuột
    document.addEventListener('mousemove', (e) => {
        mouseX = e.clientX;
        mouseY = e.clientY;
        cursor.style.opacity = '1'; // Hiển thị lại khi di chuyển chuột
    });

    // Sử dụng requestAnimationFrame để làm mượt di chuyển
    const updateCursor = () => {
        cursor.style.transform = `translate(${mouseX}px, ${mouseY}px)`;
        requestAnimationFrame(updateCursor);
    };

    updateCursor();

    // Ẩn con trỏ khi chuột rời cửa sổ trình duyệt
    document.addEventListener('mouseleave', () => {
        cursor.style.opacity = '0';
    });

    // Hiện lại con trỏ khi chuột quay lại
    document.addEventListener('mouseenter', () => {
        cursor.style.opacity = '1';
    });
});