document.addEventListener('DOMContentLoaded', () => {
    const input = document.getElementById('todo-input');
    const addButton = document.getElementById('add-button');
    const randomTaskButton = document.getElementById('random-task-button'); // Nowy przycisk
    const todoList = document.getElementById('todo-list');
    const popup = document.getElementById('popup');
    const popupContent = document.getElementById('random-task-text');
    const closePopup = document.getElementsByClassName('close')[0];

    addButton.addEventListener('click', addTodo);
    randomTaskButton.addEventListener('click', showRandomTask); // Event listener dla nowego przycisku

    input.addEventListener('keypress', (e) => {
        if (e.key === 'Enter') {
            addTodo();
        }
    });

    async function fetchTasks() {
        try {
            const response = await fetch('http://localhost:8000/get_tasks', {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json'
                }
            });

            if (response.ok) {
                const tasks = await response.json();
                tasks.forEach(task => {
                    const listItem = document.createElement('li');
                    listItem.textContent = task.task_description;
                    listItem.dataset.id = task.id; // Store the id in data-id attribute

                    const deleteButton = document.createElement('button');
                    deleteButton.textContent = 'Delete';
                    deleteButton.classList.add('delete-button');
                    deleteButton.addEventListener('click', () => {
                        todoList.removeChild(listItem);
                        deleteTask(listItem.dataset.id);
                    });

                    listItem.appendChild(deleteButton);
                    todoList.appendChild(listItem);
                });
            } else {
                console.error('Failed to fetch tasks', await response.json());
            }
        } catch (error) {
            console.error('Error fetching tasks:', error);
        }
    }

    async function addTodo() {
        const todoText = input.value.trim();
        if (todoText === '') {
            return;
        }

        try {
            const response = await fetch('http://localhost:8000/add_task', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({ task_description: todoText })
            });

            if (response.ok) {
                const responseData = await response.json(); // Assuming the server responds with the added task including its id
                const listItem = document.createElement('li');
                listItem.textContent = todoText;
                listItem.dataset.id = responseData.id; // Store the id in data-id attribute

                const deleteButton = document.createElement('button');
                deleteButton.textContent = 'Delete';
                deleteButton.classList.add('delete-button');
                deleteButton.addEventListener('click', () => {
                    todoList.removeChild(listItem);
                    deleteTask(listItem.dataset.id);
                });

                listItem.appendChild(deleteButton);
                todoList.appendChild(listItem);

                input.value = '';
                input.focus();
            } else {
                console.error('Failed to add task', await response.json());
            }
        } catch (error) {
            console.error('Error adding task:', error);
        }
    }

    async function deleteTask(taskId) {
        try {
            const response = await fetch(`http://localhost:8000/delete_task/${taskId}`, {
                method: 'DELETE'
            });

            if (!response.ok) {
                console.error('Failed to delete task', await response.json());
            }
        } catch (error) {
            console.error('Error deleting task:', error);
        }
    }

    async function showRandomTask() {
        try {
            // Execute rand2.exe
            const executeResponse = await fetch('http://localhost:8000/execute_rand2', {
                method: 'POST'
            });
    
            if (!executeResponse.ok) {
                console.error('Failed to execute rand2.exe', await executeResponse.json());
                return;
            }
    
            // Fetch the random number from random_number.txt
            const numberResponse = await fetch('http://localhost:8000/read_random_number', {
                method: 'GET',
                headers: {
                    'Content-Type': 'text/plain'
                }
            });
    
            if (!numberResponse.ok) {
                console.error('Failed to fetch random number', await numberResponse.text());
                return;
            }
    
            const randomNumberText = await numberResponse.text();
            const randomNumber = parseInt(randomNumberText.trim(), 10);
    
            // Fetch the list of tasks from the server
            const tasksResponse = await fetch('http://localhost:8000/get_tasks', {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json'
                }
            });
    
            if (tasksResponse.ok) {
                const tasks = await tasksResponse.json();
                if (tasks.length > 0) {
                    // Use the random number to select a task, considering the range
                    const taskIndex = randomNumber % tasks.length;
                    const randomTask = tasks[taskIndex];
                    popupContent.textContent = randomTask.task_description;
                    popup.style.display = 'block';
                } else {
                    alert('No tasks available');
                }
            } else {
                console.error('Failed to fetch tasks', await tasksResponse.json());
            }
    
            // Delete random_number.txt after fetching the data
            await fetch('http://localhost:8000/delete_random_number', {
                method: 'DELETE'
            });
        } catch (error) {
            console.error('Error fetching data:', error);
        }
    }
    
    
    

    closePopup.onclick = function() {
        popup.style.display = 'none';
    }

    window.onclick = function(event) {
        if (event.target === popup) {
            popup.style.display = 'none';
        }
    }

    // Fetch tasks when the page loads
    fetchTasks();
});