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

Ce site au démarrage

begin process at 2012 02 09 17:25:04

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é :3 147 / 173

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

COLONNES ADAPTABLES EN HAUTEUR par dronoide

VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES par william voirol

HTML5 PLAYER par kazma

SCROLLBAR PERSONNALISABLE par kazma

INFO BULLE par RudiRatlos

Toutes les sources de la catégorie Divers

Commentaires et avis

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

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

TECHDAYS PARIS 2012 : SESSION PLEINIèRE JOUR 3 par ROMELARD Fabrice

MISHRA READER : UN LECTEUR RSS TRèS ZUNE STYLE EN OPEN SOURCE ! par Vko

[FRAMEWORK 4] LES TASKS ET LE THREAD UI par fathi

WORKFLOW FOUNDATION 3 A UN PIED DANS LA TOMBE par JeremyJeanson

TECHDAYS PARIS 2012 : NOUVELLES TENDANCES DU POSTE DE TRAVAIL - BRING YOUR OWN PC par ROMELARD Fabrice

Forum

PB GETTER ET SETTER SUR IE<9 par aerolyte

CREATION DE SCORING OU RATING par Alex16000

API ANYWHERE DE TWITTER par coach872

RE : VéRIFICATION FORMULAIRE par maha1987

SCROLL D'IMAGES DANS UNE PAGE HTML : ORDRE ALéATOIRE DES IMAGES ? par cyber5784

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Fonctionnalites supplementaires sous Joomla
Budget : 800€
Animation interactive pour I phone
Budget : 2 000€
Creation de site web pour une administration scolaire
Budget : 10 000€

Logiciels

Academy System (17.2.1.0)
ACADEMY SYSTEM (17.2.1.0)

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

Cliquez pour télécharger Academy System
Easy-Planning (1.0.0.1)
EASY-PLANNING (1.0.0.1)

Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ...

Cliquez pour télécharger Easy-Planning
COLLECTOR PLUS (3.00B)
COLLECTOR PLUS (3.00B)

COLLECTOR PLUS version 3.00B est un logiciel utilisant une base de données alimentée par : - L...

Cliquez pour télécharger COLLECTOR PLUS
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)

PONAMEDIA TV DEVIENS HELLLOOO FLASH LA TV SUR VOTRE ORDINATEUR. Toute une plateforme Multi...

Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO
LettresFaciles 2011 (8.0.0.1)
LETTRESFACILES 2011 (8.0.0.1)

LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types. Son inte...

Cliquez pour télécharger LettresFaciles 2011