đ ïž Ătape 1 : Le cĆur de l’extension (PHP & SQL)
Maintenant que la table phpbb_post_reactions existe, il faut créer les scripts qui vont interagir avec elle.
1.1. Création du contrÎleur principal (Back-end)
C’est le script qui va gĂ©rer les requĂȘtes AJAX venant du front-end. Il doit ĂȘtre capable de :
- RĂ©cupĂ©rer les donnĂ©es de la requĂȘte : l’ID du post, l’ID de l’utilisateur et l’emoji cliquĂ©.
- Valider et sécuriser les données :
- VĂ©rifier que l’utilisateur est connectĂ© et autorisĂ© Ă rĂ©agir.
- S’assurer que le
post_idexiste bien. - Valider l’emoji (par exemple, s’il fait partie d’une liste autorisĂ©e).
- Interagir avec la base de données :
- Ajouter une rĂ©action : Si l’utilisateur n’a pas encore rĂ©agi Ă ce post, insĂšre une nouvelle ligne dans la table
post_reactions. - Modifier une rĂ©action : Si l’utilisateur a dĂ©jĂ rĂ©agi, met Ă jour sa rĂ©action existante.
- Supprimer une rĂ©action : Si l’utilisateur clique Ă nouveau sur son emoji, supprime la ligne de la table.
- Ajouter une rĂ©action : Si l’utilisateur n’a pas encore rĂ©agi Ă ce post, insĂšre une nouvelle ligne dans la table
- Retourner une rĂ©ponse : AprĂšs l’opĂ©ration, renvoie une rĂ©ponse au format JSON contenant :
- Un statut de succĂšs ou d’Ă©chec.
- Les compteurs mis Ă jour pour ce post.
1.2. Mettre en place la logique pour les compteurs
Il te faudra une fonction pour compter les réactions par post.
- Utilise une requĂȘte
GROUP BY reaction_unicodesur ta tablepost_reactionspour obtenir le nombre de réactions pour chaque emoji sur un post donné. - Cette fonction sera appelée par le contrÎleur AJAX pour retourner les compteurs mis à jour, mais aussi par le front-end pour afficher les compteurs lors du chargement initial de la page.
đ„ïž Ătape 2 : Le front-end (HTML, CSS & JavaScript)
C’est la partie visible de l’extension. L’objectif est de rendre l’interaction fluide et agrĂ©able.
2.1. Affichage des réactions dans le template
- Ouvre le fichier de template
viewtopic_body.htmlde ton style. - Localise la boucle « . C’est ici que chaque post est affichĂ©.
- Ă l’intĂ©rieur de cette boucle, ajoute un bloc HTML pour les rĂ©actions, comme tu l’as dĂ©jĂ prĂ©vu dans ton cahier des charges.
- Utilise les variables de template de phpBB (
postrow.POST_ID) pour associer les réactions au bon post.
<div class="post-reactions" data-post-id="{postrow.POST_ID}"></div>
2.2. L’interface utilisateur avec JavaScript
- Crée un fichier JavaScript (par exemple,
reactions.js) dans le rĂ©pertoirestyles/all/template/de ton extension. - Dans ce fichier, tu vas coder la logique d’interaction :
- DĂ©tecter les clics : Ajoute des Ă©couteurs d’Ă©vĂ©nements sur les boutons d’emojis et sur le bouton
+. - Envoi des requĂȘtes AJAX : Au clic, envoie une requĂȘte POST Ă ton contrĂŽleur PHP, en passant le
post_idet l’emoji en paramĂštre. - Mise Ă jour de l’interface : Une fois la rĂ©ponse JSON reçue, mets Ă jour les compteurs des emojis et change la classe CSS pour indiquer si l’utilisateur a dĂ©jĂ rĂ©agi ou non.
- DĂ©tecter les clics : Ajoute des Ă©couteurs d’Ă©vĂ©nements sur les boutons d’emojis et sur le bouton
- N’oublie pas d’inclure ton fichier JavaScript dans le template via la fonction
page_footer_after.html.
2.3. Le sĂ©lecteur d’emojis
- CrĂ©e la logique JavaScript pour afficher et masquer la palette complĂšte d’emojis lorsque l’utilisateur clique sur le bouton
+. - Tu peux utiliser une simple classe CSS pour contrÎler la visibilité (par exemple,
display: noneoudisplay: block).
đŸ Ătape 3 : Les fonctionnalitĂ©s avancĂ©es et la finalisation
Une fois le noyau fonctionnel, tu peux ajouter les fonctionnalités supplémentaires.
3.1. L’import des donnĂ©es de l’ancienne extension
- C’est une fonctionnalitĂ© optionnelle mais cruciale pour la migration.
- Identifie la table de l’ancienne extension.
- CrĂ©e un script d’importation dans la migration (un nouveau fichier
migration.phpou une fonction dansrelease_1_0_0.php). - Ce script lira les donnĂ©es de l’ancienne table et les insĂ©rera dans ta nouvelle table
post_reactions, en s’assurant que les formats correspondent.
3.2. Les fichiers de langue et les permissions
- Crée les fichiers
language/fr/reactions.phpetlanguage/en/reactions.phpcomme prévu. - Utilise les fonctions de phpBB (
$user->lang) pour intĂ©grer les chaĂźnes de traduction dans tes templates et tes scripts. - Ajoute des permissions dans l’ACP (panneau d’administration) pour permettre aux administrateurs de contrĂŽler qui peut rĂ©agir aux posts (par groupe d’utilisateurs, par forum, etc.).
3.3. Tests et débogage
- Teste toutes les fonctionnalités : ajouter, modifier, supprimer une réaction.
- Vérifie que les compteurs se mettent à jour correctement pour tous les utilisateurs.
- Assure-toi que l’extension est compatible avec diffĂ©rents navigateurs et sur mobile.
- Utilise les outils de dĂ©veloppement du navigateur pour inspecter les requĂȘtes AJAX et les rĂ©ponses du serveur en cas de problĂšme.