CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2010 08 01 01:28:19

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

COMPLÉTION DE CODE

Information sur la source

Note :

9,00 / 10

Catégorie :Divers Niveau :Initié Date de création :15/12/2004 Vu / téléchargé :2 790 / 168

Auteur : ennixo

Ecrire un message privé

Site perso

Commentaire sur cette source (8)

Ajouter un commentaire et/ou une note

Description

Cliquez pour voir la capture en taille normale

voilà ma version BETA de complétion d'un code que j'ai inventé pour formater le texte des forums d'un site de programmation...

DONC ça permet d'écrire du code qui n'a pas encore de documentation puisque c'est encore en dév et tout et tout...

Source

<html>
<head>
<title>Test d'éditeur avec complétion de code</title>
<style>
<!--
textarea
{
font-family: 'Courier New';
font-size: 13px;
border: solid 1px #7F9DB9;
width: 768px;
height: 200px;
}
.normal
{
color: #474747;
font-family: Tahoma, Helvetica, "Bitstream Vera Sans", sans-serif;
font-size: 11px;
font-weight: normal;
}
.Editeurbleu
{
color: #6699CC;
font-weight: bold;
}
.Editeuraide
{
font-style: italic;
color: #A0A0A0;
}
tr.Editeurnormal
{
font-family: Tahoma;
font-size: 11px;
color: #606060;
background-color: #FFFFEE;
cursor: pointer;
}
tr.Editeurmover
{
font-family: Tahoma;
font-size: 11px;
color: #606060;
background-color: #DDEEFF;
cursor: pointer;
}
-->
</style>
<script type="text/javascript">
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Objet Mot, contient les données d'un mot à compléter
------------------------------------------------------------
Propriété Construction Description
------------------------------------------------------------
mot strMot le mot
aide strAide l'aide concernant ce mot
apres bApres vrai s'il y a quelque chose après sinon faux
ferme bFerme vrai si la balise doit être fermée sinon faux (uniquement pour niveau zéro)
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function Mot (strMot, strAide, bApres, bFerme)
{
this.mot = strMot;
this.aide = strAide;
this.apres = bApres;
this.ferme = bFerme;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Objet Liste de mots, contient une liste des mots disponibles
------------------------------------------------------------
Propriété Construction Description
------------------------------------------------------------
niveau iNiveau niveau de la liste
avant strAvant mot qui DOIT précéder
mots arrMots tableau d'objets mot
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function ListeMot (iNiveau, strAvant, arrMots)
{
this.niveau = iNiveau;
this.avant = strAvant;
this.mots = arrMots;
// Crée la liste HTML à afficher en tenant compte de l'égalité éventuelle
// strAvant: chaine du texte déjà écrit
// strEgalite: égalité à vérifier
this.creerListe = function (strAvant, strEgalite)
{
// Soyons fous !
strEgalite = strEgalite.split(" ")[0].split("\r")[0].split("\n")[0].split("\t")[0];
if (strEgalite == "") strEgalite == null;
var retour = "";
for (i = 0; i < this.mots.length; i++)
{
if (strEgalite == null || this.mots[i].mot.substr(0, strEgalite.length) == strEgalite)
{
if (retour == "") retour = "<table border=\"0\" cellpadding=\"2\" cellspacing=\"0\">";
if (strEgalite == null) strCompletion = this.mots[i].mot;
else strCompletion = this.mots[i].mot.substr(strEgalite.length, this.mots[i].mot.length - strEgalite.length);
if (this.mots[i].apres) strCompletion += ":";
else strCompletion += "]";
retour += "<tr class=\"Editeurnormal\" onmouseover=\"javascript:this.className = 'Editeurmover'\" onmouseout=\"javascript:this.className = 'Editeurnormal';\" onmouseup=\"javascript:ajouteTexte('" + strCompletion + "');\">";
retour += "<td>";
retour += strAvant + " <span class=\"Editeurbleu\">" + this.mots[i].mot + "</span>";
if (this.mots[i].apres) retour += " :";
else retour += " ]";
retour += "</td>";
retour += "<td class=\"Editeuraide\">" + this.mots[i].aide;
retour += "</td>";
retour += "</tr>";
}
}
if (retour == "") retour = "<div style=\"font-family: Tahoma; font-size: 11px; font-weight: bold; color: #FFFFFF; background-color: #DD0000; padding: 4px;\">Erreur dans le code !</div>";
else retour += "</table>";
return retour;
}
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Objet Code, contient les données d'un code
------------------------------------------------------------
Propriété Construction Description
------------------------------------------------------------
niveaux arrNiveaux tableau des niveaux de la balise
position iPosition position dans le texte en caractères (0 = 1er carac, etc...)
longueur iLongueur longueur du texte original du code
ferme bFerme vrai si la balise est finie par un "]" sinon faux
balisefin bBaliseFin vrai si la balise commence pa "[/" et donc est une balise de fin
abalisefin bABaliseFin si la balise n'est pas une balise de fin, est-ce qu'elle possède une balise de fin ?
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function Code (arrNiveaux, iPosition, iLongueur, bFerme, bBaliseFin, bABaliseFin)
{
this.niveaux = arrNiveaux;
this.position = iPosition;
this.longueur = iLongueur;
this.ferme = bFerme;
this.balisefin = bBaliseFin;
this.abalisefin = bABaliseFin;
// ce qu'on a déjà tapé (pour affichage en début de chaque mot de la liste)
this.avant = "[" + this.niveaux.join(":");
while (this.avant.substr(this.avant.length - 1, 1) != ":" && this.avant.length > 1)
this.avant = this.avant.substr(0, this.avant.length - 1);
}
// Tableau des listes
// c'est lui qui contient TOUT
var LM = new Array();
// Liste des mots de la racine
var tmp = new Array();
tmp[0] = new Mot("citer", "Insérer une citation", true, true);
tmp[1] = new Mot("code", "Insérer du code source", true, true);
tmp[2] = new Mot("correct", "Insérer une correction", false, true); // ToDo: gérer uniquement dans un [code][/code] à gérer
tmp[3] = new Mot("el", "Insérer un élément de liste", false, true); // ToDo: gérer uniquement dans un [liste][/liste] à gérer
tmp[4] = new Mot("err", "Insérer une erreur", false, true); // ToDo: gérer uniquement dans un [code][/code] à gérer
tmp[5] = new Mot("expr", "Insérer une expression", true, true);
tmp[6] = new Mot("liste", "Insérer une liste", true, true);
tmp[7] = new Mot("titre", "Insérer un titre", true, true);
LM.push(new ListeMot(0, null, tmp));
// Liste des langages pour le code
var tmp = new Array();
tmp[0] = new Mot("c", "Langage C", true, false);
tmp[1] = new Mot("cpp", "C++", true, false);
tmp[2] = new Mot("csharp", "C#", true, false);
LM.push(new ListeMot(1, "code", tmp));
// Liste des langages pour le expr
var tmp = new Array();
tmp[0] = new Mot("c", "Langage C", false, false);
tmp[1] = new Mot("cpp", "C++", false, false);
tmp[2] = new Mot("csharp", "C#", false, false);
LM.push(new ListeMot(1, "expr", tmp));
// Liste des types de listes
var tmp = new Array();
tmp[0] = new Mot("num", "Numérique", false, false);
tmp[1] = new Mot("puces", "A puces", false, false);
LM.push(new ListeMot(1, "liste", tmp));
// Liste des tailes de titres
var tmp = new Array();
tmp[0] = new Mot("1", "Très grand", false, false);
tmp[1] = new Mot("2", "Grand", false, false);
tmp[2] = new Mot("3", "Moyennement grand", false, false);
tmp[3] = new Mot("4", "Moyennement petit", false, false);
tmp[4] = new Mot("5", "Petit", false, false);
tmp[5] = new Mot("6", "Très petit", false, false);
LM.push(new ListeMot(1, "titre", tmp));
// on dégage tmp pour libérer la mémoire
tmp = null;
function texte_KeyPress(objTextarea, keyCode)
{
// on récupère l'objet divListe
objListe = document.getElementById("divListe");
// on récupère le caractère d'à la ligne
if (objTextarea.value.indexOf("\r\n") > -1) crlf = "\r\n"; // Windows
else if (objTextarea.value.indexOf("\r") > -1) crlf = "\r"; // Mac OS
else crlf = "\n"; // Unix/Linux
// on récupère la position du curseur dans le texte
iPosCurseur = trouvePosCurseur(objTextarea);
iCode = -1;
// on sépare les mots et les "codes" potentiels
tampon = "";
mots = new Array();
for (i = 0; i < objTextarea.value.length; i++)
{
carac = objTextarea.value.substr(i, 1);
if (carac == "[")
{
if (tampon != "")
{
mots.push(tampon);
}
tampon = carac;
}
else if (carac == "]")
{
mots.push(tampon + carac);
tampon = "";
}
else
{
tampon += carac;
}
}
if (tampon != "") mots.push(tampon);
// on crée la liste des objets de chaque mot DE CODE uniquement
iPosition = 0;
codTexte = new Array();
for (i = 0; i < mots.length; i++)
{
lemot = mots[i];
if (lemot.substr(0, 1) == "[")
{
// la balise est elle fermee ?
if (lemot.substr(lemot.length - 1, 1) == "]") ferme = true;
else ferme = false;
// est-ce une balise de fin ?
if (lemot.length > 1)
{
if (lemot.substr(1, 1) == "/")
{
balisefin = true;
abalisefin = false;
}
else
{
balisefin = false;
abalisefin = true;
}
}
else
{
balisefin = false;
// on ne peut pas chercher la balise de fin
abalisefin = false;
}
// on récupère les niveaux
lemot = lemot.substr(1, lemot.length - (ferme ? 2 : 1));
if (lemot.substr(0, 1) == "/") lemot = lemot.substr(1, lemot.length - 1);
niveaux = lemot.split(":");
// si on peut chercher une balise de fin éventuelle
if (abalisefin)
{
abalisefin = false;
// on cherche la balise de fin (ou la prochaine balise similaire)
for (j = i + 1; j < mots.length; j++)
{
// trouvé, ok, on quitte
if (mots[j] == "[/" + niveaux[0] + "]")
{
abalisefin = true;
break;
}
else if (mots[j].substr(0, niveaux[0].length + 2) == "[" + niveaux[0] + "]" || mots[j].substr(0, niveaux[0].length + 2) == "[" + niveaux[0] + ":")
{
abalisefin = false;
break;
}
}
}
// on peut enfin créer notre objet
codNouveau = new Code(niveaux, iPosition, mots[i].length, ferme, balisefin, abalisefin);
codTexte.push(codNouveau);
// On regarde si c'est le Code pour lequel .position <= iPosCurseur && .position + .longueur >= iPosCurseur
// ce code est celui sur lequel se trouve actuellement le curseur
if (codNouveau.position < iPosCurseur && codNouveau.position + codNouveau.longueur >= iPosCurseur)
iCode = codTexte.length - 1;
}
// on actualise la position
iPosition += mots[i].length;
}
// si le curseur n'est sur aucun code
if (iCode == -1)
{
objTextarea.focus();
objListe.style.visibility = "hidden";
return;
}
else // Sinon
{
if (!codTexte[iCode].ferme && !codTexte[iCode].balisefin) // Si on est pas fermé
{
// On cherche la liste de .niveau == codTexte[iCode].niveaux.length - 1
// et dont .avant == codTexte[iCode].niveaux[codTexte[iCode].niveaux.length - 2]
iListe = -1;
for (i = 0; i < LM.length; i++)
{
if (LM[i].niveau == codTexte[iCode].niveaux.length - 1 && LM[i].avant == codTexte[iCode].niveaux[codTexte[iCode].niveaux.length - 2])
{
iListe = i; // trouvée
break;
}
}
// Si on ne l'a pas trouvée
if (iListe == -1)
{
objTextarea.focus();
objListe.style.visibility = "hidden";
return;
}
else // Sinon
{
objListe.innerHTML = LM[iListe].creerListe(codTexte[iCode].avant, codTexte[iCode].niveaux[codTexte[iCode].niveaux.length - 1]);
positionneListe(objTextarea, objListe);
objListe.style.visibility = "visible";
}
}
else if (!codTexte[iCode].balisefin && !codTexte[iCode].abalisefin && codTexte[iCode].niveaux[0] != "citer" && keyCode != 8 && keyCode != 46) // Si on est pas une balise de fin et si on a pas de balise de fin
{
// On ajoute la balise de fin correspondante
ajouteTexte("[/" + codTexte[iCode].niveaux[0] + "]");
objTextarea.focus();
if (objTextarea.createTextRange) // IE
{
iPosition = trouvePosCurseur(objTextarea);
posCurseur = objTextarea.createTextRange();
posCurseur.move("character", iPosition - (codTexte[iCode].niveaux[0].length + 3));
posCurseur.select();
}
else if (objTextarea.setSelectionRange) // NN/Mozilla
{
objTextarea.selectionStart -= (codTexte[iCode].niveaux[0].length + 3);
objTextarea.selectionEnd = objTextarea.selectionStart;
}
objListe.style.visibility = "hidden";
}
else
{
// En attendant la suite...
objTextarea.focus();
objListe.style.visibility = "hidden";
}
}
}
function positionneListe(objTextarea, objListe)
{
// on récupère le caractère d'à la ligne
if (objTextarea.value.indexOf("\r\n") > -1) crlf = "\r\n"; // Windows
else if (objTextarea.value.indexOf("\r") > -1) crlf = "\r"; // Mac OS
else crlf = "\n"; // Unix/Linux
objTextarea.focus();
if (objTextarea.createTextRange) // IE
{
posCurseur = window.document.selection.createRange().duplicate();
objListe.style.left = posCurseur.boundingLeft + posCurseur.boundingWidth + objTextarea.scrollLeft;
objListe.style.top = posCurseur.boundingHeight * (objTextarea.value.substr(0, trouvePosCurseur(objTextarea)).split(crlf).length) + objTextarea.scrollTop + lHaut(objTextarea);
}
else if (objTextarea.setSelectionRange) // NN/Mozilla
{
// Comment faire ?
}
}
function lHaut (objTextarea)
{
i = objTextarea.offsetTop;
obj = objTextarea.offsetParent;
while (obj)
{
i += obj.offsetTop;
obj = obj.offsetParent;
}
return i;
}
// Trouve la position du curseur dans le texte
function trouvePosCurseur(objTextarea)
{
objTextarea.focus();
if (objTextarea.createTextRange) // IE
{
posCurseur = document.selection.createRange().duplicate();
posCurseur.collapse();
posCurseur.moveStart("textedit", -1);
return posCurseur.text.length;
}
else if (objTextarea.setSelectionRange) return objTextarea.selectionStart; // NN/Mozilla
else return -1; // ?
}
// Ajoute du texte là ou est le curseur
function ajouteTexte(strAjout)
{
objTextarea = document.frmEditeur.texte;
objTextarea.focus();
if (objTextarea.createTextRange) document.selection.createRange().text += strAjout; // IE
else if (objTextarea.setSelectionRange) // NN/Mozilla
{
iLongueur = objTextarea.selectionEnd;
objTextarea.value = objTextarea.value.substr(0, iLongueur) + strAjout + objTextarea.value.substr(iLongueur);
objTextarea.setSelectionRange(iLongueur + strAjout.length, iLongueur + strAjout.length);
}
else objTextarea.value += strAjout; // ?
texte_KeyPress(objTextarea, 0);
}
// Vérifie que les données soumises sont correctes
function verifEditeur(objTextarea)
{
if (objTextarea.value.replace("\r", "").replace("\n", "").replace("\t", "").replace(" ", "") == "")
{
alert("Vous devez saisir un message !");
objTextarea.focus();
return false;
}
else
return true;
}
</script>
</head>
<body>
<form name="frmEditeur" action="" method="post">
<textarea name="texte" onkeyup="javascript:if (frmEditeur.aidesaisie.checked) texte_KeyPress(this, event.keyCode);"></textarea>
<table border="0" cellspacing="0" cellpadding="2">
<tr>
<td><input type="checkbox" name="aidesaisie" checked></td>
<td class="normal">Aide à la saisie</td>
</tr>
</table>
</form>
<div id="divListe" style="position: absolute; border: outset 1px; padding: 0px; visibility: hidden"></div>
</body>
</html>

<html>
<head>
<title>Test d'éditeur avec complétion de code</title>
<style>
<!--
textarea
{
    font-family: 'Courier New';
    font-size: 13px;
    border: solid 1px #7F9DB9;
    width: 768px;
    height: 200px;
}

.normal
{
    color: #474747;
    font-family: Tahoma, Helvetica, "Bitstream Vera Sans", sans-serif;
    font-size: 11px;
    font-weight: normal;
}

.Editeurbleu
{
    color: #6699CC;
    font-weight: bold;
}

.Editeuraide
{
    font-style: italic;
    color: #A0A0A0;
}

tr.Editeurnormal
{
    font-family: Tahoma; 
    font-size: 11px; 
    color: #606060;
    background-color: #FFFFEE;
    cursor: pointer;
}

tr.Editeurmover
{
    font-family: Tahoma; 
    font-size: 11px; 
    color: #606060;
    background-color: #DDEEFF;
    cursor: pointer;
}
-->
</style>
<script type="text/javascript">

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 Objet Mot, contient les données d'un mot à compléter
 ------------------------------------------------------------
 Propriété  Construction    Description
 ------------------------------------------------------------
 mot        strMot          le mot
 aide       strAide         l'aide concernant ce mot
 apres      bApres          vrai s'il y a quelque chose après sinon faux
 ferme      bFerme          vrai si la balise doit être fermée sinon faux (uniquement pour niveau zéro)
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function Mot (strMot, strAide, bApres, bFerme)
{
    this.mot = strMot;
    this.aide = strAide;
    this.apres = bApres;
    this.ferme = bFerme;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 Objet Liste de mots, contient une liste des mots disponibles
 ------------------------------------------------------------
 Propriété  Construction    Description
 ------------------------------------------------------------
 niveau     iNiveau         niveau de la liste
 avant      strAvant        mot qui DOIT précéder
 mots       arrMots         tableau d'objets mot
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function ListeMot (iNiveau, strAvant, arrMots)
{
    this.niveau = iNiveau;
    this.avant = strAvant;
    this.mots = arrMots;
    
    // Crée la liste HTML à afficher en tenant compte de l'égalité éventuelle
    // strAvant: chaine du texte déjà écrit
    // strEgalite: égalité à vérifier
    this.creerListe = function (strAvant, strEgalite)
    {
        // Soyons fous !
        strEgalite = strEgalite.split(" ")[0].split("\r")[0].split("\n")[0].split("\t")[0];
        if (strEgalite == "") strEgalite == null;
        
        var retour = "";
        for (i = 0; i < this.mots.length; i++)
        {
            if (strEgalite == null || this.mots[i].mot.substr(0, strEgalite.length) == strEgalite)
            {
                if (retour == "") retour = "<table border=\"0\" cellpadding=\"2\" cellspacing=\"0\">";
            
                if (strEgalite == null) strCompletion = this.mots[i].mot;
                else strCompletion = this.mots[i].mot.substr(strEgalite.length, this.mots[i].mot.length - strEgalite.length);
                
                if (this.mots[i].apres) strCompletion += ":";
                else strCompletion += "]";
                
                retour += "<tr class=\"Editeurnormal\" onmouseover=\"javascript:this.className = 'Editeurmover'\" onmouseout=\"javascript:this.className = 'Editeurnormal';\" onmouseup=\"javascript:ajouteTexte('" + strCompletion + "');\">";
                retour += "<td>";
                retour += strAvant + " <span class=\"Editeurbleu\">" + this.mots[i].mot + "</span>";
                if (this.mots[i].apres) retour += " :";
                else retour += " ]";
                retour += "</td>";
                retour += "<td class=\"Editeuraide\">" + this.mots[i].aide;
                retour += "</td>";
                retour += "</tr>";
            }
        }
        
        if (retour == "") retour = "<div style=\"font-family: Tahoma; font-size: 11px; font-weight: bold; color: #FFFFFF; background-color: #DD0000; padding: 4px;\">Erreur dans le code !</div>";
        else retour += "</table>";
        
        return retour;
    }
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 Objet Code, contient les données d'un code
 ------------------------------------------------------------
 Propriété  Construction    Description
 ------------------------------------------------------------
 niveaux    arrNiveaux      tableau des niveaux de la balise
 position   iPosition       position dans le texte en caractères (0 = 1er carac, etc...)
 longueur   iLongueur       longueur du texte original du code
 ferme      bFerme          vrai si la balise est finie par un "]" sinon faux
 balisefin  bBaliseFin      vrai si la balise commence pa "[/" et donc est une balise de fin
 abalisefin bABaliseFin     si la balise n'est pas une balise de fin, est-ce qu'elle possède une balise de fin ?
   * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function Code (arrNiveaux, iPosition, iLongueur, bFerme, bBaliseFin, bABaliseFin)
{
    this.niveaux = arrNiveaux;
    this.position = iPosition;
    this.longueur = iLongueur;
    this.ferme = bFerme;
    this.balisefin = bBaliseFin;
    this.abalisefin = bABaliseFin;
    
    // ce qu'on a déjà tapé (pour affichage en début de chaque mot de la liste)
    this.avant = "[" + this.niveaux.join(":");
    while (this.avant.substr(this.avant.length - 1, 1) != ":" && this.avant.length > 1)
        this.avant = this.avant.substr(0, this.avant.length - 1);
}

// Tableau des listes
// c'est lui qui contient TOUT
var LM = new Array();

// Liste des mots de la racine
var tmp = new Array();
tmp[0] = new Mot("citer", "Insérer une citation", true, true);
tmp[1] = new Mot("code", "Insérer du code source", true, true);
tmp[2] = new Mot("correct", "Insérer une correction", false, true);     // ToDo: gérer uniquement dans un [code][/code] à gérer
tmp[3] = new Mot("el", "Insérer un élément de liste", false, true);     // ToDo: gérer uniquement dans un [liste][/liste] à gérer
tmp[4] = new Mot("err", "Insérer une erreur", false, true);             // ToDo: gérer uniquement dans un [code][/code] à gérer
tmp[5] = new Mot("expr", "Insérer une expression", true, true);
tmp[6] = new Mot("liste", "Insérer une liste", true, true);
tmp[7] = new Mot("titre", "Insérer un titre", true, true);
LM.push(new ListeMot(0, null, tmp));

// Liste des langages pour le code
var tmp = new Array();
tmp[0] = new Mot("c", "Langage C", true, false);
tmp[1] = new Mot("cpp", "C++", true, false);
tmp[2] = new Mot("csharp", "C#", true, false);
LM.push(new ListeMot(1, "code", tmp));

// Liste des langages pour le expr
var tmp = new Array();
tmp[0] = new Mot("c", "Langage C", false, false);
tmp[1] = new Mot("cpp", "C++", false, false);
tmp[2] = new Mot("csharp", "C#", false, false);
LM.push(new ListeMot(1, "expr", tmp));

// Liste des types de listes
var tmp = new Array();
tmp[0] = new Mot("num", "Numérique", false, false);
tmp[1] = new Mot("puces", "A puces", false, false);
LM.push(new ListeMot(1, "liste", tmp));

// Liste des tailes de titres
var tmp = new Array();
tmp[0] = new Mot("1", "Très grand", false, false);
tmp[1] = new Mot("2", "Grand", false, false);
tmp[2] = new Mot("3", "Moyennement grand", false, false);
tmp[3] = new Mot("4", "Moyennement petit", false, false);
tmp[4] = new Mot("5", "Petit", false, false);
tmp[5] = new Mot("6", "Très petit", false, false);
LM.push(new ListeMot(1, "titre", tmp));

// on dégage tmp pour libérer la mémoire
tmp = null;

function texte_KeyPress(objTextarea, keyCode)
{
    
    // on récupère l'objet divListe
    objListe = document.getElementById("divListe");

    // on récupère le caractère d'à la ligne
    if (objTextarea.value.indexOf("\r\n") > -1) crlf = "\r\n";    // Windows
    else if (objTextarea.value.indexOf("\r") > -1) crlf = "\r";   // Mac OS
    else crlf = "\n"; // Unix/Linux
    
    // on récupère la position du curseur dans le texte
    iPosCurseur = trouvePosCurseur(objTextarea);
    iCode = -1;
    
    // on sépare les mots et les "codes" potentiels
    tampon = "";
    mots = new Array();
    for (i = 0; i < objTextarea.value.length; i++)
    {
        carac = objTextarea.value.substr(i, 1);
        if (carac == "[")
        {
            if (tampon != "")
            {
                mots.push(tampon);
            }
            tampon = carac;
        }
        else if (carac == "]")
        {
            mots.push(tampon + carac);
            tampon = "";
        }
        else
        {
            tampon += carac;
        }
    }
    if (tampon != "") mots.push(tampon);
    
    // on crée la liste des objets de chaque mot DE CODE uniquement
    iPosition = 0;
    codTexte = new Array();
    for (i = 0; i < mots.length; i++)
    {
        lemot = mots[i];
        if (lemot.substr(0, 1) == "[")
        {
            // la balise est elle fermee ?
            if (lemot.substr(lemot.length - 1, 1) == "]") ferme = true;
            else ferme = false;
            
            // est-ce une balise de fin ?
            if (lemot.length > 1)
            {
                if (lemot.substr(1, 1) == "/")
                {
                    balisefin = true;
                    abalisefin = false;
                }
                else
                {
                    balisefin = false;
                    abalisefin = true;
                }
            }
            else
            {
                balisefin = false;
                // on ne peut pas chercher la balise de fin
                abalisefin = false;
            }
            
            // on récupère les niveaux
            lemot = lemot.substr(1, lemot.length - (ferme ? 2 : 1));
            if (lemot.substr(0, 1) == "/") lemot = lemot.substr(1, lemot.length - 1);
            niveaux = lemot.split(":");
            
            // si on peut chercher une balise de fin éventuelle
            if (abalisefin)
            {
                abalisefin = false;
                // on cherche la balise de fin (ou la prochaine balise similaire)
                for (j = i + 1; j < mots.length; j++)
                {
                    // trouvé, ok, on quitte
                    if (mots[j] == "[/" + niveaux[0] + "]")
                    {
                        abalisefin = true;
                        break;
                    }
                    else if (mots[j].substr(0, niveaux[0].length + 2) == "[" + niveaux[0] + "]" || mots[j].substr(0, niveaux[0].length + 2) == "[" + niveaux[0] + ":")
                    {
                        abalisefin = false;
                        break;
                    }
                }
            }
            
            // on peut enfin créer notre objet
            codNouveau = new Code(niveaux, iPosition, mots[i].length, ferme, balisefin, abalisefin);
            codTexte.push(codNouveau);
            
            // On regarde si c'est le Code pour lequel .position <= iPosCurseur && .position + .longueur >= iPosCurseur
            // ce code est celui sur lequel se trouve actuellement le curseur
            if (codNouveau.position < iPosCurseur && codNouveau.position + codNouveau.longueur >= iPosCurseur)
                iCode = codTexte.length - 1;
            
        }
        
        // on actualise la position
        iPosition += mots[i].length;
    }
    
    // si le curseur n'est sur aucun code
    if (iCode == -1) 
    {
        objTextarea.focus();
        objListe.style.visibility = "hidden";
        return;
    }
    else // Sinon
    {
        if (!codTexte[iCode].ferme && !codTexte[iCode].balisefin) // Si on est pas fermé
        {
            // On cherche la liste de .niveau == codTexte[iCode].niveaux.length - 1
            // et dont .avant == codTexte[iCode].niveaux[codTexte[iCode].niveaux.length - 2]
            iListe = -1;
            for (i = 0; i < LM.length; i++)
            {
                if (LM[i].niveau == codTexte[iCode].niveaux.length - 1 && LM[i].avant == codTexte[iCode].niveaux[codTexte[iCode].niveaux.length - 2])
                {
                    iListe = i; // trouvée
                    break;
                }
            }
            
            // Si on ne l'a pas trouvée
            if (iListe == -1)
            {
                objTextarea.focus();
                objListe.style.visibility = "hidden";
                return;
            }
            else // Sinon
            {
                objListe.innerHTML = LM[iListe].creerListe(codTexte[iCode].avant, codTexte[iCode].niveaux[codTexte[iCode].niveaux.length - 1]);
                positionneListe(objTextarea, objListe);
                objListe.style.visibility = "visible";
            }
        }
        else if (!codTexte[iCode].balisefin && !codTexte[iCode].abalisefin && codTexte[iCode].niveaux[0] != "citer" && keyCode != 8 && keyCode != 46) // Si on est pas une balise de fin et si on a pas de balise de fin
        {
            // On ajoute la balise de fin correspondante
            ajouteTexte("[/" + codTexte[iCode].niveaux[0] + "]");
            objTextarea.focus();
            
            if (objTextarea.createTextRange) // IE
            {
                iPosition = trouvePosCurseur(objTextarea);
                posCurseur = objTextarea.createTextRange();
                posCurseur.move("character", iPosition - (codTexte[iCode].niveaux[0].length + 3));
                posCurseur.select();
            }
            else if (objTextarea.setSelectionRange) // NN/Mozilla
            {
                objTextarea.selectionStart -= (codTexte[iCode].niveaux[0].length + 3);
                objTextarea.selectionEnd = objTextarea.selectionStart;
            }
            objListe.style.visibility = "hidden";
        }
        else
        {
            // En attendant la suite...
            objTextarea.focus();
            objListe.style.visibility = "hidden";
        }
    }
    
}

function positionneListe(objTextarea, objListe)
{

    // on récupère le caractère d'à la ligne
    if (objTextarea.value.indexOf("\r\n") > -1) crlf = "\r\n";    // Windows
    else if (objTextarea.value.indexOf("\r") > -1) crlf = "\r";   // Mac OS
    else crlf = "\n"; // Unix/Linux
    
    objTextarea.focus();
    
    if (objTextarea.createTextRange) // IE
    {
        posCurseur = window.document.selection.createRange().duplicate();
        objListe.style.left = posCurseur.boundingLeft + posCurseur.boundingWidth + objTextarea.scrollLeft;
        objListe.style.top = posCurseur.boundingHeight * (objTextarea.value.substr(0, trouvePosCurseur(objTextarea)).split(crlf).length) + objTextarea.scrollTop + lHaut(objTextarea);
        
    }
    else if (objTextarea.setSelectionRange) // NN/Mozilla
    {
        // Comment faire ?

    }
}

function lHaut (objTextarea)
{
    i = objTextarea.offsetTop;
    obj = objTextarea.offsetParent;
    while (obj)
    {
        i += obj.offsetTop;
        obj = obj.offsetParent;
    }
    return i;
}

// Trouve la position du curseur dans le texte
function trouvePosCurseur(objTextarea)
{
    objTextarea.focus();
    
    if (objTextarea.createTextRange) // IE
    {
        posCurseur = document.selection.createRange().duplicate();
        posCurseur.collapse();
        posCurseur.moveStart("textedit", -1);
        return posCurseur.text.length;
    }
    else if (objTextarea.setSelectionRange) return objTextarea.selectionStart; // NN/Mozilla
    else return -1; // ?
}

// Ajoute du texte là ou est le curseur
function ajouteTexte(strAjout)
{
    objTextarea = document.frmEditeur.texte;
    
    objTextarea.focus();
    
    if (objTextarea.createTextRange) document.selection.createRange().text += strAjout; // IE
    else if (objTextarea.setSelectionRange) // NN/Mozilla
    {
        iLongueur = objTextarea.selectionEnd;
        objTextarea.value = objTextarea.value.substr(0, iLongueur) + strAjout + objTextarea.value.substr(iLongueur);
        objTextarea.setSelectionRange(iLongueur + strAjout.length, iLongueur + strAjout.length);
    }
    else objTextarea.value += strAjout; // ?
    
    texte_KeyPress(objTextarea, 0);

}

// Vérifie que les données soumises sont correctes
function verifEditeur(objTextarea)
{
    if (objTextarea.value.replace("\r", "").replace("\n", "").replace("\t", "").replace(" ", "") == "")
    {
        alert("Vous devez saisir un message !");
        objTextarea.focus();
        return false;
    }
    else
        return true;
}
</script>
</head>
<body>

 <!-- Editeur -->
 <form name="frmEditeur" action="" method="post">
  <textarea name="texte" onkeyup="javascript:if (frmEditeur.aidesaisie.checked) texte_KeyPress(this, event.keyCode);"></textarea>
  <table border="0" cellspacing="0" cellpadding="2">
   <tr>
    <td><input type="checkbox" name="aidesaisie" checked></td>
    <td class="normal">Aide à la saisie</td>
   </tr>
  </table>
 </form>
 <div id="divListe" style="position: absolute; border: outset 1px; padding: 0px; visibility: hidden"></div>
 
</body>
</html>

Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

editeur.html 17 595 octets

Télécharger le zip

Sources de la même categorie

TROUVER UN ITINÉRAIRE AVEC GOOGLE MAP par amrounix

DECOMPTEUR ET CHECKBOX TEMOIN par dialvb

L'API GOOGLE EARTH par brennal

SIMULER UN SERVEUR COMET (EN PUSH) EN PHP ET JS par sebcap26

OPÉRATIONS SUR MATRICES par Minilogus

Toutes les sources de la catégorie Divers

Commentaires et avis

Commentaire de coucou747 le 15/12/2004 17:38:03

Perso, ça ne marche ni sous Mozilla forefox, ni sous Konqueror...

Commentaire de rttb le 15/12/2004 17:50:01

C'est genial !!!
Tu devrais juste preciser qu'il faut taper un "[" pour afficher la completion, j'ai galere a trouver ca.

Sinon, je te met 9/10

Commentaire de rttb le 15/12/2004 17:54:31

sous mozilla firefox 1.0 cela fonctionne chez moi.
le cadre du texte de completion est juste decale en dessous du textarea.

Commentaire de ennixo le 15/12/2004 18:13:50

je viens juste de tester :

IE (Win) : ça marche car il n'y a pas de texte avant la textarea

FireFox 1.0 (Win), Mozilla (Linux), Epiphany (Linux) : ça marche mais liste en bas avec sélection cheloue

Konqueror (Linux) : marche pas

Commentaire de ennixo le 16/12/2004 23:48:13

wow je sais pas si vous avez remarqué mais au bout d'à peine 5 lignes ça rame méchament...

Commentaire de rttb le 17/12/2004 13:50:19

Chez moi, cela ne ralentis pas...

Il y a un petit 'bug', lors de l'insertion du code, le curseur ne se retrouve pas entre les ][,il se trouve ailleur, apres le [/ la plupart du temps.

Commentaire de ennixo le 17/12/2004 14:08:43

paske ya pa bocoup de codes surement, j'utilise de bien plus grands tableaux en vérité et donc ça rame

et ça ne marche que sous FF, Mozilla et Epiphany

Commentaire de ehmarc le 21/12/2004 16:38:51

salut
ca a l'air d'etre bien mais perso ca marche pas (ie5)
a la moindre lettre que je tape il sort une erreur

Ajouter un commentaire

Nos sponsors

Derniers Blogs

WP7 5K BELGIUM CHALLENGE par junarnoalg

LES MONADES POUR LES NULS par mdufourneaudravel

[WP7] AJOUTER DES IMAGES DANS LA MEDIA LIBRARY D'UN WINDOWS PHONE 7 par Audrey

VIVE LES MOCKS ET LES POCOS par vLabz

[WF4] WORKFLOW AND CUSTOM ACTIVITIES - BEST PRACTICES (4/5) par JeremyJeanson

Forum

RE : PROBLEME ENCHAINEMENT DE FONCTION par loicseg

PROBLEME ENCHAINEMENT DE FONCTION par loicseg

RE : MODéLISATION FILE D'ATTENTE DE COMMANDE AVEC HTML/AJAX/MYSQL par PetoleTeam

RE : CHANGER LA VALEUR D'UNE VARIABLE PAR UNE FONCTION par PetoleTeam

RE : SUBMIT AVEC UNE IMAGE EN AJAX : ENVOI DE FORMULAIRE par romi36

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Logiciels

Crystal Report (11)
CRYSTAL REPORT (11)

Crystal Reports est un outil de reporting souple et puissant, vous pouvez très facilement consult...

Cliquez pour télécharger Crystal Report
Academy System (12.0.2.0)
ACADEMY SYSTEM (12.0.2.0)

Logiciel de gestion des établissements. - élèves/étudiants (inscription, dossier, absence...) -...

Cliquez pour télécharger Academy System
Xilisoft iPod Vidéo Convertisseur 6 (6.0.3.0419)
XILISOFT IPOD VIDéO CONVERTISSEUR 6 (6.0.3.0419)

Xilisoft iPod Vidéo Convertisseur est un outil puissant de conversion d'iPod, facile à utiliser. ...

Cliquez pour télécharger Xilisoft iPod Vidéo Convertisseur 6
Xilisoft iPhone Vidéo Convertisseur 6 (6.0.3.0419)
XILISOFT IPHONE VIDéO CONVERTISSEUR 6 (6.0.3.0419)

Xilisoft iPhone Vidéo Convertisseur est le meilleur logiciel de conversion iPhone qui peut facile...

Cliquez pour télécharger Xilisoft iPhone Vidéo Convertisseur 6
Xilisoft iPad Vidéo Convertisseur 6 (6.0.3.0419)
XILISOFT IPAD VIDéO CONVERTISSEUR 6 (6.0.3.0419)

Il s'agit d'un logiciel polyvalent pour convertir les formats vidéo/audio populaires en formats p...

Cliquez pour télécharger Xilisoft iPad Vidéo Convertisseur 6