Editeur WYSIWYG problème

gregroar Messages postés 42 Date d'inscription samedi 13 juin 2009 Statut Membre Dernière intervention 19 novembre 2010 - 19 nov. 2010 à 21:11
Le grand Jisay Messages postés 100 Date d'inscription mardi 8 mai 2007 Statut Membre Dernière intervention 18 février 2011 - 24 nov. 2010 à 09:31
Bonjour, je m'inspire de http://www.javascriptfr.com/codes/SAISIE-WYSIWYG_24237.aspx, mixée à un tutoriel du site du zéro.
Pouriez vous m'aider?
J'ai essayé d'ajouter l'insertion de smileys et de liens et images via une fenetre popup javascript, mais je n'arrive pas à insérer dans le textarea, je ne comprends pas bien quelle est la variable qui contient le texte html.
Est-ce Fen, tmp, document, txt?
je bloque depuis plusieurs jours.
si vous avez le temps de m'aider, je vous enverrais ma source.



mon code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML Lang= "fr">

<HEAD>
<!--———————————————————————————————————————--->
<title>POST</title>
<!--————————————————————————————————————————-->
<meta http-equiv="cache-control"
content="no-cache" />
<meta http-equiv="content-Language"
content="fr-FR">
<meta http-equiv="content-type"
content="text/html; charset=ISO-8859-1" />
<meta http-equiv="expires"
content="0">
<meta http-equiv="imagetoolbar"
content="no" />
<meta http-equiv="Pragma"
content="no-cache">
<meta name="robots"
content="follow" />
<!--—————————————————————————————————————————————————————————————————-->
<LINK REL="stylesheet"
TYPE="text/css"
HREF="wysiwyg.css">
<!--—————————————————————————————————————————————————————————————————-->
<Script type="Text/JavaScript"
src="wysiwyg.js"></Script>

<!--—————————————————————————————————————————————————————————————————-->
<script type="text/javascript">
<!--
function getXMLHttpRequest() {
var xhr = null;

if (window.XMLHttpRequest || window.ActiveXObject) {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
} else {
xhr = new XMLHttpRequest();
}
} else {
alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
return null;
}

return xhr;
}

function view(textareaId, viewDiv){
var content = encodeURIComponent(document.getElementById(textareaId).value);
var xhr = getXMLHttpRequest();

if (xhr && xhr.readyState != 0) {
xhr.abort();
delete xhr;
}

xhr.onreadystatechange = function() {
if (xhr.readyState 4 && xhr.status 200){
document.getElementById(viewDiv).innerHTML = xhr.responseText;
} else if (xhr.readyState == 3){
document.getElementById(viewDiv).innerHTML = "
Chargement en cours...
";
}
}

xhr.open("POST", "view.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("string=" + content);
}





function insertTag(startTag, endTag, textareaId, tagType) {
var field = document.getElementById(textareaId);
var scroll = field.scrollTop;
field.focus();

/* Partie 1 : on récupère la sélection */
if (window.ActiveXObject) {
var textRange = document.selection.createRange();
var currentSelection = textRange.text;
} else {
var startSelection = field.value.substring(0, field.selectionStart);
var currentSelection = field.value.substring(field.selectionStart, field.selectionEnd);
var endSelection = field.value.substring(field.selectionEnd);
}

/* Partie 2 : on analyse le tagType */
if (tagType){ switch (tagType){

case "lien":
endTag = "</lien>";
if (currentSelection) { // Il y a une sélection
if (currentSelection.indexOf("http://") 0 || currentSelection.indexOf("https://") 0 || currentSelection.indexOf("ftp://") == 0 || currentSelection.indexOf("www.") == 0) {
// La sélection semble être un lien. On demande alors le libellé
var label = prompt("Texte du lien :") || "";
startTag = "<lien url="" + currentSelection + "">";
currentSelection = label;
} else {// La sélection n'est pas un lien, donc c'est le libelle. On demande alors l'URL
var URL = prompt("Quelle est l'url du lien ?");
startTag = "<lien url="" + URL + "">";
}} else { // Pas de sélection, donc on demande l'URL et le libelle
var URL = prompt("Quelle est l'url du lien ?") || "";
var label = prompt("Texte du lien :") || "";
startTag = "<lien url="" + URL + "">";
currentSelection = label;
}break;

case "image":
endTag = " />";
if (currentSelection) { // Il y a une sélection
if (currentSelection.indexOf("http://") 0 || currentSelection.indexOf("https://") 0 || currentSelection.indexOf("ftp://") == 0 || currentSelection.indexOf("www.") == 0) {
// La sélection semble être un lien. On demande alors le libellé
var label = prompt("Description de l'image :") || "";
startTag = "_<', ':pirate:', ':zorro:', ':honte:', ':soleil:', '\'\\(', ':waw:', ':\\)', ':D', ';\\)', ':p', ':lol:', ':euh:', ':\\(', ':o', ':mechant:', 'o_O', '\\^\\^', ':\\#');

var smiliesUrl = new Array('magicien.png', 'angry.gif', 'diable.png', 'ange.png', 'ninja.png', 'pinch.png', 'pirate.png', 'zorro.png', 'rouge.png', 'soleil.png', 'pleure.png', 'waw.png', 'smile.png', 'heureux.png', 'clin.png', 'langue.png', 'rire.gif', 'unsure.gif', 'triste.png', 'huh.png', 'mechant.png', 'blink.gif', 'hihi.png', 'siffle.png');
var smiliesPath = "http://www.siteduzero.com/Templates/images/smilies/";

field = field.replace(/&/g, '&');
field = field.replace(/</g, '<').replace(/>/g, '>');
field = field.replace(/\n/g, '
').replace(/\t/g, ' ');

field = field.replace(/([\s\S]*?)<\/gras>/g, ' $1 ');
field = field.replace(/([\s\S]*?)<\/italique>/g, '$1');
field = field.replace(/<lien>([\s\S]*?)<\/lien>/g, '[$1 $1]');
field = field.replace(/<lien url="([\s\S]*?)">([\s\S]*?)<\/lien>/g, '[$1 $2]');
field = field.replace(/([\s\S]*?)<\/image>/g, '');
field = field.replace(/<citation nom="(.*?)">([\s\S]*?)<\/citation>/g, '
Citation : $1
$2
');
field = field.replace(/<citation lien="(.*?)">([\s\S]*?)<\/citation>/g, '
[$1 Citation]
$2
');
field = field.replace(/<citation nom="(.*?)" lien="(.*?)">([\s\S]*?)<\/citation>/g, '
[$2 Citation : $1]
$3
');
field = field.replace(/<citation lien="(.*?)" nom="(.*?)">([\s\S]*?)<\/citation>/g, '
[$1 Citation : $2]
$3
');
field = field.replace(/<citation>([\s\S]*?)<\/citation>/g, '
Citation
$1
');
field = field.replace(/<taille valeur="(.*?)">([\s\S]*?)<\/taille>/g, '$2');

for (var i=0, c=smiliesName.length; i<c; i++) {
field = field.replace(new RegExp(" " + smiliesName[i] + " ", "g"), " ");
}

document.getElementById(previewDiv).innerHTML = field;
}
}

//-->
</script>
</head>




<select size=1
id="selfnt"
style="background-color:#ffffff"
onchange="FontChx(this);">
<optgroup label="Police">
<option>Arial</option>
<option>Comic sans MS</option>
<option>Courier</option>
<option>Courier New</option>
<option>Fixedsys</option>
<option>Garamond</option>
<option>Georgia</option>
<option>Lucida Console</option>
<option>MS Sans Serif</option>
<option>MS Serif</option>
<option>Time</option>
<option>Verdana</option>
</optgroup>
</select>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
<select size=1
id="seltai"
style="background-color:#ffffff"
onchange="TailChx(this);">
<optgroup label="Taille">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</optgroup>
</select>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->




























','</lien>','tmp','lien');" />
',' ','tmp','image');" />














_<" onclick ="insertTag(' >_< ', '', 'tmp');" />








<!--
pour FF :
execCommand("createlink",false,"http://....")
-->















<!--—————————————————————————————————————————————————————————————————-->
<!-- laisser les couleurs sont forme rgb=(r,g,b)
########################################### -->

<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->

<form action<gras><?php $destination
'traitementmessage'; echo '"'.$destination.'.php"'; ?>
method= "post" name= "frm">
<label for='titre'>titre : </label>


<textarea
name="txt"
id="txt"
style=" font-family:Verdana;display:none;position:absolute;font-size:12px;border-color:#000000;border:1px inset gray;
overflow:auto;top:110;width:98%;height:65%;color:#400040;background-color:#ffffff;"></textarea>
</form>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->




<label id="CoulQui"></label> |
----
Choix,
,
Valider

Abandonner
|
----
,
----
Rouge,
,
,
----
Vert,
,
,
----
Bleu,




<!--—————————————————————————————————————————————————————————————————-->
</html>
<!--—————————————————————————————————————————————————————————————————-->

1 réponse

Le grand Jisay Messages postés 100 Date d'inscription mardi 8 mai 2007 Statut Membre Dernière intervention 18 février 2011 2
24 nov. 2010 à 09:31
Salut,

Je ne connais pas ce WYSIWYG.

Déjà, pourrais-tu poster ton code via le flag balise de l'éditeur. Je n'ai meme pas envie de le lire tellement il est mal structuré et ce n'est pas à moi de le faire.

Ensuite, je te conseillerai peut-être d'utiliser un éditeur un peu plus connu genre TinyMCE ou CKEditor qui sont bien documentés.

Bien à toi,

Le grand Jisay
0
Rejoignez-nous