BBcode personnalisé et balise [code]

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

Résolu BBcode personnalisé et balise [code]

Message par DidgeriDude le Jeu 25 Sep 2014 - 19:29

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://neverwinter.forumactif.org/

Description du problème


Bonjour à tous.

Le souci que je rencontre fait suite à l'ajout de BBcode personnalisé dans le forum que j'administre.
J'utilise le code ci-dessous pour mettre en forme des messages à l'aide de balises personnalisées. Le code est simple : il ne fait que remplacer les occurrences du BBcode par un <span class="xxx">[...]</span> adéquat dans le corps des messages.
Le souci est qu'il modifie toutes les occurrences, or il serait judicieux que celles situées entre des balises code et /code ne soient pas affectées.

Voici le script :
Code:
$(function() {

/*
    L'objet /balises/ a pour identifiant la balise
    et pour valeur le nom de la classe <span> pour la mise en forme
*/

    var balises = {
        rech: 'recherche',
        rare: 'rare',
        epic: 'epique',
        lgnd: 'legendaire',
        car: 'caracteristique',
        stat: 'statistique',
        tal: 'talent',
        pwr: 'pouvoir'
    };

    $("div.postbody div.content").each(function() {
        var $post = $(this);
        var contenu = $post.html();
           
        for (var bal in balises) {
            var motif = new RegExp("\\[" + bal + "\\](.*?)\\[\\/" + bal + "\\]","g");
            var remplacement = '<span class="' + balises[bal] + '">$1</span>';
   
            if (motif.test(contenu)) {
                contenu = contenu.replace(motif, remplacement);
            }
        }

        $post.html(contenu);
    });
});

J'ai bien une idée : encapsuler mon motif dans un truc du genre
<code>.* + motif + .*</code>,
et faire un test dessus, mais ça ne marche pas. Je pense que mon expression régulière est bancale.
Si vous avez une idée, merci d'avance.

Didg'.


Dernière édition par DidgeriDude le Sam 11 Oct 2014 - 16:46, édité 1 fois

DidgeriDude
Nouveau membre

Messages : 3
Inscrit(e) le : 25/09/2014

http://neverwinter.forumactif.org/
DidgeriDude a été remercié(e) par l'auteur de ce sujet.

Résolu Re: BBcode personnalisé et balise [code]

Message par Self le Jeu 2 Oct 2014 - 16:13

..
Bonjour et Bienvenue
sur le Forum des Forums ForumActif
Vu que vous êtes nouveau, voici quelques sujets importants :
Sécurité : mail de fondation - Ce qu'il ne faut pas faire
N'hésitez pas à ouvrir un nouveau sujet si vous ne trouvez pas votre réponse Wink

..Bonjour,

Nous n'avons plus de nouvelle de l'auteur de ce sujet depuis plus de 7 jours. Nous considérons donc ce problème comme résolu ou abandonné. La prochaine fois, merci de nous tenir au courant de l'évolution de votre problème, ou à faire un UP régulièrement ! Wink

Ce sujet est corbeillé (rappel de pourquoi), merci d'ouvrir un nouveau sujet si nécessaire, en respectant les Règles générales du forum.

A bientôt sur ForumActif Smile

Self
+ Hyperactif +

Masculin
Messages : 3710
Inscrit(e) le : 13/06/2013

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

Résolu Re: BBcode personnalisé et balise [code]

Message par Self le Jeu 2 Oct 2014 - 16:25

Replacé à la demande de l'auteur !

Self
+ Hyperactif +

Masculin
Messages : 3710
Inscrit(e) le : 13/06/2013

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

Résolu Re: BBcode personnalisé et balise [code]

Message par DidgeriDude le Jeu 2 Oct 2014 - 16:35

Bonjour à tous.

Je me réponds à moi-même et vous propose une solution à ce problème. Elle n'est pas des plus élégantes d'un point de vue algorithmique, mais a le mérite de fonctionner.
Le principe est simple : préfixer les balises BBcode personnalisées situées entre des balises code afin que celles-ci soient ignorées durant le remplacement global, puis enlever ce préfixe pour leur redonner leur nom original.

Code:
$(function() {

/*
    L'objet /balises/ a pour identifiant la balise
    et pour valeur le nom de la classe <span> pour la mise en forme
*/

    var balises = {
        rech: 'recherche',
        rare: 'rare',
        epic: 'epique',
        lgnd: 'legendaire',
        car: 'caracteristique',
        stat: 'statistique',
        tal: 'talent',
        pwr: 'pouvoir'
    };

    $("div.postbody div.content").each(function() {

        var $post = $(this);

        for (var bal in balises) {
           
            /*
                Pour modifier les balises situées entre des balises de codes
            */
            var motif1 = new RegExp("\\[(\\/?)" + bal + "\\]","g");
            var rplmt1 = '[$1code' + bal + ']';
           
            /*
                Pour remplacer les balises
            */
            var motif = new RegExp("\\[" + bal + "\\](.*?)\\[\\/" + bal + "\\]","g");
            var remplacement = '<span class="' + balises[bal] + '">$1</span>';

            /*
                Pour rétablir les noms originaux des balises
            */
            var motif2 = new RegExp("\\[(\\/?)code" + bal + "\\]","g");
            var rplmt2 = '[$1' + bal + ']';
           
            $post
                .find('dl.codebox > dd > code').each(function() {
                    $(this).html($(this).html().replace(motif1, rplmt1));
                })
                .end()
                .html($post.html().replace(motif, remplacement))
                .find('dl.codebox > dd > code').each(function() {
                    $(this).html($(this).html().replace(motif2, rplmt2));
                })
                .end();
        }
    });
});

Bien que le sujet soit résolu, je ne le signale pas encore comme tel afin de me laisser 3/4 jours, à vous ou à moi-même, pour proposer une solution qui relève moins de la bidouille Smile

DidgeriDude
Nouveau membre

Messages : 3
Inscrit(e) le : 25/09/2014

http://neverwinter.forumactif.org/
DidgeriDude a été remercié(e) par l'auteur de ce sujet.

Résolu Re: BBcode personnalisé et balise [code]

Message par Ea le Mar 7 Oct 2014 - 19:42

Bonjour,


Je ne connaissais pas .end(), merci.

Cela a l'air déjà pas mal comme ça, moi j'aurais utilisé match et split pour ce cas-ci :

Code:
var matches = contenu.match(/<code>[\s\S]*?<\/code>/g); /* tableau avec les <code>...</code> */
var splits = contenu.split(/<code>[\s\S]*?<\/code>/g); /* tableau avec le reste */

var mash = splits[0].replace(/cloud/ig,"butt");

for(var i=0; i<matches.length; i++) {
  mash += matches[i] + splits[i+1].replace(/cloud/ig,"butt"); 
}

Ce qui donnerait en le combinant avec le premier post :

Code:
$(function() {

/*
    L'objet /balises/ a pour identifiant la balise
    et pour valeur le nom de la classe <span> pour la mise en forme
*/

    var balises = {
        rech: 'recherche',
        rare: 'rare',
        epic: 'epique',
        lgnd: 'legendaire',
        car: 'caracteristique',
        stat: 'statistique',
        tal: 'talent',
        pwr: 'pouvoir'
    };
   
    var motifs = [];
    var repls = [];
    var quickies = [];
   
    for (var bal in balises) {
      motifs.push(new RegExp("\\[" + bal + "\\](.*?)\\[\\/" + bal + "\\]","g"));
      repls.push('<span class="' + balises[bal] + '">$1</span>');
      quickies.push('[/'+bal+']');
    }

    var code_motif = /<code>[\s\S]*?<\/code>/g;

    var replaceArray = function(find, replace, indices, content) {
      for(var i=0; i < indices.length; i++) {
        content = content.replace(find[indices[i]], replace[indices[i]]);
      }
      return content;
    };
 
    $("div.postbody div.content").each(function() {
        var $post = $(this);
        var contenu = $post.html();

        /* test rapide pour voir si il y a une balise [/...] */
        var indices = [];           
        for(var i=0; i < quickies.length; i++)
          if(contenu.indexOf(quickies[i])!=-1)
            indices.push(i);

        if(indices.length==0)
          return;
         
        var matches = contenu.match(code_motif)||[];
        var splits = contenu.split(code_motif);
 
        var mash = replaceArray(motifs, repls, indices, splits[0]);

        for (var i= 0; i < matches.length; i++) {
            mash += matches[i] + replaceArray(motifs, repls, indices, splits[i+1]);
        }
 
        $post.html(mash);
    });
});

Cordialement.

Ea
Aidactif
Aidactif

Messages : 23417
Inscrit(e) le : 04/04/2008

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

Résolu Re: BBcode personnalisé et balise [code]

Message par Chacha le Sam 11 Oct 2014 - 10:59

..Bonjour,

Attention, cela fait 9 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir délester votre sujet, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, dans ce cas, :editer: votre premier message et cochez l'icône résolu

A bientôt sur ForumActif Smile


Règles Générales du Forum - Le Staff de ForumActif
Questions & Réponses Fréquentes - Trucs & Astuces
Outils Fondateurs - Perte de Mot de Passe

Chacha
Modéractif
Modéractif

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

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

Résolu Re: BBcode personnalisé et balise [code]

Message par DidgeriDude le Sam 11 Oct 2014 - 16:44

Bonjour.

Merci Ea pour ta contribution et ton code.
J'ai mis un peu de temps à le comprendre Smile

J'aime bien le principe de ta fonction, avec les tableaux de motifs, car elle se base bien sur l'analyse du contenu comme j'aimerais... Par contre, je choisirai tout de même le code que j'ai fourni car il est plus simple dans son fonctionnement.

Quand à .end(), oui c'est bien pratique pour un chaînage de méthodes ne portant pas toutes sur « l'objet de départ », mais sur des sous-ensembles de celui-ci ; il met fin au chaînage sur la partie sélectionnée par le .find(), tout en restant dans le chaînage de départ... Vraiment très pratique Smile

J'ai tenté une autre approche via une expression régulière du type :
Code:
new RegExp("\\[rare\\](.*?)\\[\\/rare\\](?!.*?<\\/code>)","g")
utilisant les lookahead négatifs, afin de rechercher une chaîne du type [rare]blabla[/rare], non suivie d'un certain nombre de caractères puis d'un </code>.
Mais ça ne marche pas...

Je passe tout de même ce sujet en résolu, mais si quelqu'un peut aller plus loin avec les regex...
Encore merci Ea pour ton aide.

Didg'.

DidgeriDude
Nouveau membre

Messages : 3
Inscrit(e) le : 25/09/2014

http://neverwinter.forumactif.org/
DidgeriDude a été remercié(e) par l'auteur de ce sujet.

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


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