document.addEventListener("DOMContentLoaded", (event) => {
    document.getElementById('submit').addEventListener('click', function() {
        var url = document.getElementById('url_box').value;
        const response_area = document.getElementById('response-area');

        if (!url) {
            response_area.innerText = 'Please enter a URL.';
            return;
        }
        else{
            response_area.innerText = "Sending URL and retriving transcript."
        }

        fetch('/process_url', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            body: new URLSearchParams({ url: url })
        })
        .then(response => response.text())
        .then(data => {
            response_area.innerText = data;
        })
        .catch(error => {
            console.error('Error:', error);
            response_area.innerText = 'An error occurred. Please try again.';
        });
    });
});