Convertisseur bbcode en html

Soyez le premier à donner votre avis sur cette source.

Snippet vu 20 806 fois - Téléchargée 28 fois

Contenu du snippet

Une fonction pour convertir du BBCode en HTML.
En utilisant le BBCode un peu spécial de GaiaOnline [ http://www.gaiaonline.com/ ], c'est-à-dire avec plus de smileys, plus de tags (comme [imgmap], [align=...], [center], [imgleft], etc...)
Il suffit de lui passer une string en premier argument et ça retourne la version HTML.
Ce script utilise principalement des fonctions pour les strings, donc ça peut aider ceux qui en savent peu là-dessus.

Source / Exemple :


// BBCode to HTML Script by WindPower [aka WindyPower]
// Please do not remove these comments
function bb2html(vari)
{
	vari=vari.replace(/:oops:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_redface.gif/img');
	vari=vari.replace(/T_T/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_crying.gif/img');
	vari=vari.replace(/:stare:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_stare.gif/img');
	vari=vari.replace(/:XD/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_xd.gif/img');
	vari=vari.replace(/:3nod:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_3nodding.gif/img');
	vari=vari.replace(/:big:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_blaugh.gif/img');
	vari=vari.replace(/:gonk:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_gonk.gif/img');
	vari=vari.replace(/:scream:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_scream.gif/img');
	vari=vari.replace(/:vein:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_stressed.gif/img');
	vari=vari.replace(/:sweat:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_sweatdrop.gif/img');
	vari=vari.replace(/:heart:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_heart.gif/img');
	vari=vari.replace(/:domo:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_domokun.gif/img');
	vari=vari.replace(/:xp:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_xp.gif/img');
	vari=vari.replace(/:whee:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_whee.gif/img');
	vari=vari.replace(/:shock:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_eek.gif/img');
	vari=vari.replace(/8\)/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_cool.gif/img');
	vari=vari.replace(/:lol:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_lol.gif/img');
	vari=vari.replace(/:x/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_mad.gif/img');
	vari=vari.replace(/:P/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_razz.gif/img');
	vari=vari.replace(/:cry:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_cry.gif/img');
	vari=vari.replace(/:evil:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_evil.gif/img');
	vari=vari.replace(/:twisted:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_twisted.gif/img');
	vari=vari.replace(/:roll:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_rolleyes.gif/img');
	vari=vari.replace(/:!:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_exclaim.gif/img');
	vari=vari.replace(/:\?:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_question.gif/img');
	vari=vari.replace(/:\?/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_confused.gif/img');
	vari=vari.replace(/:idea:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_idea.gif/img');
	vari=vari.replace(/:arrow:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_arrow.gif/img');
	vari=vari.replace(/:ninja:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_ninja.gif/img');
	vari=vari.replace(/:\|/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_neutral.gif/img');
	vari=vari.replace(/:mrgreen:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_mrgreen.gif/img');
	vari=vari.replace(/:cute:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_4laugh.gif/img');
	vari=vari.replace(/:rofl:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_rofl.gif/img');
	vari=vari.replace(/:pirate:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_pirate.gif/img');
	vari=vari.replace(/:talk2hand:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_talk2hand.gif/img');
	vari=vari.replace(/:wink:/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_wink.gif/img');
	vari=vari.replace(/;\)/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_wink.gif/img');
	vari=vari.replace(/:\(/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_sad.gif/img');
	vari=vari.replace(/:o/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_surprised.gif/img');
	vari=vari.replace(/:\)/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_smile.gif/img');
	vari=vari.replace(/:D/g,'[img]http://graphics.gaiaonline.com/images/template/smiles/icon_biggrin.gif/img');
	vari=vari.replace(/\[img]/g,'<img src="');
	vari=vari.replace(/\[\/img]/g,'" />');
	vari=vari.replace(/\[imgleft]/g,'<img style="float:left;" src="');
	vari=vari.replace(/\[\/imgleft]/g,'" />');
	vari=vari.replace(/\[imgright]/g,'<img style="float:right;" src="');
	vari=vari.replace(/\[\/imgright]/g,'" />');
	vari=vari.replace(/\[imgmap]/g,'<img ismap="ismap" src="');
	vari=vari.replace(/\[\/imgmap]/g,'" />');
	vari=vari.replace(/\[quote]/g,'<div style="background-color:#F0F0F0;"><blockquote>');
	vari=vari.replace(/\[\/quote]/g,'</blockquote></div>');
	vari=vari.replace(/\[code]/g,'<div style="color:#006600;font-weight:bold;">Code :</div><div style="color:#333333;background-color:#F0F0F0;"><code>');
	vari=vari.replace(/\[\/code]/g,'
</div>');
vari=vari.replace(/\[b]/g,'<strong>');
vari=vari.replace(/\[\/b]/g,'</strong>');
vari=vari.replace(/\[center]/g,'<center>');
vari=vari.replace(/\[\/center]/g,'</center>');
vari=vari.replace(/\[i]/g,'<i>');
vari=vari.replace(/\[\/i]/g,'</i>');
vari=vari.replace(/\[u]/g,'<u>');
vari=vari.replace(/\[\/u]/g,'</u>');
vari=vari.replace(/\[strike]/g,'<strike>');
vari=vari.replace(/\[\/strike]/g,'</strike>');
vari=vari.replace(/\[\/color]/g,'</font>');
vari=vari.replace(/\[\/size]/g,'</div>');
vari=vari.replace(/\[\/align]/g,'</div>');
vari=vari.replace(/\[\*]/g,'<li>');
vari=vari.replace(/\r\n|\r|\n/g, '<br />')
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,5)=='[url=')
{
var n=0;
var m=0;
for(var j=i+4;j<=vari.length;j++)
{
if(vari.substr(j,1)==']' && n==0)
{
n=j;
}
}
if(n!=0)
{
var ur=vari.substring(i+5,n);
for(var k=n;k<=vari.length;k++)
{
if(vari.substr(k,6)=='/url' && m==0)
{
m=k;
}
}
if(m!=0)
{
var st=vari.substring(n+1,m);
var fina='<a href="'+ur+'" target="_blank">'+st+'</a>';
vari=vari.substr(0,i)+fina+vari.substr(m+6);
}
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,5)=='[url]')
{
var b=0;
for(var k=i;k<=vari.length;k++)
{
if(vari.substr(k,6)=='/url' && b==0)
{
b=k;
}
}
if(b!=0)
{
var ur=vari.substring(i+5,b);
var fina='<a href="'+ur+'" target="_blank">'+ur+'</a>';
vari=vari.substr(0,i)+fina+vari.substr(b+6);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,8)=='[quote="')
{
var n=0;
for(var j=i+8;j<=vari.length;j++)
{
if(vari.substr(j,2)=='"]' && n==0)
{
n=j;
}
}
if(n!=0)
{
var au=vari.substring(i+8,n);
var fina='<div style="color:#006600;font-weight:bold;">'+au+' wrote :</div><div style="background-color:#F0F0F0;"><blockquote>';
vari=vari.substr(0,i)+fina+vari.substr(n+2);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,7)=='[color=')
{
var n=0;
for(var j=i+7;j<=vari.length;j++)
{
if(vari.substr(j,1)==']' && n==0)
{
n=j;
}
}
if(n!=0)
{
var co=vari.substring(i+7,n);
var fina='<font color="'+co+'">';
vari=vari.substr(0,i)+fina+vari.substr(n+1);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,6)=='[size=')
{
var n=0;
for(var j=i+7;j<=vari.length;j++)
{
if(vari.substr(j,1)==']' && n==0)
{
n=j;
}
}
if(n!=0)
{
var si=vari.substring(i+6,n);
var fina='<div style="font-size:'+si+'px;line-height:normal;">';
vari=vari.substr(0,i)+fina+vari.substr(n+1);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,7)=='[align=')
{
var n=0;
for(var j=i+7;j<=vari.length;j++)
{
if(vari.substr(j,1)==']' && n==0)
{
n=j;
}
}
if(n!=0)
{
var al=vari.substring(i+7,n);
var fina='<div align="'+al+'">';
vari=vari.substr(0,i)+fina+vari.substr(n+1);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,6)=='[list]')
{
var n=0;
for(var j=i+6;j<=vari.length;j++)
{
if(vari.substr(j,7)=='/list' && n==0)
{
n=j;
}
}
if(n!=0)
{
var li=vari.substring(i+6,n);
var fina='<ul>'+li+'</ul>';
vari=vari.substr(0,i)+fina+vari.substr(n+7);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,8)=='[list=1]')
{
var n=0;
for(var j=i+6;j<=vari.length;j++)
{
if(vari.substr(j,7)=='/list' && n==0)
{
n=j;
}
}
if(n!=0)
{
var li=vari.substring(i+8,n);
var fina='<ol>'+li+'</ol>';
vari=vari.substr(0,i)+fina+vari.substr(n+7);
}
}
}
for(var i=0;i<=vari.length;i++)
{
if(vari.substr(i,8)=='[list=a]')
{
var n=0;
for(var j=i+6;j<=vari.length;j++)
{
if(vari.substr(j,7)=='/list' && n==0)
{
n=j;
}
}
if(n!=0)
{
var li=vari.substring(i+8,n);
var fina='<ol type="a">'+li+'</ol>';
vari=vari.substr(0,i)+fina+vari.substr(n+7);
}
}
}
return vari;
}
</code>

Conclusion :


Ca faisait longtemps que je n'avais plus posté de source... et me revoilà, plus vieux, mais aussi plus rouillé. C'est pourquoi je suis sur que mon code pourrait être plus rapide, car il rame vraiment quand le texte prend les longueurs faramineuses...
Un éditeur avec toutes les fonction qui vous souhaitez est disponible ici :
http://gaiaonline.ga.funpic.org/format/

A voir également

Ajouter un commentaire

Commentaires

Beninho
Messages postés
2
Date d'inscription
jeudi 22 juin 2006
Statut
Membre
Dernière intervention
14 mars 2008

Salut,
bon code, qui m'a bien aidé pour faire une saisie plus facile, version BBCode pour mon site web.
J'ai apporté quelques ajouts,
- par exemple avec
 on peut vraiment taper du code html tout en l'affichant. Il suffit de remplacer entre les balises [code] et 
les < et > par des < et >
- une balise pour changer la couleur de fond du texte (et juste du texte)
- plus de type de liste (pas dur à faire ;-) )
- ...

Merci beaucoup pour ce code !
coucou747
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
30
Salut

c'est pas une bonne méthode : tu mets des pregs partout, alors que t'as que des expressions fixes, tu gaspille le processeur !

de plus, si je mets :

/center

je n'aurais pas de message, et je provoque une erreur de validation...

fais de meilleures expressions régulières...

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.