Paramétrer un widget

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Paramétrer un widget

Message par Invité Mar 28 Fév 2023 - 5:44

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Depuis toujours
Lien du forum : -

Description du problème

Bonjour, Bonsoir à tous Very Happy
Je rencontre quelques problèmes avec un widget très indiscipliné !

Dans un premier temps, j'annonce que pour des raisons de confidentialité, il me sera impossible de vous délivrer le lien vers mon forum (actuellement en phase de construction) à cause de l'archivage du sujet. Mince
J'espère que le screen sera assez parlant !

J'aimerais modifier le titre du widget (actuellement le pseudo de l'utilisateur connecté) pour qu'il prenne la couleur du groupe de l'utilisateur en question.
Par exemple, mon groupe d'administration étant en jaune, je souhaite que mon pseudo apparaisse en jaune… Ainsi de suite pour tous mes groupes. Smile

Ensuite, j'aimerais ajouter des informations du profil de l'utilisateur concerné sur mon widget !
Exemple : J'ai une case sur les profils qui se nomme "Grade".
J'aimerais ajouter sur mon widget, sous les MP, une phrase "Grade : "xxx"" remplaçant le terme "xxx" par le terme que l'utilisateur aura rempli sur son profil.

Je suis trèèèèèès loin d'être une professionnelle du codage, mais voici ce que j'utilise pour le moment :

Titre du widget :
Code:
<span class="js-username"></span>

Source du widget :
Code:
<span class="js-avatar"></span><br /><span style="font-size: 13px;"><span style="color: #EEEEEE;">Messages :</span></span> <span class="js-user_posts"></span><br /><span style="font-size: 13px;"><span style="color: #EEEEEE;">Messages privés :</span></span> <span class="js-user_nb_privmsg"></span><br />

Page JS
Code:
$(function(){
    $.each(_userdata, function(key, value){
        $(".js-" + key).html(value);
    });
});

Mercii beaucoup d'avance pour le temps que vous m'accorderez. Bizz


Dernière édition par Miss Terry le Jeu 2 Mar 2023 - 0:17, édité 1 fois
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Paramétrer un widget

Message par Toryudo Mer 1 Mar 2023 - 15:05

Bonjour !

Alors puisqu'on ne sait rien de votre forum, je vais faire au mieux :p
On ne pourra pas avoir toutes les informations avec les données _userdata de base (notamment les données de groupes) donc on va passer par le profil pour récupérer le reste : le nom de l'utilisateur avec la bonne couleur et les autres champs.

Le _userdata["user_id"] va nous permettre d'identifier la page profil de la personne actuellement connectée (toujours de la forme https://adressefourm/uxxxxxx où xxxxxx sera donc l'identifiant donné dans _userdata["user_id"]).

Code:
$(function(){
  $.get('/u' + _userdata["user_id"], function(data){

  });
});

Dans le bloc $.get, data contient tout le code HTML de la page profil.
Ensuite, pour récupérer le nom d'utilisateur avec la couleur sur phpbb2 classique non modifié, dans la page profil, il correspond à '.h_member span', ce qui donnerait donc :

Code:
$(function(){
  $.get('/u' + _userdata["user_id"], function(data){
    $('.js-username').html($(data).find('.h_member span').prop('outerHTML'));
  });
});


Maintenant, pour récupérer d'autres champs du profil, j'ai écrit un script qui permet d'enrichir les données du _userdata.
Pour ça, je prends les noms des champs du profil (ex : "Grade : "), mis en minuscule (ex : "grade : "), sans accents (ex : "grade : "), sans caractères autres que les lettres de l'alphabet (ex : "grade  "), les espaces en bout supprimés (ex : "grade") et les espaces restants remplacés par des _ (ex : "grade")
La valeur du champ "Grade : " devient donc accessible dans _userdata['grade'] :

Code:
$(function(){
  $.get('/u' + _userdata["user_id"], function(data){
    $('.js-username').html($(data).find('.h_member span').prop('outerHTML'));
    $(data).find("tr[id^='field_id-']").each(function(){
      let title = $(this).find('.gen:first').html();
      let data = $(this).find('.field_uneditable').html();

      title = title.toLowerCase(); // On met tout en minuscule
      title = title.replaceAll('&nbsp;', ''); // On retire les &nbsp;
      title = title.normalize("NFD").replace(/\p{Diacritic}/gu, ""); // On supprime les accents
      title = title.replaceAll(/[^a-zA-Z ]/g, ''); // On ne garde que les lettres et les espaces
      title = title.trim(); // On supprime les doubles espaces
      title = title.replaceAll(' ', '_').toLowerCase(); // On remplace les espaces par des _

      _userdata[title] = data;
    });
  });
});


Ne reste plus qu'à remettre votre code à la fin :

Code:
$(function(){
  $.get('/u' + _userdata["user_id"], function(data){
    $('.js-username').html($(data).find('.h_member span').prop('outerHTML'));
    $(data).find("tr[id^='field_id-']").each(function(){
      let title = $(this).find('.gen:first').html();
      let data = $(this).find('.field_uneditable').html();

      title = title.toLowerCase(); // On met tout en minuscule
      title = title.replaceAll('&nbsp;', ''); // On retire les &nbsp;
      title = title.normalize("NFD").replace(/\p{Diacritic}/gu, ""); // On supprime les accents
      title = title.replaceAll(/[^a-zA-Z ]/g, ''); // On ne garde que les lettres et les espaces
      title = title.trim(); // On supprime les doubles espaces
      title = title.replaceAll(' ', '_'); // On remplace les espaces par des _

      _userdata[title] = data;
    });
  }).done(function() {
    $.each(_userdata, function(key, value){
      $(".js-" + key).html(value);
    });
  });
});

Et normalement, si je ne me suis pas trompé, un champ <span class="js-grade"></span> aura la valeur qui a été entrée pour le "Grade : " dans le profil.
PS : il va falloir changer la class js-username parce que sinon, le username avec couleur récupéré sera écrasé par celui sans couleur du _userdata. Ou alors, on remplace directement la valeur _userdata["username"] par ce qu'on a récupéré dans le profil, comme ceci :

Code:
$(function(){
  $.get('/u' + _userdata["user_id"], function(data){
    _userdata["username"] = $(data).find('.h_member span').prop('outerHTML');
    $(data).find("tr[id^='field_id-']").each(function(){
      let title = $(this).find('.gen:first').html();
      let data = $(this).find('.field_uneditable').html();

      title = title.toLowerCase(); // On met tout en minuscule
      title = title.replaceAll('&nbsp;', ''); // On retire les &nbsp;
      title = title.normalize("NFD").replace(/\p{Diacritic}/gu, ""); // On supprime les accents
      title = title.replaceAll(/[^a-zA-Z ]/g, ''); // On ne garde que les lettres et les espaces
      title = title.trim(); // On supprime les doubles espaces
      title = title.replaceAll(' ', '_'); // On remplace les espaces par des _

      _userdata[title] = data;
    });
  }).done(function() {
    $.each(_userdata, function(key, value){
      $(".js-" + key).html(value);
    });
  });
});

Et dans ce cas, plus de modif à faire, ça doit passer !
Toryudo

Toryudo
Aidactif
Aidactif

Masculin
Messages : 1349
Inscrit(e) le : 31/03/2020

https://deus-academia.forumactif.com/
Toryudo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Paramétrer un widget

Message par Invité Jeu 2 Mar 2023 - 0:19

Bonsoir !

Je te remercie beaucoup pour ton aide. Very Happy
Je ne doute nullement du fait que ça fonctionne parfaitement, je note donc le sujet en résolu. Je m'empresserais d'aller tester tout ça rapidement !
Merci encore Hi
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Paramétrer un widget

Message par Chacha Jeu 2 Mar 2023 - 9:11

Paramétrer un widget 4qhGdLE
Bienvenue sur le forum de support de Forumactif

Puisque vous êtes nouveau, voici quelques sujets susceptibles de vous intéresser :
N'hésitez pas à ouvrir un nouveau sujet si vous ne trouvez pas votre réponse.
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 69301
Inscrit(e) le : 21/08/2010

https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum