import { TachePersonnelle } from "./TachePersonnelle.js";
import { TacheProfessionnelle } from "./TacheProfessionnelle.js";
import { GestionnaireTaches } from "./GestionnaireTaches.js";

const gestionnaire = new GestionnaireTaches();

const titre = document.getElementById("titreTache");
const texte = document.getElementById("texteTache");
const date = document.getElementById("dateTache");

//const addBtn = document.getElementById("ajouterTache");

const formAjout = document.getElementById("form-ajout");

const formSelect = document.querySelector(".form-select");
const customInput = document.getElementById("custom-input");

const compteur = document.getElementById("compteur");

let listeTaches = document.getElementById("listeTaches");

const btnFiltrer = document.getElementById("btnFiltrer");

gestionnaire.afficherToutes();

addEventListener("DOMContentLoaded", () => {
    updatePlaceholderAndName();
});

formSelect.addEventListener("change", () => {
    updatePlaceholderAndName();
});

formAjout.addEventListener("submit", (e) => {
    e.preventDefault();

    if (getSelectedOption() === "Personnelle") {
        const tachePersonnelle = new TachePersonnelle(
            titre.value,
            texte.value,
            date.value,
            customInput.value
        );
        gestionnaire.ajouterTache(tachePersonnelle);
        console.log(tachePersonnelle);
    }

    if (getSelectedOption() === "Professionnelle") {
        const tacheProfessionnelle = new TacheProfessionnelle(
            titre.value,
            texte.value,
            date.value,
            customInput.value
        );
        gestionnaire.ajouterTache(tacheProfessionnelle);
        console.log(tacheProfessionnelle);
    }

    const form = document.getElementById("form-ajout");
    form.reset();
    updatePlaceholderAndName();

    compteur.innerText = gestionnaire.compterTaches(gestionnaire.taches);
    afficherTaches();
});

btnFiltrer.addEventListener("click", (e) => {
    e.preventDefault();
    const motCle = document.getElementById("filtreMot").value;
    const dateDebut = document.getElementById("dateDebut").value;
    const dateFin = document.getElementById("dateFin").value;

    if (motCle) {
        listeTaches.innerHTML = "";
        gestionnaire.filtrerParMots(motCle).forEach(tache => {
            listeTaches.appendChild(tache.toLi());
        });
    } else if (dateDebut && dateFin) {
        listeTaches.innerHTML = "";
        gestionnaire.filtrerParDate(dateDebut, dateFin).forEach(tache => {
            listeTaches.appendChild(tache.toLi());
        });
    } else {
        afficherTaches();
    }
});

function getSelectedOption() {
    return formSelect.options[formSelect.selectedIndex].text;
}

function updatePlaceholderAndName() {
    const selectedOption = getSelectedOption();

    if (selectedOption === "Personnelle") {
        customInput.setAttribute("placeholder", "Lieu");
        customInput.setAttribute("name", "lieu");
    }

    if (selectedOption === "Professionnelle") {
        customInput.setAttribute("placeholder", "Projet");
        customInput.setAttribute("name", "projet");
    }
}

function afficherTaches() {
    listeTaches.innerHTML = "";
    gestionnaire.taches.forEach(tache => {

        listeTaches.appendChild(tache.toLi());

        const deleteBtn = listeTaches.querySelector("li:last-child button");

        deleteBtn.addEventListener("click", (e) => {
            e.preventDefault();
            gestionnaire.supprimerTache(tache);
            compteur.innerText = gestionnaire.compterTaches(gestionnaire.taches);
            afficherTaches();
        });
    });
}