Problème WYSIWYG avec Opera et fonction Contenteditable.

Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007
-
Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007
-
Bonjour.

j'ai un petit problème, je dévloppe un widget pour Opera 9.x dans le but de faire un éditeur WYSIWIG.

Il y a peu, j'ai découvert la fonction ContentEditable qui permet d'en avoir un "tout fait" compatible Opera (il supporte cette fonction depuis sa version 9.0 beta). J'avais donc déssidé de me basé sur cette fonction pour dévloppé mon widgets.

Étant donné que la fonction ContentEditable interprète directement le HTML dans un "champ de texte", il est très facile de rajouté des fonctions comme mettre de la couleur ou autre avec un petit code Javascript.

Dans tout éditeur WYSIWYG qui se respècte, on sélectionne du texte et on choisit une couleur a lui donner. Il colore donc le texte que l'on as selectionné.

J'ai donc cherché comment faire pour faire cela, mon attention s'est donc portée sur un script qui perméttait de savoir le texte que l'on avais selectionné. Il sufisais donc d'éffacé la selection et de rajouté des balises
comme ceci
autour de la selection pour mettre de la couleur.

J'ai donc réalisé quelques tests avec ces fonctions assez utile, ça m'avais l'air assez concluant.

Mais au moment de l'intégré a mon éditeur WYSIWYG, un problème est survenue; La fonction ne marche pas si la fonction contenteditable est présente dans la page.

Je ne trouve donc absolument pas comment faire, voici le code que j'avais tapé pour faire mon éditeur WYSIWYG. Si vous connaissez une autre fonction perméttant de connaître le contenu de la selection, merci de me la communiquée.



[javascript:Selection(); Rouge]
Balise de début de rougeBalise de fin de rouge
texte



Merci d'avance pour vos réponses.

12 réponses

Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007

Arf, le forum as interprété mon code HTML, voici le code non interprété :

<script>
function Selection ()
{
copy = document.selection.createRange().text;
if(copy == "" )
{
document.getElementById('WYSIWYG').innerHTML="
Rouge
";
}
else
{
document.getElementById('WYSIWYG').innerHTML="
"+copy+"
";
}
}
</script>

Rouge


Balise de début de rouge
Balise de fin de rouge



texte
Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007

Il semble qu'il y ai un légé blem de compatibilitée entre le forum et Opera, néamoins, voici le code non interprété avec sauts de lignes...

<script>

function Selection ()

{

copy = document.selection.createRange().text;

if(copy == "" )

{

document.getElementById('WYSIWYG').innerHTML="
Rouge
";

}

else

{

document.getElementById('WYSIWYG').innerHTML="
"+copy+"
";

}

}

</script>


Rouge


Balise de début de rouge
Balise de fin de rouge



texte
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
bonjour,

   on ne voit pas ton code.
   connaitre le contenu de la sélection, il y a plusieurs
      exemple compatible FF,IE ici même,
      mais opera ? montre nous ( puisqu'on ne voit pas ! )
      on te dira si c'est ok avec FF, IE, tant à Opera ?
  ( passe par un éditeur de texte pour mettre ton code )  

cordialement   Bul    

Site

    

M'écrire
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
ah... on voit mieux...
ce que tu utilise est exclusif IE.
avec le Renard de Feu : un truc comme ça :
   element.value.substring(element.selectionStart,element.selectionEnd);
   ( ou pas loin )
à tester donc avec Opera.
cordialement   Bul    Site    M'écrire
Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007

Bonjour, bultez.

Le forum est très peu compatible avec Opera en mode "textbox evolué". C'est pourquoi il as interprété mon HTML & cie.

Ce code n'est pas prévu pour être compatible Firefox qui ne gère pas la fonction ContentEditable. Il est prévu pour être un éditeur WYSIWYG en widget pour Opera 9.x.

Revoici le code qui ne sera je l'espère pas interprété par le forum.
-----------------------------------------------------------------------------
<script>
function Selection ()
{
copy = document.selection.createRange().text;
if(copy == "" )
{
document.getElementById('WYSIWYG').innerHTML="
Rouge
";
}
else
{
document.getElementById('WYSIWYG').innerHTML="
"+copy+"
";
}
}
</script>

Rouge


Balise de début de rouge
Balise de fin de rouge



texte


-----------------------------------------------------------------------------

Il ne marche pas sous Opera 9.0, le script n'arrive pas a determiné quel texte nous avons selectionné quand la fonction Contenteditable est active, si elle n'est pas dans le code, il arrive très bien a savoir ce que l'on as selectionné.

Ces deux fonctions ne peuvents aparement pas êtres dans la même page, en connaissez vous une alternative pour faire ce que je veux faire?
Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007

desoler j'ai répondu pendant que vous répondiez, non non ce n'est pas exclusif IE, ContentEditable foncionne très bien sous Opera 9 ;)
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
précision : à la place de createRange
pas regardé le reste.
cordialement   Bul    Site    M'écrire
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
rien à faire...
je crains que l'on ne  se croise jusqu'au bout....
pour la compatibilité de parlais de createRange qui est exclusif IE (je crois)
cordialement   Bul    

Site

    

M'écrire
Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007

heu, le code pour connaître la selection fonctionne très bien sous opera en temps normlal, mais quand on met
texte
qui permet de faire une sorte d'éditeur WYSIWYG, la fonction ne marche plus...
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
<humour>malalam va encore dire que je fais de
la pub pour une de mes sources, mais c'est pour
la bonne cause, alors : </humour>
j'ai mis

ici même

 une source qui ne fonctionnait
pas avec Opera, je viens de retester avec la
dernière version, et ça semble aller mieux,
si à=ça peut aussi aider...

cordialement   Bul    

Site

    

M'écrire
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
j'avais prévenu que l'on se croiserait jusqu'au bout...
le seule solution que j'ai trouvée pour faire fonctionner
un wysiwyg avec IE,FF,Opera donc auhourd'hui c'est
de passer par u n Iframe en utlisant .designMode='On';
je n'y suis pas parvenu avec un div...
cordialement   Bul   



 Site    M'écrire
Messages postés
43
Date d'inscription
dimanche 13 juin 2004
Statut
Membre
Dernière intervention
8 janvier 2007

La version prècédente d'Opera ne gérait pas la mise en forme donc probablement AUCUN éditeur WYSIWYG ne marchait avec :/

Et je cherche pas a le faire compatible avec les 3, juste avec Opera pour faire un ptit widget a la Word, ;)

Va encore falloir que je cherche un moyen de faire marché ce truc la mwa :/