From d90d85d00226fcc80a3c12b18bf9d6ef15c56918 Mon Sep 17 00:00:00 2001 From: Vincent Guillet Date: Sat, 12 Jul 2025 11:20:23 +0200 Subject: [PATCH] first commit with existing project files --- GestionnaireTaches.js | 41 ++++++++++++++ README.md | 1 + Tache.js | 52 +++++++++++++++++ TachePersonnelle.js | 17 ++++++ TacheProfessionnelle.js | 17 ++++++ index.html | 67 ++++++++++++++++++++++ main.js | 121 ++++++++++++++++++++++++++++++++++++++++ 7 files changed, 316 insertions(+) create mode 100644 GestionnaireTaches.js create mode 100644 README.md create mode 100644 Tache.js create mode 100644 TachePersonnelle.js create mode 100644 TacheProfessionnelle.js create mode 100644 index.html create mode 100644 main.js diff --git a/GestionnaireTaches.js b/GestionnaireTaches.js new file mode 100644 index 0000000..a8ed3ad --- /dev/null +++ b/GestionnaireTaches.js @@ -0,0 +1,41 @@ +export class GestionnaireTaches { + constructor() { + this.taches = []; + } + + ajouterTache(tache) { + this.taches.push(tache); + } + + supprimerTache(tache) { + const index = this.taches.indexOf(tache); + if (index !== -1) { + this.taches.splice(index, 1); + } else { + console.error("Tâche non trouvée"); + } + } + + filtrerParMots(chaine) { + + if (!chaine) return this.taches; + + return this.taches.filter(tache => + tache.contientMot(chaine)); + } + + filtrerParDate(dateDebut, dateFin) { + return this.taches.filter(tache => + tache.estEntreDates(dateDebut, dateFin)); + } + + afficherToutes() { + this.taches.forEach(tache => + tache.afficher() + ); + } + + compterTaches(taches) { + return taches.length; + } +} \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..d940f97 --- /dev/null +++ b/README.md @@ -0,0 +1 @@ +# tp-javascript-gestionnaire-taches diff --git a/Tache.js b/Tache.js new file mode 100644 index 0000000..ebf73c3 --- /dev/null +++ b/Tache.js @@ -0,0 +1,52 @@ +export class Tache { + constructor(titre, texte, date) { + this._titre = titre; + this._texte = texte; + this._date = date; + } + + afficher() { + console.log( + `Titre: ${this._titre} + Texte: ${this._texte} + Date: ${this._date}`); + } + + contientMot(mot) { + const regex = new RegExp(mot, 'gi'); + return regex.test(this._titre) || regex.test(this._texte); + } + + estEntreDates(dateDebut, dateFin) { + const dateTache = new Date(this._date); + const debut = new Date(dateDebut); + const fin = new Date(dateFin); + return dateTache >= debut && dateTache <= fin; + } + + toLi() { + const li = document.createElement("li"); + li.textContent = this.toString(); + li.style.margin = "10px 0"; + + const deleteBtn = this.createDeleteButton(); + li.appendChild(deleteBtn); + + return li; + } + + createDeleteButton() { + console.log("test"); + const btn = document.createElement("button"); + + btn.className = "btn btn-danger"; + btn.innerHTML = ""; + btn.style.marginLeft = "10px"; + + return btn; + } + + toString() { + return `Titre: ${this._titre}, Texte: ${this._texte}, Date: ${this._date}`; + } +} \ No newline at end of file diff --git a/TachePersonnelle.js b/TachePersonnelle.js new file mode 100644 index 0000000..d3a534a --- /dev/null +++ b/TachePersonnelle.js @@ -0,0 +1,17 @@ +import { Tache } from './Tache.js'; + +export class TachePersonnelle extends Tache { + constructor(titre, texte, date, lieu) { + super(titre, texte, date); + this._lieu = lieu; + } + + afficher() { + super.afficher(); + console.log(`Lieu: ${this._lieu}`); + } + + toString() { + return `${super.toString()}, Lieu: ${this._lieu}`; + } +} \ No newline at end of file diff --git a/TacheProfessionnelle.js b/TacheProfessionnelle.js new file mode 100644 index 0000000..bfa3c04 --- /dev/null +++ b/TacheProfessionnelle.js @@ -0,0 +1,17 @@ +import { Tache } from './Tache.js'; + +export class TacheProfessionnelle extends Tache { + constructor(titre, texte, date, projet) { + super(titre, texte, date); + this._projet = projet; + } + + afficher() { + super.afficher(); + console.log(`Projet: ${this._projet}`); + } + + toString() { + return `${super.toString()}, Projet: ${this._projet}`; + } +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..943a3b5 --- /dev/null +++ b/index.html @@ -0,0 +1,67 @@ + + + + + + Gestionnaire de Tâches + + + + + + +
+

Gestionnaire de Tâches

+ + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+ + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ + +
+
Toutes les tâches (0)
+
    +
    +
    + + + diff --git a/main.js b/main.js new file mode 100644 index 0000000..0f90007 --- /dev/null +++ b/main.js @@ -0,0 +1,121 @@ +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(); + }); + }); +}