BBcode traitement qui foire !

**Zone-51** · 30/03/2012, 14h22

Bonjour toutes la communauté()es.

J'expose mon problème :
J'ai un formulaire qui contient une fonction JavaScript permettant l'insertion des balise BBcode et une autre fonction permettant la visualisation en direct du code dans un div situé en dessous du formulaire.
Toutes mais balises fonction bien sauf pour la balise ["code"]["/code"], car je souhaiterais si possible intégrer les couleurs syntaxiques du code (ce serait exclusivement du code php).

Pour la visualisation du code en respectant les couleurs syntaxiques j'utilise une nouvelle fois du JavaScript.(dp.SyntaxHighlighter pour ceux qui ne connaisse pas)

Venons en au vif du sujet en quelque images histoire que vous comprenez bien le problème à résoudre.
Dans mon formulaire la 1er fonction javascript traduit les balises ["code"]["/code"] en <textarea name="code" class="php">$1</textarea>

J'ai besoin pour la suite que ce soit entre les balises <textarea> pour l'appel de la fonction dp.SyntaxHighlighter !

On constatera que dans le <textarea> a chaque saut de ligne les /n ont été traduit par des </br> et c'est la que le problème commence pour moi.
(qu'il soit visible lors de la visualisation dans le <textarea> cela ne me dérange pas)
Quand j'envoie mon formulaire il repasse par un script PHP , qui permet le stockage dans une bdd et donc par la suite une relecture.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<?    	
//Fonction de transformation du BBcode
    	function bbcode($texte)
		{
			// Conversion des caractères HTML
			$texte = htmlentities($texte, ENT_QUOTES | ENT_HTML5, "UTF-8");
			// Tableau de Regex
			$format_search = array(
 
			//les smileys :)
			'#:angel:#is',
			'#:angry:#is',
			'#:cha-ching:#is',
			'#:cool:#is',
			'#:grin:#is',
			'#:happy:#is',
			'#:hmm:#is',
			'#:kissy:#is',
			'#:nervous:#is',
			'#:sad:#is',
			'#:shame:#is',
			'#:surprise:#is',
			'#:tongue:#is',
			'#:vault:#is',
			'#:weepy:#is',
			'#:winky:#is',
 
			//fin des smileys
 
			'#\[b\](.*?)\[/b\]#is', // Gras (Texte en gras[/b]
			'#\[i\](.*?)\[/i\]#is', // Italique (Texte en italique
			'#\[u\](.*?)\[/u\]#is', // Souligné (Texte souligné)
			'#\[s\](.*?)\[/s\]#is', // Surligné (Texte surligné)
 
			'#\[size=([0-9]{1,2})\](.+?)\[\/size\]#is', //taille du texte !
 
			'#\[align=left\](.*?)\[/left\]#is', // align gauche)
			'#\[align=center\](.*?)\[/center\]#is', // align centre)
			'#\[align=justify\](.*?)\[/justify\]#is', // align justifié)
			'#\[align=right\](.*?)\[/right\]#is', // align droite)
 
			'#\[float=left\](.*?)\[/left\]#is', // align gauche pour les images)			
			'#\[float=right\](.*?)\[/right\]#is', // align droite pour les images)
 
			'#\[url=((?:ftp|https?)://.*?)\](.*?)\[/url\]#is', // Lien avec description 
			'#\[url\]((?:ftp|https?)://.*?)\[/url\]#is', // Lien sans description 
 
			'#\[img=(https?://.*?\.(?:jpg|jpeg|gif|png|bmp))\](.*?)\[/img\]#is', // Image 
 
			'#\[h([1-6])\](.*?)\[\/h[1-6]\]#is', //pour les titre !
 
			'#\[couleur=\#?([A-F0-9]{3}|[A-F0-9]{6})\](.*?)\[/couleur\]#is', // Couleur texte 
 
			'#\[style=question](.*?)\[/style\]#is',
			'#\[style=important](.*?)\[/style\]#is', //ce sont les styles avec img et par exemple Question
			'#\[style=notice](.*?)\[/style\]#is',
			'#\[style=stop](.*?)\[/style\]#is',
			'#\[code\](.*?)\[/code\]#is' //Code...<?php
 
			);
 
			// Tableau de transformation
			$format_replace = array(
			//debut de transformation des smileys !
			'<img src="images/bbcode/angel.png">',
			'<img src="images/bbcode/angry.png">',
			'<img src="images/bbcode/cha-ching.png">',
			'<img src="images/bbcode/cool.png">',
			'<img src="images/bbcode/grin.png">',
			'<img src="images/bbcode/happy.png">',
			'<img src="images/bbcode/hmm.png">',
			'<img src="images/bbcode/kissy.png">',
			'<img src="images/bbcode/nervous.png">',
			'<img src="images/bbcode/sad.png">',
			'<img src="images/bbcode/shame.png">',
			'<img src="images/bbcode/surprise.png">',
			'<img src="images/bbcode/tongue.png">',
			'<img src="images/bbcode/vault.png">',
			'<img src="images/bbcode/weepy.png">',
			'<img src="images/bbcode/winky.png">',			
			//Fin de la transformation.
 
			'<strong>$1</strong>',
			'<em>$1</em>',
			'<span style="text-decoration: underline;">$1</span>',
			'<span style="text-decoration: line-through;">$1</span>',
 
			'<span style="font-size: $1px;">$2</span>',
 
			'<div style="text-align: left;">$1</div>',
			'<div style="text-align: center;">$1</div>',
			'<div style="text-align: justify;">$1</div>',
			'<div style="text-align: right;">$1</div>',
 
			'<div style="float:left;">$1</div>',
			'<div style="float:right;">$1</div>',
 
			'<a href="$1" target="_blank">$2</a>',
			'<a href="$1" target="_blank">$1</a>',
 
			'<img src="$1" title="$2" />',
 
			'<h$1>$2</h$1>',
 
			'<span style="color: #$1;">$2</span>',
 
			'<div id="question"><div class="img"></div><span style="color:#0066FF">Question : $1</span></div>',
			'<div id="important"><div class="img"></div><span style="color:#0066FF">Important : $1</span></div>',
			'<div id="notice"><div class="img"></div><span style="color:#FFFFFF">Notice : $1</span></div>',
			'<div id="stop"><div class="img"></div><span style="color:#FFFFFF">Stop : $1</span></div>',
 
			'<textarea name="code" class="php">$1</textarea>'
 
			);
 
			// Conversion du texte
			$texte = preg_replace($format_search, $format_replace, $texte);
			// Mise en forme du texte
			$texte = nl2br($texte);
			return $texte;
		}		
?>

Voici un exemple de résultat obtenue :

On peut constater que le résultat et "incorrect" car j'ai le même problème que pendant la visualisation c'est dire les saut de ligne sont bien traduit par des </br> mais ils sont justement visible et la c'est juste pas possible de laisser comme ça.

J'ai testé la fonction dp.SyntaxHighlighter seul sans passer par le script PHP histoire de voir si c'était elle la coupable mais non elle affiche bien le code, elle créer les saut de ligne sans afficher les </br> générer, donc j'en vient a la conclusion que c'est le fait d'utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part