class View {
    constructor() {
        this.app = document.getElementById('root');
        this.form = this.app.querySelector('.todo-form');
        this.input = this.form.querySelector('.todo-input');
        this.todoList = this.app.querySelector('.todo-list');
        this.filterTabs = this.app.querySelector('.tabs');
    }

    // ... autres méthodes de la classe View

    bindAddTodo(handler) {
        this.form.addEventListener('submit', event => {
            event.preventDefault();
            const text = this.input.value.trim();
            if (text !== '') {
                handler(text);
                this.input.value = '';
            }
        });
    }

    bindDeleteTodo(handler) {
        this.todoList.addEventListener('click', event => {
            if (event.target.classList.contains('delete-button')) {
                const id = parseInt(event.target.closest('li').dataset.id);
                handler(id);
            }
        });
    }

    bindToggleTodo(handler) {
        this.todoList.addEventListener('click', event => {
            if (event.target.type === 'checkbox') {
                const id = parseInt(event.target.closest('li').dataset.id);
                handler(id);
            }
        });
    }

    bindEditTodo(handler) {
        // Événement 'blur' pour détecter la fin de l'édition d'une tâche
        this.todoList.addEventListener('blur', event => {
            if (event.target.classList.contains('editable-text')) {
                const id = parseInt(event.target.closest('li').dataset.id);
                const newText = event.target.textContent.trim();
                handler(id, newText);
            }
        }, true);
    }

    // Méthode pour le double-clic
    bindDoubleClickTodo(handler) {
        this.todoList.addEventListener('dblclick', event => {
            const li = event.target.closest('li');
            if (li) {
                const textElement = li.querySelector('.editable-text');
                if (textElement) {
                    textElement.contentEditable = true;
                    textElement.focus();
                }
            }
        });
    }
}