Textarea et Replace

Résolu
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013 - 7 août 2007 à 16:00
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013 - 8 août 2007 à 13:28
Bonjour, afin de créer une coloration syntaxique pour un site pmwiki, j'ai besoin de votre aide pour un script javascript !

En effet, je voudrais que dans un textaera, l'utilisateur entre son code vb brut (par exemple) :

Private sub Hello()
    For i=0 to 2 step 1
         MsgBox("Hello")
    Next i
End Sub

Et en cliquant sur un bouton, dans un deuxième textarea s'afficherait quelquechose comme :

%color=blue%Private%% %color=blue%Sub%% Hello() %color=green%'Un commentaire'%%
-> %color=blue%For%% i = 0 %color=blue%to%% 2 %color=blue%step%% 1
-->%color=blue%MsgBox%%(%color=darkred%"Hello"%%)
-> %color=blue%Next%% i
%color=blue%End%% %blue%Sub%%

-- Détails--

j'ai mis en rouge ce qui doit être ajouté pour que pmwiki puisse afficher ceci :

Private Sub Hello()
    For i = 0 to 2 step 1
       MsgBox("Hello")
    Next i
End sub

Résumé des tags :

-%color=blue%% Mon Texte %%// Donne la couleur du texte entre chaque '%%'
- -> // Permet de créer une indentation
- --> // Permet de créer une indentation plus forte

14 réponses

the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
8 août 2007 à 09:48
Bonjour,
en effet je m'étais totalement planté...
là c'est mieux...
Cordialement,
Pierrick

var reReservedKeys = /Private|Sub|For|To|Step|MsgBox|Next|End/;
var tplReservedKeys = "%blue%#{0}%%";

var reComment = /'[^']*'/;
var tplComment = "%green%#{0}%%";

var reString = /"[^"]*"/;
var tplString = "%darkred%#{0}%%";

var reIndent1 = / {4}/;
var tplIndent1 = "->";

var reIndent2 = / {8}/;
var tplIndent2 = "-->";

var reIndent3 = / {12}/;
var tplIndent3 = "--->";

var reIndent4 = / {16}/;
var tplIndent4 = "---->";
function haveFun(){
    var s = document.getElementById("source").value;
    s = s.gsub( reReservedKeys, tplReservedKeys)
        .gsub( reComment, tplComment)
        .gsub( reString, tplString)
        .gsub( reIndent4, tplIndent4)
        .gsub( reIndent3, tplIndent3)
        .gsub( reIndent2, tplIndent2)
        .gsub( reIndent1, tplIndent1);
    document.getElementById("destination").value = s;
}
3
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 16:07
J'ai pensé à une fonction comme ceci pour la coloration :

function ColorCode (texte) {

var reg = /Private|Sub|For|To|Step|MsgBox|Next|End/;
texte = texte.replace(reg, "%blue%"&reg&"%%");

}

Mais je ne vois toujours pas comment traduire :

- un '   ' en '->'
- un '       ' en '-->'
- colorer en vert tout ce qui commence par un ' et finit par un '
- colorer en darkred tout ce qui commence par un " et finit par un "

De même, je ne sait pas comment appeler la fonction depuis un bouton, executer la fonction sur le premier textarea et afficher le resultat dans le second..

Bref, je ne m'y connait pas du tout en java et donc j'aurais grand besoin d'aide !

Un grand Merci à vous !!!
0
the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
7 août 2007 à 17:31
Bonjour,
J'ai testé ce bout de code, pour les trois reg exp (keysWord, comment, string) mais avec la librairie prototype dispobible ici ( c'est bien plus élégant).
Je bosse sur les indentaions et j'ai une question:
Y a t'il autant de tiret que d'espaces? -  exemple:
' ' donne ->
'    ' donne -->
'        ' donne -->
Cordialement, Pierrick.
<---------------------------------------------------------------------------------------------------------->
<html>
<head>
<title></title>
<style type="">
#source{
    width: 43%;
    height: 100%;
    float: left;
}
#myButton{
    width: 8%;
    height: 100%;
    float: left;
    margin-left: 30px;
    margin-right: 30px;
}
#destination{
    width: 43%;
    height: 100%;
    float: left;
}
</style>

<script src='prototype.js'></script>
<script language="javascript" type="text/javascript">
<!--
var reReservedKeys = /Private|Sub|For|To|Step|MsgBox|Next|End/;
var tplReservedKeys = "%blue%#{0}%%";

var reComment = /(.*)('.*')(.*)/;
var tplComment = "#{1}%green%#{2}%%#{3}";

var reString = /(.*)(".*")(.*)/;
var tplString = "#{1}%darkred%#{2}%%#{3}";
function haveFun(){
    var s = document.getElementById("source").value;
    s = s.gsub( reReservedKeys, tplReservedKeys);
    s = s.gsub( reComment, tplComment);
    s = s.gsub( reString, tplString);
    document.getElementById("destination").value = s;
}
-->
</script>

</head>

<textArea id='source'></textArea>

<textArea id='destination'></textArea>

</html>
0
the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
7 août 2007 à 17:43
Sinon, c'est tout simplement cela:
var reReservedKeys = /Private|Sub|For|To|Step|MsgBox|Next|End/;
var tplReservedKeys = "%blue%#{0}%%";

var reComment = /(.*)('.*')(.*)/;
var tplComment = "#{1}%green%#{2}%%#{3}";

var reString = /(.*)(".*")(.*)/;
var tplString = "#{1}%darkred%#{2}%%#{3}";

var reIndent1 = /(.*)( {3})(.*)/;
var tplIndent1 = "#{1}->%#{3}";

var reIndent2 = /(.*)( {7})(.*)/;
var tplIndent2 = "#{1}-->%#{3}";
function haveFun(){
    var s = document.getElementById("source").value;
    s = s.gsub( reReservedKeys, tplReservedKeys)
        .gsub( reComment, tplComment)
        .gsub( reString, tplString)
        .gsub( reIndent2, tplIndent2)
        .gsub( reIndent1, tplIndent1);
    document.getElementById("destination").value = s;
}
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
7 août 2007 à 17:45
Oups y a une erreur dans les templates des indentations...
Je te laisse la chercher... C'est le signe pour une fraction dont le dénominateur est 100.
Cordialement,
Pierrick.
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 17:46
C'est vraiment du très joli travail, Félicitation !!

Alors pour les indentations, j'ai compté les 'espaces' depuis VS

En fait '->' correspond à une tabulation
          '-->' à deux etc..

Dans VS, une tabulation équivaut à 4 espaces.
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 17:54
{X} cette balise définit-elle les espaces ?
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 17:58
Oups je viens de lire ton message, je vais voir si je trouves :p
0
the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
7 août 2007 à 18:17
En effet le nombre en accolade veut dire exactement n occurences.

Donc si c'est 4 et 8 remplace respectivement 3 et 7 par 4 et 8.

Fais réponse accéptée,

Cordialement,

Pierrick
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 19:08
Et bien merci,par contre faut que je bidouille encore un chouilla car par défaut VS Crée une tabulation..

Je m'explique au lieu d'avoir

Public ..
    Le code..

On a :

    Public
        Le code..

Donc faut que j'ajoute indent3 et 4 en plus du 1 et 2 avec 12 et 16.. :p
0
the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
7 août 2007 à 19:33
Bonsoir,
Je pense que ce n'est pas une bonne solution de rajouter autant de gsub que de nombre d'indentation possible.
Il faut automatiser cela, j'y planche demain.
Cordialement,
Pierrick
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 20:49
Merci, c'est vrai que c'est pas tip top la panoplie de gsub.. :p

Surtout que le top serait d'interdire tous les autres espaces..

Par exemple :

-     Sources      ///    Résultat

- 1,2,3 espaces  ///    Il n'y a plus d'espaces dans le résultat
- 4 espaces       ///    Indentation, on supprime les espaces et on ajoute devant ->
- 5,6,7 espaces  ///    Il n'y a plus d'espaces dans le résultat
- 8 espaces       ///    Indentation, on supprime les espaces et on ajoyre devant -->

etc...
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
7 août 2007 à 23:33
Un petit problème..

"Bonjour", "Bonjour" donne

"Bonjour", %color=darkred%"Bonjour"%%

Seul le dernier est coloré..
0
tinux Messages postés 244 Date d'inscription mercredi 13 avril 2005 Statut Membre Dernière intervention 21 octobre 2013
8 août 2007 à 13:28
Bravo, c'est nickel (pour les indents, j'avais déjà simplifié comme vous l'avez fait :p) Par contre pour la coloration, je ne maitrise pas assez bien ce genre d'expressions.

C'est un grand service que vous m'avez rendu là, Merci.
0
Rejoignez-nous