diff --git a/blog/html/accueil_blog.html b/blog/html/accueil_blog.html index 5c5b14b..21a15c0 100644 --- a/blog/html/accueil_blog.html +++ b/blog/html/accueil_blog.html @@ -1,114 +1,163 @@ + - Admin - Blog + Admin |Modifier le blog + + + + - - - +
+ + +
+
+
+
+

Modifier la page blog

+
+
+ + +
+

Liste des catégories

+ + +
+ + +
+ Ajouter une catégorie +
+ + + + + + + + + + + + +
NomActions
+
+ + + +
+

Liste des articles

+ + +
+ + +
+ Ajouter un article +
+ + + + + + + + + + + + + + + + + + + + +
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 3540f42..eb8cd59 100644 --- a/blog/html/ajouter_article.html +++ b/blog/html/ajouter_article.html @@ -7,22 +7,14 @@ + @@ -100,18 +92,19 @@
Article ajouté avec succès !
-
- - - - - +
+ +
+ +
@@ -137,13 +130,13 @@
- +
- Annuler + Annuler
@@ -151,26 +144,23 @@
- - + + + + + - \ No newline at end of file + + + + diff --git a/blog/html/ajouter_categorie.html b/blog/html/ajouter_categorie.html index 1f26d8c..ae80d6a 100644 --- a/blog/html/ajouter_categorie.html +++ b/blog/html/ajouter_categorie.html @@ -97,14 +97,14 @@
- Annuler + Annuler
- + \ No newline at end of file diff --git a/blog/html/liste_categorie_article.html b/blog/html/liste_categorie_article.html deleted file mode 100644 index b5df79a..0000000 --- a/blog/html/liste_categorie_article.html +++ /dev/null @@ -1,185 +0,0 @@ - - - - - - Blog – Catégories & Articles - - - - - - - - - - - - - -
- -
- - -
- - - - -
-

Liste des catégories

- - -
- - -
- Ajouter une catégorie -
- - - - - - - - - - - - -
NomActions
-
- - - - - -
-

Liste des articles

- - -
- - -
- Ajouter un article -
- - - - - - - - - - - - - - - - - - - - -
TitreActions
Mon premier article - Modifier - -
Mon deuxième article - Modifier - -
-
- -
- - - - - - - - diff --git a/blog/html/modifier_article.html b/blog/html/modifier_article.html index 091bbff..caa594d 100644 --- a/blog/html/modifier_article.html +++ b/blog/html/modifier_article.html @@ -152,12 +152,12 @@
- +
- Annuler + Annuler
@@ -179,7 +179,7 @@ - + diff --git a/blog/html/modifier_categorie.html b/blog/html/modifier_categorie.html index 30c86e1..b1ced3a 100644 --- a/blog/html/modifier_categorie.html +++ b/blog/html/modifier_categorie.html @@ -5,17 +5,9 @@ Modifier une catégorie + - + @@ -75,10 +67,7 @@

Modifier une catégorie

-
Veuillez ezmplir tous les champs obligatoires
- -
La catégorie a été modifiée avec succès !
- +
@@ -95,7 +84,7 @@
- Annuler + Annuler
@@ -103,7 +92,7 @@ - + diff --git a/blog/js/ajouter_article.js b/blog/js/ajouter_article.js index 70c5f93..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_categorie_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 8c4189c..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_article.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/modifier_article.js b/blog/js/modifier_article.js index a5a930d..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 = "../../blog/html/liste_categorie_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 97f8b1a..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_article.html"; + window.location.href = "../html/accueil_blog.html"; }, 1500); }); diff --git a/css/avant_apres.css b/css/avant_apres.css new file mode 100644 index 0000000..dc587d0 --- /dev/null +++ b/css/avant_apres.css @@ -0,0 +1,10 @@ +/*============================================================================= + Image Preview Styles + =============================================================================*/ + + .img-preview { + max-width: 150px; + border-radius: 8px; + display: none; + /* cachée tant qu'il n'y a pas d'image */ + } \ No newline at end of file diff --git a/css/blog.css b/css/blog.css new file mode 100644 index 0000000..882b6b6 --- /dev/null +++ b/css/blog.css @@ -0,0 +1,11 @@ + + body { + background: #f4f6f9; + } + .container { + + margin: 40px auto; + } + .ck-editor__editable { + min-height: 350px; +} \ No newline at end of file diff --git a/css/style.css b/css/style.css index a2429b1..d591513 100644 --- a/css/style.css +++ b/css/style.css @@ -38,13 +38,4 @@ Header Navbar Styles } - /*============================================================================= - Image Preview Styles - =============================================================================*/ - - .img-preview { - max-width: 150px; - border-radius: 8px; - display: none; - /* cachée tant qu'il n'y a pas d'image */ - } \ No newline at end of file + \ No newline at end of file diff --git a/prestations/html/ajouter_avant_apres.html b/prestations/html/ajouter_avant_apres.html index 92a4caf..be53e9e 100644 --- a/prestations/html/ajouter_avant_apres.html +++ b/prestations/html/ajouter_avant_apres.html @@ -4,12 +4,12 @@ - Ajouter une paire avant/après - - - + Ajouter un résultat avant/après + + - + + @@ -82,80 +82,88 @@ -
- -

Ajouter un résultat en images (Avant / Après)

- - -
- Nouveau résultat ajouté avec succès ! -
- - -
- Merci de remplir tous les champs obligatoires. -
- - -
- Format d'image invalide. Formats acceptés : JPG, PNG, WEBP. -
- - - - -
- - -
- - -
- - -
- - -
- - - - image avant -
- - -
- - - - image après -
- - -
-
- - Annuler - +
+
+
+

Ajouter un résultat en images (Avant / Après)

+ +
+ Nouveau résultat ajouté avec succès !
-
- -
-
- -
+ +
+ Merci de remplir tous les champs obligatoires. +
+ + +
+ Format d'image invalide. Formats acceptés : JPG, PNG, WEBP. +
+ +
+ +
+ + +
+ + +
+ + +
+ + +
+ + +
+ + + + image avant +
+ + +
+ + + + image après +
+ + +
+
+ + Annuler + +
+
+ +
+
+ +
+ +
+
+ + - + diff --git a/prestations/html/liste_avant_apres.html b/prestations/html/liste_avant_apres.html index a6d829e..58fe8bc 100644 --- a/prestations/html/liste_avant_apres.html +++ b/prestations/html/liste_avant_apres.html @@ -4,81 +4,141 @@ - Liste des paires avant/après - + Liste des résultats avant/après + + + + - + -
-

Liste des résultat avant/après

+
+ +
+ +
+
+
+

Liste des résultats avant/après

+ +
+ Résultat supprimé avec succès ! +
+
+ +
+ +
+ + Ajouter un résultat + +
+ + +
+ + + + + + + + + + +
Titre du résultatActions
+
-
- Voulez-vous vraiment supprimer cette paire avant/après ?
- -
- - -
-
-
-
+ + + + + - \ No newline at end of file + diff --git a/prestations/html/liste_slider.html b/prestations/html/liste_slider.html index 2919d50..9003512 100644 --- a/prestations/html/liste_slider.html +++ b/prestations/html/liste_slider.html @@ -1,25 +1,31 @@ + Liste des slides - + + + +
+ + +
+ -
+
-

Slider – Liste des images

+

Slider – Liste des images

- -
+ +
- -
- Ajouter une image au slider + +
+ Ajouter une image au slider +
+ + + + + + + + + + + + + + + +
ImageTexte ALTTitreOrdreActions
- - - - - - - - - - - - - - -
ImageTexte ALTTitreOrdreActions
-
- - - + + - + + \ No newline at end of file diff --git a/prestations/html/modifier_avant_apres.html b/prestations/html/modifier_avant_apres.html index 8b90c0d..3e77746 100644 --- a/prestations/html/modifier_avant_apres.html +++ b/prestations/html/modifier_avant_apres.html @@ -4,95 +4,167 @@ - Modifier une paire avant/après - - - + Modifier un résultat avant/après + + + + - + -
-

Modifier une paire avant/après

+
+ +
+ +
+
+
+

Modifier un résultat en images (Avant / Après)

+ + +
+ Le résultat a été modifié avec succès. +
+
+ Une erreur est survenue. Merci de vérifier le formulaire. +
+ + +
+ Format d'image invalide. Formats acceptés : JPG, PNG, WEBP. +
+
+ + +
+ + +
+ + + + + +
+ + +
+ + +
+ + +
+ + +
+ +
+ + + Aperçu avant +
+ + +
+ + + Aperçu après +
+
+ + +
+
+ + Annuler + +
+
+ +
+
+ +
+ +
+
- -
- Format d'image invalide. Formats acceptés : JPG, PNG, WEBP. -
+ + - -
- - - - - -
- - -
- - -
- - -
- - -
- -
- - - - Aperçu avant -
- - -
- - - - Aperçu après -
-
- - -
-
- - Annuler - -
-
- -
-
- -
-
- - - diff --git a/prestations/html/prestation_accueil.html b/prestations/html/prestation_accueil.html index aa7a783..678c48a 100644 --- a/prestations/html/prestation_accueil.html +++ b/prestations/html/prestation_accueil.html @@ -1,74 +1,292 @@ + - Admin - Prestations - - - + CE sera le titre de la page + + + +
+ + +
+
+
+
+

Gérer la page prestations

+
+
+
+ +

Gérer les prestations

+ +
+
+

+ +

+
+
+ Contenu de l'accordéon 1 +
+
+
+
+

+ +

+
+
+ Contenu de l'accordéon 2 +
+
+
+ +
+ +
+
- -
- -
-
🎞️
-

Gérer le slider

-

Images du slider de la page Prestations chiens.

-
- -
- - -
- -
-
🖼️
-

Galerie Avant / Après

-

Ajouter, modifier ou supprimer les photos.

-
- -
- -
-
- - - + + + + \ No newline at end of file diff --git a/prestations/html/voir_avant_apres.html b/prestations/html/voir_avant_apres.html index 0189e2d..e4d7a9d 100644 --- a/prestations/html/voir_avant_apres.html +++ b/prestations/html/voir_avant_apres.html @@ -1,64 +1,63 @@ + - Voir la paire avant/après + Voir le résultat avant/après + + + + - - - - -
+ -

Détails de la paire avant/après

+
- -
- Impossible d'afficher cette paire. -
+

Détails du résultat en images (Avant / Après)

-
+ +
+ Impossible d'afficher ce résultat. +
-

Chargement...

+
+ +

Chargement...

- -
+ +
+ +
+

AVANT

+ Photo avant +
+ +
+

APRÈS

+ Photo après +
-
-

AVANT

- Photo avant
-
-

APRÈS

- Photo après + +
+ + Retour à la liste +
- -
- - Retour à la liste - -
-
-
+ + - - - + \ No newline at end of file diff --git a/prestations/js/liste_avant_apres.js b/prestations/js/liste_avant_apres.js index b1eaaec..12d6c71 100644 --- a/prestations/js/liste_avant_apres.js +++ b/prestations/js/liste_avant_apres.js @@ -5,16 +5,14 @@ let galleryPairs = [ { id: 1, titre: "Petit chien poils longs", - type: "Chien", - avant: "../../img/avant1.jpg", - apres: "../../img/apres1.jpg" + + }, { id: 2, titre: "Coupe ciseaux", - type: "Chat", - avant: "../../img/avant2.jpg", - apres: "../../img/apres2.jpg" + + } ]; @@ -41,33 +39,21 @@ function displayPairs() { row.innerHTML = ` ${pair.titre} - ${pair.type} - - - - - - - - + -
+
- - - Voir - + - + Modifier -