/***** TOUTES LES FONCTIONS DE BBCODE ********/ bbcodeBaliseDesc = new Array(); bbcodeBaliseDesc["b"] = "Mettre le texte en gras. [b]Texte[/b]."; bbcodeBaliseDesc["i"] = "Mettre le texte en italique. [i]Texte[/i]."; bbcodeBaliseDesc["u"] = "Mettre le texte en souligné. [u]Texte[/u]."; bbcodeBaliseDesc["url"] = 'Insérer un lien. [url]Adresse[/url] ou [url=*Adresse*]Nom[/url].'; bbcodeBaliseDesc["url_new"] = 'Lien dans une nouvelle fenêtre. [url]Adresse[/url] ou [url=*Adresse*]Nom[/url]'; bbcodeBaliseDesc["img"] = 'Insérer une image. [img]*adresse de l\'image*[/img].'; bbcodeBaliseDesc["color"] = 'Mettre le texte en couleur. [color=*Couleur*]Texte[/color].'; bbcodeBaliseDesc["size"] = 'Changer la taille du texte. [size=*Taille*]Texte[/size].'; bbcodeBaliseDesc["center"] = 'Centrer le texte. [center]*Texte*[/center].'; bbcodeBaliseDesc["left"] = 'Aligner sur la gauche le texte. [left]*Texte*[/left].'; bbcodeBaliseDesc["right"] = 'Aligner sur la droite le texte. [right]*Texte*[/right].'; bbcodeBaliseDesc["justify"] = 'Justifier le texte. [justify]*Texte*[/justify].'; bbcodeBaliseDesc["samp"] = 'Exemple de partie de code. [samp]*Texte*[/samp].'; bbcodeBaliseDesc["code"] = 'Bout de code mis en forme. [code]*Texte*[/code].'; bbcodeBaliseDesc["titre"] = 'Titre. [titre=X]*Titre*[/titre].'; bbcodeBaliseDesc["admin"] = 'Ouvrir la pop-up de choix des fichiers.'; bbcodeBaliseDesc["floatleft"] = 'Faire flotter sur la gauche. [floatleft]*Texte*[/floatleft].'; bbcodeBaliseDesc["floatright"] = 'Faire flotter sur la gauche le texte. [floatright]*Texte*[/floatright].'; bbcodeBaliseDesc["marge"] = 'Ajouter un leger retrait au texte. [marge]*Texte*[/marge].'; bbcodeBaliseDesc["del"] = 'Barrer le texte. [del]*Texte*[/del].'; //On ajoute des boutons de mise en forme sur les champs marqués comme textarea.bbcode function makeBbcode(obj) { //On target la ligne de balises qui se trouve au dessus du champ texte var divBbcode = document.getElementById("bbcode_"+obj.id); //On va y ajouter des balises var arrColor = new Array("color", "black", "silver", "gray", "white", "navy", "blue", "purple", "magenta", "green", "lime", "teal", "cyan", "maroon", "red", "olive", "yellow"); var arrSize = new Array("size", "x-small", "small", "medium", "large", "x-large"); var arrTitle = new Array("titre", 1, 2, 3, 4, 5, 6); if (isAdmin) var arrBalises = new Array("b", "i", "u", "center", "justify", "left", "right", "marge", "img",arrColor, arrSize, "floatleft", "floatright", "titre", "url", arrTitle); else var arrBalises = new Array("b", "i", "u", "del", "center", "justify", "left", "right", "marge", "img", arrColor, arrSize, "url", arrTitle); for (i=0;i!=arrBalises.length;i++) { //On ajoute la balise differemment si c'est une balise normale ou une balise contenant des sous balises if (typeof(arrBalises[i])=="string") bbcodeAddBaliseLink(divBbcode, arrBalises[i]); if (typeof(arrBalises[i])=="object") bbcodeAddBaliseLinkArray(divBbcode, arrBalises[i]); } } //On mets une balise de plus dans le div de mise en forme function bbcodeAddBaliseLink(obj, balise) { //On a dans li une liste de balises html var li = document.createElement("li"); //On lui donne la classe de base setClass(li, "bbcode"); //On créé déjà un carré avec l'icone dessus var a = document.createElement("a"); //On lui rajoute une image de fond qui correspond à la balise a.style.backgroundImage = 'url("images/bbcode/'+balise+'.gif")'; //On mets des contenu pour retrouver les informations a.innerHTML = " "; a.title = balise; //Nom de la balise a.href = "#"+obj.id.substr(7); a.bbcodeOpen = false; //Indique si la balise est déjà ouverte ou non //On indique son explication lors du survol a.onmouseover = bbcodeShowHelp //Et on ajoute son effet au clic a.onmousedown = bbcodeAddBalise; //On redonne le focus quand on lache a.onmouseup = bbcodeGiveFocusToTextarea; //Il ne se passe rien après un clic, donc pas de reprise de focus par le lien a.onclick = function() { return false; } //Si c'est la balise admin, il se passe quelque chose de spécial au clic if (balise=="admin") a.onmousedown = bbcodeBaliseAdmin; //Si c'est la balise manga, on ouvre une pop-up avec les smileys if (balise=="smile") a.onmousedown = function() { bbcodeBaliseSmile.call(this, 'normal') }; if (balise=="manga") a.onmousedown = function() { bbcodeBaliseSmile.call(this, 'manga'); }; //On mets le lien dans le li li.appendChild(a); //on mets le li dans la liste obj.appendChild(li); return li; } //On mets une balise de plus dans le div de mise en forme, mais celle ci n'ajoute pas une balise, elle permet d'ouvir un ensemble de balises function bbcodeAddBaliseLinkArray(obj, balise) { //On ajoute le bouton var li = document.createElement("li"); setClass(li, "bbcode"); var a = document.createElement("a"); a.style.backgroundImage = 'url("images/bbcode/'+balise[0]+'.gif")'; a.innerHTML = " "; a.title = balise[0]; //Nom de la balise a.href = "#"+obj.id.substr(7); a.bbcodeOpen = false; //Indique si la balise est déjà ouverte ou non //On créé une liste qui contient tout les sous éléments var subItems = document.createElement("ul"); subItems.setAttribute("id", "subItems_"+a.href.substr(a.href.indexOf("#")+1)+"_"+a.title); setClass(subItems, "subItems_"+a.title); //je mets dedans des éléments qui correspondent aux éléments du tableau var subItemLi, subItemA; for (var i=1;i!=balise.length;i++) { subItemLi = document.createElement("li"); subItemA = document.createElement("a"); subItemA.innerHTML = balise[i]; subItemA.title = balise[0]+"="+balise[i]; //Nom de la balise subItemA.href = "#"+obj.id.substr(7); subItemA.bbcodeOpen = false; //Indique si la balise est déjà ouverte ou non //On lui donne une balise de fermeture subItemA.baliseEnd = "[/"+balise[0]+"]"; //Si en plus c'est une couleur, on colorie le fond de la couleur if (balise[0]=="color") subItemA.style.backgroundColor = balise[i]; //Et on ajoute son effet au clic subItemA.onmousedown = bbcodeAddBalise; //On redonne le focus quand on lache subItemA.onmouseup = bbcodeGiveFocusToTextarea; //Il ne se passe rien après un clic, donc pas de reprise de focus par le lien subItemA.onclick = function() { bbcodeShowSubItems.call(a); return false; } //On ajoute le lien dans le li subItemLi.appendChild(subItemA); //Et le li dans le sous menu subItems.appendChild(subItemLi); } //On indique son explication lors du survol et on la fait apparaitre a.onmouseover = bbcodeShowHelp //Et on ajoute son effet au clic a.onmousedown = bbcodeShowSubItems; //Il ne se passe rien après un clic, donc pas de reprise de focus par le lien a.onclick = function() { return false; } //On mets le lien dans le li li.appendChild(a); //On mets la sous liste après le a li.appendChild(subItems); //on mets le li dans la liste obj.appendChild(li); return li; } //On affiche la liste des sous items lors du survol function bbcodeShowSubItems() { var subItems = document.getElementById("subItems_"+this.href.substr(this.href.indexOf("#")+1)+"_"+this.title); openClose(subItems); //if (subItems) subItems.style.display = "block"; } //On affiche le contenu de l'aide d'un textarea donné function bbcodeShowHelp() { //On trouve le read only qui correspond à ce textarea var readonly = document.getElementById("readonly_"+this.href.substr(this.href.indexOf("#")+1)); readonly.value = bbcodeBaliseDesc[this.title]; } //On donne le focus au champ textarea en rapport function bbcodeGiveFocusToTextarea() { var textarea = document.getElementById(this.href.substr(this.href.indexOf("#")+1)); //Je me refocus dessus textarea.focus(); //Je mets le curseur à l'emplacement if (textarea.selectionStart!=undefined) { textarea.selectionStart = this.offsetFocus; textarea.selectionEnd = this.offsetFocus; } } /* Name : bbcodeGetTagInfo Param : on l'applique à un lien Il va remplir this.balise, this.baliseStart et this.baliseEnd */ function bbcodeGetTagInfo() { //balises d'ouverture et de fermeture (si pas déjà définies) if (!this.baliseStart) this.baliseStart = "["+this.title+"]"; if (!this.baliseEnd) this.baliseEnd = "[/"+this.title+"]"; //Si c'est une url if (this.title=="url" || this.title=="url_new") bbcodeGetTagInfoUrl.call(this); //Si c'est un smiley, on ajoute pas de balises if (this.isSmiley) this.baliseStart = this.baliseEnd = this.title; //Selon qu'il est ouvert on fermé on prends une balise de circonstance this.balise = (this.bbcodeOpen) ? this.baliseEnd : this.baliseStart; } /* Name : bbcodeAddBalise Param : aucun Ajoute une balise du type title dans le textarea donné dans href lors du clic De base je ne passe pas de parametre car on les retrouve dans le title pour les balises simples, mais pour les balises plus compliqués je peux passe balise_start et balise_end */ function bbcodeAddBalise() { //Le textarea où ajouter les informations var textarea = document.getElementById(this.href.substr(this.href.indexOf("#")+1)); //On sauvegarde les informations concernant les selections sous Mozzy pour ne pas les perdre en cas de prompt if (textarea.selectionStart!=undefined) { var selectionStart = textarea.selectionStart; var selectionEnd = textarea.selectionEnd; } //On va maintenant récupérer les tags des balises de début et de fin bbcodeGetTagInfo.call(this); textarea.focus(); //On invente une chaine de caractere trés improbable qui nous servira pour une recherche var search_string = "#-=search_string=-#"; //Dans le cas où on ajoute du dummy text //S'il connait selectionStart (Mozzy) if (selectionStart!=undefined) { //Si quelque chose est selectionné j'ajoute avant et après if (selectionStart!=selectionEnd) { //On sauvegarde l'offset de placement de la balise (pour y remettre le focus) this.offsetFocus = selectionEnd + this.baliseEnd.length + this.baliseStart.length; //On ajoute avant et après bbcodeAddTextToTextarea(textarea, this.baliseStart, selectionStart); bbcodeAddTextToTextarea(textarea, this.baliseEnd, selectionEnd + this.baliseStart.length); } //Si rien n'est sélectionné, j'ajoute au curseur la balise else { //On sauvegarde l'offset de placement du texte (pour y mettre le focus) this.offsetFocus = selectionStart + this.balise.length; bbcodeAddTextToTextarea(textarea, this.balise, selectionStart); //je change si ouvert/fermé this.bbcodeOpen = !this.bbcodeOpen; } } //Sinon s'il connait document.selection je peux le changer rapidement else if (document.selection) { //On focus le textarea pour éviter d'écrire sur la page textarea.focus(); //Si quelque chose est sélectionné j'ajoute autour if (document.selection.createRange().text.toString()) { //Pour trouver où commence la selection, j'ajoute une string improbable et je trouve sa place dans le textarea, puis je la supprime //je sauvegarde la selection avant mise en forme var range = document.selection.createRange(); var old_selection = range.text.normalizeLineBreak(); //Voila le texte selectionné //j'ajoute une string rapidement (je perds old_range à ce moment car j'ai changé son texte) range.text = search_string+old_selection; range = document.selection.createRange(); //je reprends la selection avec l'ajout //je retrouve la position de ma string var start = textarea.value.normalizeLineBreak().indexOf(search_string); //j'enleve ma string. J'ai donc dans start la position du début de la selection range.text = old_selection; //Je reprends la selection dans range (perdue par la modification du texte encore une fois) range = document.selection.createRange(); //Position de la fin var end = start + old_selection.length + this.baliseStart.length; //On ajoute avant et après bbcodeAddTextToTextarea(textarea, this.baliseStart, start); bbcodeAddTextToTextarea(textarea, this.baliseEnd, end); //Après avoir changé le texte, la selection devient la totalité du texte, on va donc la mettre en un seul point, après la balise range = document.selection.createRange(); var tmp = end + this.baliseEnd.length; range.moveStart('character', tmp); range.moveEnd('character', - (textarea.value.normalizeLineBreak().length - tmp)); range.select(); //On sauvegarde dans le lien l'offset de placement du texte this.offsetFocus = end + this.baliseEnd.length; } //Sinon j'ajoute au curseur else { document.selection.createRange().text = this.balise + document.selection.createRange().text; //On change son état ouvert/fermé this.bbcodeOpen = !this.bbcodeOpen; } } //On style le bouton selon qu'il est levé ou non bbcodeStyleOpen.call(this); return false; } /* Name : bbcodeAddTextToTextarea Param : obj, text, place Ajoute le texte text dans le textarea obj au charactere place */ function bbcodeAddTextToTextarea(obj, text, place) { //Le nouveau texte c'est le debut + la balise + la fin obj.value = obj.value.normalizeLineBreak().substring(0,place) + text + obj.value.normalizeLineBreak().substring(place); } /* Name : bbcodeStyleOpen Param : aucun, on applique cette fonction à un lien pour le metre en forme selon que son bbcodeOpen soit true ou false */ function bbcodeStyleOpen() { //Si c'est une url, il est toujours fermé if (this.title=="url" || this.title=="url_new") this.bbcodeOpen = false; //Selon l'état du lien on mets en position levée ou abaissée if (this.bbcodeOpen) setClass(this, "bbcode open"); else setClass(this, "bbcode") } /* bbcodeGetTagInfoUrl Pour les liens on demande avec 2 prompts et un Oui/Non toutes les infos que l'on désire On stocke .baliseStart et .baliseEnd dans l'obj (le lien) On mets tout dans baliseStart et rien dans baliseEnd */ function bbcodeGetTagInfoUrl() { //On oublie ce qui avait été fait avant this.baliseStart = ""; this.baliseEnd = ""; //Demande de l'url var url = prompt("Indiquez l'url du lien (adresse)", "http://"); if (url=="http://") url = ""; //Si pas d'url, on annule if (!url) return false; //On demande le nom du lien var title = prompt("Indiquez le texte du lien (le texte sur lequel cliquer pour suivre le lien)", ""); //Ensuite si ouverture dans une nouvelle fenetre ou non var new_window = confirm("Souhaitez-vous que le lien s'ouvre dans une nouvelle fenetre ?"); //On mets en forme le tag final var balise = (new_window) ? "url_new" : "url"; //Si un texte if (title) this.baliseStart = "["+balise+"="+url+"]"+title+"[/"+balise+"]"; else this.baliseStart = "["+balise+"]"+url+"[/"+balise+"]"; } /*** bbcodeBaliseAdmin On va ouvrir une fausse pop-up qui va nous demander de choisir une section, puis un fichier dans la section puis le type d'insertion: [img:], [imglink:], [apercu:], [aperculink:] ou [file:] **/ function bbcodeBaliseAdmin() { //On va créer une fausse pop-up à mettre sur la droite var popUp = document.getElementById("bbcodePopUp"); var bbcodeDiv = getElementsBySelector("form.label_cell .div_bbcode")[0]; //S'il est déjà là on le fait juste apparaitre if (popUp) { popUp.style.display = "block"; return; } //S'il n'existe pas, je le créé popUp = document.createElement("div"); popUp.setAttribute("id", "bbcodePopUp"); popUp.setAttribute("name", "bbcodePopUp"); //je mets dedans un lien pour le faire disparaitre var fermer = document.createElement("a"); fermer.href = "#"; fermer.innerHTML = "Fermer"; setClass(fermer, "fermer"); fermer.onclick = function() { openClose(popUp); return false; } popUp.appendChild(fermer); //Je mets à l'intérieur une iframe var iframe = document.createElement("iframe"); iframe.src = "bbcodeAdminIframe.php?partie=1&textarea="+this.href.substr(this.href.indexOf("#")+1); setClass(iframe, "principal"); iframe.setAttribute("scrolling", "no"); iframe.setAttribute("frameborder", "no"); popUp.appendChild(iframe); //On mets dans la page bbcodeDiv.insertBefore(popUp, bbcodeDiv.firstChild); } /*** makeAddBalisePopUp ***/ //Au clic sur les liens de la derniere iframe, on va ajouter au textarea le contenu du lien function makeAddBalisePopUp(obj) { obj.onmousedown = bbcodeAddBalise; obj.onclick = function() { return false; } } /********* addBalisePopUp **************/ function addBalisePopUp() { //On va ajouter le contenu du lien dans le textarea indiqué //On ne suit pas le lien return false; } /***************** bbcodeBaliseSmile *******************/ function bbcodeBaliseSmile(type) { //On le créé s'il n'existe pas, deux différents pour manga ou normal var div = document.getElementById("bbcodePopUpSmile_"+type); var menu = document.getElementById("menu"); var id = this.href.substr(this.href.indexOf("#")+1); var bbcode = document.getElementById("bbcode_"+id); if (!div) { div = document.createElement("div"); div.id = "bbcodePopUpSmile_"+type; setClass(div, "bbcodePopUpSmile"); div.innerHTML = "Chargement de la liste des smileys..."; bbcode.appendChild(div); //On va y mettre les smileys /*********** xmlGetSmileysList********************/ //On va chopper la liste des smileys et de leurs images function xmlGetSmileysList(type) { var reqGetSmileysList; var url = urlXML+"xmlGetSmileysList.php?smiley_type="+type; xmlRequest(reqGetSmileysList, url, xmlORSCGetSmileysList); } /*********** xmlORSCGetCommTexte ***************/ function xmlORSCGetSmileysList(req) { //C'est bon, on ajoute au div if (req.readyState==4 && req.status==200) { xmlPutSmileys(req.responseXML.documentElement); } } /************* xmlPutSmileys *****************/ function xmlPutSmileys(response) { var nbr_smileys = xmlGetValue("nbr_smileys", response); var smileys = xmlGetNodes("smiley", response); var img, a; div.innerHTML = ""; //On mets un lien "Fermer" var fermer = document.createElement("a"); fermer.href = "#"+div.id; fermer.onclick = function() { this.parentNode.style.display = "none"; return false; } setClass(fermer, "fermer"); fermer.innerHTML = "Fermer"; div.appendChild(fermer); for (i=0;i!=smileys.length;i++) { //L'image img = document.createElement("img"); img.alt = xmlGetValue("code", smileys[i]); img.src = xmlGetValue("image", smileys[i]); //Le lien à cliquer a = document.createElement("a"); a.href = "#"+id; //le textarea à cibler a.title = img.alt; //Le code à ajouter a.isSmiley = true; //on précise pour pas ajouter les [ ] autour a.onmousedown = bbcodeAddBalise; a.onclick = function() { return false; } a.appendChild(img); div.appendChild(a); } } //On va mettre le bon texte dans le textarea xmlGetSmileysList(type); } //On l'affiche/cache openClose(div); //Si l'autre existe, je le masque var autreType = (type=="manga") ? "normal" : "manga"; var autreDiv = document.getElementById("bbcodePopUpSmile_"+autreType); if (autreDiv) autreDiv.style.display = "none"; //On va le placer dans le menu div.style.left = getX(bbcode)-div.offsetWidth-15+"px"; div.style.top = getY(bbcode)-45+"px"; }