Previsualisation BBcode

Sujet résolu

27 février 2009 à 14:39:16

Bonjour,

Je debute dans le javascript et j'essaye d'installer le bbcode [b][/b] donc j'ai commencer a mettre ceci :

function bold(t){

var question = prompt("Insérez ici le texte que vous désirez mettre en [b] Gras [/b]","");
if(question)
{
texte = "[b]"+question+"[/b]";
document.post.news.value+=" "+texte;
}
else
{
texte = "";
document.post.news.value+=" "+texte;
}
}

Et dans la prévisualisation il m'indique [b]mon texte[/b] et pas le nom en gras ce que je voudrait

Pour la prévisualisation j'ai mit ceci

var timer=0;
var ptag=String.fromCharCode(5,6,7);

function  previsualisation() 
	{
		t=document.post.news.value 
		t=code_to_html(t)
		if (document.getElementById) document.getElementById("prev").innerHTML=t
		if (document.post.auto.checked) timer=setTimeout(previsualisation,10)
		// <!-- le "1" est le temps que met le texte à s'afficher, "1" : le texte s'affichera en même temps que l'on écrit (en s) -->
	}

function automatique() 
	{
	if (document.post.auto.checked) previsualisation() // <!-- si on a cocher la case d'aperçu automatique -->
	}

// Tout le code qui suit c'est pour transformer toutes les balises, comme les preg_replace en PHP -->
	
function deblaie(reg,t) 
	{
		news=new String(t);
		return news.replace(reg,'$1\n');
	}

function remblaie(t) 
	{
		news=new String(t);
		return news.replace(/\n/g,'');
	}

function remplace_tag(reg,rep,t) 
	{
		news=new String(t);
		return news.replace(reg,rep);
	}

function nl2br(t) 
	{
		news=new String(t);
		return news.replace(/\n/g,'<br/>');
	}

function nl2khol(t) 
	{
		news=new String(t);
		return news.replace(/\n/g,ptag);
	}

function unkhol(t) 
	{
		news=new String(t);
		return news.replace(new RegExp(ptag,'g'),'\n');
	}  

function Lien() 
{
	i = document.titre0.selectedIndex;
	if (i == 0) return;
	url = document.titre0.options[i].value;
}
	
function smilies(img)
	{
	window.document.post.news.value += '' + img + '';
	}

Merci pour votre aide

tyu1000

27 février 2009 à 16:18:52

Heuh, la fonction code_to_html, elle est où? C'est bien elle qui transforme ton BBcode en code HTML?

staff

27 février 2009 à 22:15:36

Oui en faite c'est pour les smileys la voici

function code_to_html(t) 
	{
		// smilies Smile <!-- on oublie pas les smilies -->
		t=remplace_tag(/:1:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/amazing-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:2:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/bad_smile-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:3:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/beaten-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:4:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/big_smile-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:5:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black_heart-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:6:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/cry-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:7:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/electric_shock-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:8:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/exciting-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:9:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/eyes_droped-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:10:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/girl-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:11:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/greedy-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:12:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/grimace-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:13:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/haha-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:14:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/horror-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:15:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/money-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:16:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/nothing-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:17:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/nothing_to_say-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:18:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/scorn-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:19:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/secret_smile-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:20:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/shame-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:21:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/shocked-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:22:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/super_man-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:23:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/the_iron_man-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:24:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/victory-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)

		t=remplace_tag(/:25:/g,'<img src="'+PATH_HTTP+'/icones/smileys-black/what-48.png" alt="" />',t) 
		t=remblaie(t)
		t=unkhol(t)
		t=nl2br(t)
		return t
	
	}

tyu1000

28 février 2009 à 0:21:10

Et où transformes tu ton [b]texte[/b] en <b>texte</b>?

staff

28 février 2009 à 0:42:24

Justement je ne sait pas comment j'ai reussi a trouver se bout de code qui fonctionne

function bold(t){

var question = prompt("Insérez ici le texte que vous désirez mettre en [b] Gras [/b]","");
if(question)
{
texte = "[b]"+question+"[/b]";
document.post.news.value+=" "+texte;
}
else
{
texte = "";
document.post.news.value+=" "+texte;
}
}

Mais a la prévisualisation elle reste en bbcode et le texte se met pas en gras

tyu1000

28 février 2009 à 11:41:15

Bon, si j'ai bien compris ton code, la fonction bold rajoute juste le code BBcode dans ta zone de saisie. Par exemple, quand met du gras dans le site du zéro, soit tu fais

<gras>gras</gras>

, soit tu cliques sur le bouton Image utilisateur

qui te rajoutes dans la zone de saisie les balises

<gras></gras>

.

Après, tu as une fonction javascript qui te transforme le BBcode en code HTML quand tu prévisualises ton message. chez toi, c'est la fonction code_to_html, qui porte bien son nom.
Il faut que tu rajoutes dans cette fonction une étape qui transforme tout le BBcode en HTML, ou pour le gras, qui transforme [b] en <b> et [/b].
Il faut après faire pareil pour l'italique, le souligné, la taille... Ton navigateur ne connait pas le BBcode, seulement le HTML. Il faut donc que tu lui traduise, ce que tu ne fait pas pour l'instant.

Je pense qu'avec ça tu peut te débrouiller pour faire ton code.
Bon codage!!!

staff

28 février 2009 à 20:47:11

Ok voila je te remercie maintenant je voudrait rajouter du prompt comme par exemple quand on clique sur "citation" il demande en popup le nom de l'auteur comment puis je faire ? :euh:

bryou

28 février 2009 à 22:55:24

function citation() {
var citation = prompt ('Votre citation ?');
var auteur = prompt ('Quel est l\'auteur ?');
if(citation) && (auteur)
{
var ajout = '[citation="'+auteur+'"]'+citation+'[/citation]';
document.post.news.value+=" "+ajout;
}
else
{
alert ('Tu n\'a pas mis d\'auteur ou de citation !')
}
}

Bon je débute mais je pense que sa peut-être pas mal sa

staff

28 février 2009 à 23:18:55

Merci

je viens d'ajouter ton code qui ma l'air pas mal quand je clique sur citation rien ne se passe

j'ai mit ceci aussi :

t=deblaie(/(\[\/citation\])/g,t)
t=remplace_tag(/\[citation=([\s\S]*?)\](.+)\[\/citation\]/g,'<strong>Citation $1 :</strong><div class=citation>$2</div>',t)
t=remblaie(t)

Et je fait appelle avec sa :

<img style="cursor: pointer;" title="Insérer une citation. Syntaxe : [citation=AUTEUR]texte[/citation]" alt="[citation]" id="citation" name="citation" value="Citation" onclick="javascript:bbcode('[citation]', '[/citation]');return(false)" src="<?php echo(ESFD_SITE_WEB); ?>icones/bbcode/citation.gif" border="0" width="69" height="28" />

bryou

28 février 2009 à 23:23:40

si tu fait un simple:

<p onclick="citation()">Citation</p>

staff

28 février 2009 à 23:31:05

Sa fait exactement pareil

dur dur le javascript

bryou

28 février 2009 à 23:32:33

Grr un chef JS peut venir ?

Désolé je débute heiin

staff

28 février 2009 à 23:35:59

Lol je fait un récapitulatif pour pas se brouillé donc j'ai mit ta fonction

function citation() {
var citation = prompt ('Votre citation ?');
var auteur = prompt ('Quel est l\'auteur ?');
if(citation) && (auteur)
{
var ajout = '[citation="'+auteur+'"]'+citation+'[/citation]';
document.post.news.value+=" "+ajout;
}
else
{
alert ('Tu n\'a pas mis d\'auteur ou de citation !')
}
}

Ensuite on le converti en html

// balise Citation
t=deblaie(/(\[\/citation\])/g,t)
t=remplace_tag(/\[citation=([\s\S]*?)\](.+)\[\/citation\]/g,'<strong>Citation $1 :</strong><div class=citation>$2</div>',t)
t=remblaie(t)

Et je l'appelle

<img style="cursor: pointer;" title="Insérer une citation. Syntaxe : [citation=AUTEUR]texte[/citation]" alt="[citation]" id="citation" name="citation" value="Citation" onclick="citation()" src="<?php echo(ESFD_SITE_WEB); ?>icones/bbcode/citation.gif" border="0" width="69" height="28" />

Golmote

1 mars 2009 à 0:17:59

function citation() {
var citation = prompt ('Votre citation ?');
var auteur = prompt ('Quel est l\'auteur ?');
if(citation && auteur)
{
var ajout = '[citation="'+auteur+'"]'+citation+'[/citation]';
document.post.news.value+=" "+ajout;
}
else
{
alert ('Tu n\'a pas mis d\'auteur ou de citation !')
}
}

bryou

1 mars 2009 à 0:53:15

Citation : Golmote

function citation() {
var citation = prompt ('Votre citation ?');
var auteur = prompt ('Quel est l\'auteur ?');
if(citation && auteur)
{
var ajout = '[citation="'+auteur+'"]'+citation+'[/citation]';
document.post.news.value+=" "+ajout;
}
else
{
alert ('Tu n\'a pas mis d\'auteur ou de citation !')
}
}

Suis je bête !

staff

1 mars 2009 à 2:09:11

Cool sa fonctionne parfaitement je vous remercie a vous deux vraiment super de votre part, je voudrait savoir comment aussi pour le bbcode email ?

bryou

1 mars 2009 à 2:22:01

function email() {
var email = prompt ('Email monsieur ?');
if(email)
{
var ajout = '[mail]'+email+'[/mail]';
document.post.news.value+=" "+ajout;
}
else
{
alert ('Tu n\'a pas mis d\'adresse mail ! quel hont  !')
}
}

Evidemment a toi de remplacer t'es balises

staff

1 mars 2009 à 2:37:08

Cool sa fonctionne merci beaucoup pour votre aide surtout pour quelqu'un qui connait pas du tout le javascript sa fait du bien un coup de pouce