diff --git a/blog/html/accueil_blog.html b/blog/html/accueil_blog.html new file mode 100644 index 0000000..21a15c0 --- /dev/null +++ b/blog/html/accueil_blog.html @@ -0,0 +1,163 @@ + + + + + + + Admin |Modifier le blog + + + + + + + + + + +
+ + +
+
+
+
+

Modifier la page blog

+
+
+ + +
+

Liste des catégories

+ + +
+ + + + + + + + + + + + + + + +
NomActions
+
+ + + +
+

Liste des articles

+ + +
+ + + + + + + + + + + + + + + + + + + + + + + +
TitreActions
Mon premier article + Modifier + +
Mon deuxième article + Modifier + +
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/blog/html/ajouter_article.html b/blog/html/ajouter_article.html index 75594e1..eb8cd59 100644 --- a/blog/html/ajouter_article.html +++ b/blog/html/ajouter_article.html @@ -7,26 +7,71 @@ + + +
+ +
+

Ajouter un article

@@ -47,18 +92,19 @@
Article ajouté avec succès !
-
- - - - - +
+ +
+ +
@@ -84,13 +130,13 @@
- +
- Annuler + Annuler
@@ -98,26 +144,23 @@
- - + + + + + - \ No newline at end of file + + + + diff --git a/blog/html/ajouter_categorie.html b/blog/html/ajouter_categorie.html index b288956..ae80d6a 100644 --- a/blog/html/ajouter_categorie.html +++ b/blog/html/ajouter_categorie.html @@ -12,13 +12,66 @@ } .container{ - max-width: 600px; + margin-top: 50px; } + +
+ +
+

Ajouter une catégorie

@@ -44,14 +97,14 @@
- Annuler + Annuler
- + \ No newline at end of file diff --git a/blog/html/liste_article.html b/blog/html/liste_article.html deleted file mode 100644 index f48d43b..0000000 --- a/blog/html/liste_article.html +++ /dev/null @@ -1,67 +0,0 @@ - - - - - - Liste des article - - - - - - -
-
-

Listes des articles

- Ajouter un article -
- - - - - - - - - - - - - - - - - - - - - - - - - -
TitreCatégoriePubliéActions
Mon premier articleChienOui - Voir - Modifier - -
Mon deuxième articleChatOui - Voir - Modifier - -
-
- - - - - - - - \ No newline at end of file diff --git a/blog/html/liste_categorie.html b/blog/html/liste_categorie.html deleted file mode 100644 index 85ed338..0000000 --- a/blog/html/liste_categorie.html +++ /dev/null @@ -1,56 +0,0 @@ - - - - - - Liste des catégories - - - - - - - -
-

Liste des catégories

- - -
- - - - - - - - - - - - - - - - -
NomDescriptionActions
-
- - - - - - - diff --git a/blog/html/modifier_article.html b/blog/html/modifier_article.html index 92305c2..caa594d 100644 --- a/blog/html/modifier_article.html +++ b/blog/html/modifier_article.html @@ -14,7 +14,7 @@ background: #f4f6f9; } .container { - max-width: 700px; + margin-top: 40px; } .preview-img { @@ -29,6 +29,60 @@ + +
+ +
+ +

Modifier un article

@@ -98,12 +152,12 @@
- +
- Annuler + Annuler
@@ -125,7 +179,7 @@ - + diff --git a/blog/html/modifier_categorie.html b/blog/html/modifier_categorie.html index bcb8eaa..b1ced3a 100644 --- a/blog/html/modifier_categorie.html +++ b/blog/html/modifier_categorie.html @@ -5,27 +5,69 @@ Modifier une catégorie + - + + +
+ +
+

Modifier une catégorie

-
Veuillez ezmplir tous les champs obligatoires
- -
La catégorie a été modifiée avec succès !
- +
@@ -42,7 +84,7 @@
- Annuler + Annuler
@@ -50,7 +92,7 @@
- + diff --git a/blog/js/ajouter_article.js b/blog/js/ajouter_article.js index 181b008..298d7d1 100644 --- a/blog/js/ajouter_article.js +++ b/blog/js/ajouter_article.js @@ -1,7 +1,6 @@ const form = document.getElementById('ajouterArticleForm'); const imgField = document.getElementById('articleImage'); const titleField = document.getElementById('articleTitle'); -const contentField = document.getElementById('articleContent'); const categoryField = document.getElementById('articleCategory'); const publishedField = document.getElementById('articlePublished'); @@ -18,6 +17,9 @@ form.addEventListener('submit', function(e) { const titre = titleField.value.trim().toLowerCase(); const fichierImage = imgField.files[0]; + const contenu = tinymce.get("articleContent").getContent(); + const categorie = categoryField.value; + const published = publishedField.checked; // récupère la case cochée // Reset messages errorEmpty.classList.add('d-none'); @@ -25,8 +27,16 @@ form.addEventListener('submit', function(e) { errorExists.classList.add('d-none'); successMsg.classList.add('d-none'); + // Catégorie obligatoire + if (categorie === "") { + errorEmpty.textContent = "Veuillez choisir une catégorie."; + errorEmpty.classList.remove('d-none'); + return; + } + // Titre obligatoire if (titre === "") { + errorEmpty.textContent = "Le titre de l'article est obligatoire."; errorEmpty.classList.remove('d-none'); return; } @@ -37,6 +47,13 @@ form.addEventListener('submit', function(e) { return; } + // Contenu obligatoire + if (contenu.trim() === "") { + errorEmpty.textContent = "Le contenu de l'article ne peut pas être vide."; + errorEmpty.classList.remove('d-none'); + return; + } + // Image invalide if (fichierImage) { const validFormats = ['image/jpeg', 'image/png']; @@ -46,14 +63,44 @@ form.addEventListener('submit', function(e) { } } - // Simuler enregistrement + // Simuler enregistrement titreExistants.push(titre); + + // CRÉATION DE L'ARTICLE + + const nouvelArticle = { + id: Date.now(), + titre: titleField.value.trim(), + contenu: contenu, + categorie: categorie, + published: published, // valeur TRUE/FALSE pour afficher le badge Facebook + date: new Date().toISOString() + }; + + + // SAUVEGARDE DANS LOCALSTORAGE + + let articles = JSON.parse(localStorage.getItem("articles")) || []; + articles.push(nouvelArticle); + localStorage.setItem("articles", JSON.stringify(articles)); + + console.log("Article enregistré :", nouvelArticle); + // Succès successMsg.classList.remove('d-none'); - // Redirection après 1 seconde + // Redirection setTimeout(() => { - window.location.href = "../html/liste_article.html"; + window.location.href = "../html/accueil_blog.html"; }, 1000); }); + +// TinyMCE INIT +tinymce.init({ + selector: '#articleContent', + height: 400, + language: 'fr', + plugins: 'lists fullscreen', + toolbar: 'undo redo | bold italic underline | bullist numlist | fullscreen' +}); diff --git a/blog/js/ajouter_categorie.js b/blog/js/ajouter_categorie.js index c904fdc..dd7e34c 100644 --- a/blog/js/ajouter_categorie.js +++ b/blog/js/ajouter_categorie.js @@ -40,7 +40,7 @@ existingCategories.push(nom); // Redirection après 1 seconde setTimeout(() => { - window.location.href = "../html/liste_categorie.html"; + window.location.href = "../html/accueil_blog.html"; }, 1000); diff --git a/blog/js/liste_articles.js b/blog/js/liste_articles.js index f562797..d3a17de 100644 --- a/blog/js/liste_articles.js +++ b/blog/js/liste_articles.js @@ -1,14 +1,67 @@ +// Sélecteur du tableau +const articlesTableBody = document.getElementById("articlesTableBody"); +// Charger les articles depuis le localStorage +let articles = JSON.parse(localStorage.getItem("articles")) || []; + +// Fonction d'affichage des articles +function afficherArticles() { + articlesTableBody.innerHTML = ""; // Nettoie le tableau + + if (articles.length === 0) { + articlesTableBody.innerHTML = ` + + + Aucun article pour le moment. + + + `; + return; + } + + articles.forEach(article => { + const tr = document.createElement("tr"); + + tr.innerHTML = ` + + ${article.titre} + ${article.published ? 'Publié Facebook' : ''} + + + Modifier + + + + `; + + articlesTableBody.appendChild(tr); + }); +} + +// Gestion de suppression document.addEventListener("click", function (e) { const btn = e.target.closest(".delete-btn"); - if (!btn) return; // on a cliqué ailleurs + if (!btn) return; - // On récupère la ligne de l'article const row = btn.closest("tr"); const titre = row.querySelector("td").textContent.trim(); + const id = Number(btn.dataset.id); if (confirm(`Voulez-vous vraiment supprimer l'article : "${titre}" ?`)) { - row.remove(); // supprime la ligne + + // Supprimer dans le tableau local + articles = articles.filter(article => article.id !== id); + localStorage.setItem("articles", JSON.stringify(articles)); + + // Supprimer visuel + row.remove(); + alert("Article supprimé !"); } -}); \ No newline at end of file +}); + +// Lancer l'affichage dès que la page charge +afficherArticles(); diff --git a/blog/js/liste_categorie.js b/blog/js/liste_categorie.js index 4f8ef98..550fee7 100644 --- a/blog/js/liste_categorie.js +++ b/blog/js/liste_categorie.js @@ -17,14 +17,15 @@ function afficherCategories() { const row = ` ${cat.nom} - ${cat.description || "-"} - - + + Modifier - diff --git a/blog/js/modifier_article.js b/blog/js/modifier_article.js index e87ce17..fc53268 100644 --- a/blog/js/modifier_article.js +++ b/blog/js/modifier_article.js @@ -55,6 +55,6 @@ form.addEventListener("submit", function (e) { // Redirection après succès setTimeout(() => { - window.location.href = "../html/liste_article.html"; + window.location.href = "../../blog/html/accueil_blog.html"; }, 1500); }); diff --git a/blog/js/modifier_categorie.js b/blog/js/modifier_categorie.js index 7642c4d..ab6456e 100644 --- a/blog/js/modifier_categorie.js +++ b/blog/js/modifier_categorie.js @@ -1,26 +1,37 @@ - const form = document.getElementById("modifierCategorie"); const nameField = document.getElementById("categoryName"); const descField = document.getElementById("categorieDescription"); -const errorMsg = document.getElementById("errorMsg"); -const successMsg = document.getElementById("successMsg"); + +// Fonction pour afficher un message Bootstrap +function showMessage(type, message) { + // Création de l'alert + const alert = document.createElement("div"); + alert.className = `alert alert-${type} mt-3`; + alert.textContent = message; + + // Ajout en haut du formulaire + form.prepend(alert); + + // Suppression automatique après 2 secondes + setTimeout(() => { + alert.remove(); + }, 2000); +} form.addEventListener("submit", function (e) { e.preventDefault(); // Vérification des champs obligatoires if (nameField.value.trim() === "" || descField.value.trim() === "") { - errorMsg.classList.remove("d-none"); - successMsg.classList.add("d-none"); + showMessage("danger", "Veuillez remplir tous les champs obligatoires"); return; } - // Succès - errorMsg.classList.add("d-none"); - successMsg.classList.remove("d-none"); + // Message succès + showMessage("success", "La catégorie a été modifiée avec succès !"); - // Redirection après succès + // Redirection après succès setTimeout(() => { - window.location.href = "../html/liste_categorie.html"; + window.location.href = "../html/accueil_blog.html"; }, 1500); }); diff --git a/connexion/html/mot_de_passe_oublie.html b/connexion/html/mot_de_passe_oublie.html index d17c54f..7ce508f 100644 --- a/connexion/html/mot_de_passe_oublie.html +++ b/connexion/html/mot_de_passe_oublie.html @@ -1,61 +1,56 @@ - - - - Mot de passe oublié - - - - -
-
-

Mot de passe oublié

-

- Nous avons besoin de votre adresse mail pour pouvoir réinitialiser - votre mot de passe. -

- -
- + + + + Mot de passe oublié + - -
+ + - - -
+ +
+
+

Mot de passe oublié

+

+ Nous avons besoin de votre adresse mail pour pouvoir réinitialiser + votre mot de passe. +

+
+
+ + + +
+ + + + + + +
- - - +
+ + + + \ No newline at end of file diff --git a/connexion/html/page_de_connexion.html b/connexion/html/page_de_connexion.html index b928365..13009d2 100644 --- a/connexion/html/page_de_connexion.html +++ b/connexion/html/page_de_connexion.html @@ -26,12 +26,23 @@