Discussion :

[patricktoulon]

Bonsoir Melka one

ben oui c'est pour ca la boucle

si dans la boucle l'element[i].innertext =selection alors mettre le textshadow a l'élément et sauter la création de la balise font c'est ce que j'ai dis plus haut

en fait il faudrait même détecter le "<p>" parent de la sélection a fin de ne pas mettre le shado sur une autre ligne qui aurait la même chaine de caractères sélectionnée

[patricktoulon]

re
bon après une bonne journée de boulot je cogite mieux va savoir toi

voila j'ai presque obtenu ce que je souhaite sauf que je boucle sur document .all si il y a plusieur chaines identique dans le texte ca risque de mettre le shado sur le mauvais
mais déjà ma boucle fonctionne

voila ou j'en suis

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
////////////////////////////////////////////////////////////////////////////////////
function shadowcolor(coul){
if (selectionne_text()){   
var selection = selectionne_text();
 
var elements=document.all;
for (var i=0;i<elements.length;i++){  if (elements[i].innerText==selection){var elem=elements[i];var ok="ok"}}//on détermine l'élément et la variable ok si c'est bon 
 
if(ok=="ok"){elem.style.textShadow = "0px 0px 10px "+coul; }//si c'est bon l'élément prends le shado 
 
if(ok !="ok"){ //si c'est pas bon !!!
 var selectedText = selection.extractContents();
   var balisefont = document.createElement("FONT");
   balisefont.className="shado";
                                             balisefont.appendChild(selectedText);
                                             balisefont.style.textShadow = "0px 0px 10px "+coul; 
   selection.insertNode(balisefont);
if (balisefont.children.length==1){
                                                                  if(balisefont.children(0).innerText==balisefont.innerText){
                                                                                                        alert("enfant:  "+balisefont .outerHTML);}
                                                                 }
 
if (balisefont.parentElement.innerHTML==balisefont.outerHTML){
                                                                                                                    alert("parent:  "+balisefont.parentElement.outerHTML);
                                                                                                                    }     
 
}
}
}
///////////////////////////////////////////////////////////////

y aurais il un moyen rapide (expression pour déterminer le parent("<p>") sur la selection ?????? ca serait bien plus pratique

[patricktoulon]

re
autant pour moi c'est bon !!!!!!! j'ai fait le test avec 3 chaines de caractères identiques dans mon texte et le fait de tester selection fait que le shado est bien appliqué sur la chaine que j'ai sélectionné même si c'est pas le premier

youpi tralala la ca marche

il me reste plus qu'a trouver le moyen de supprimer un éventuel texshadow qui serait parmi la sélection

en effet si j'ai monde avec "on" en texte shado vert par exemple et que je sélectionne "monde" ca me met tout ce qui n'est pas en vert avec le shado mais laisse "on" en vert il faut donc que je supprime la parti en vert

en tout cas je pige vite ce soir

bon après il faudra certainement mettre ca au propre voir faire des if else plutôt que des if a la suite

super trop content je vais pouvoir avancer


merci merci !!!

[Invité]

Bon....

Je ne voudrais pas passer pour le rabat-joie de service, mais la balise <font> est obsolète...

Cette fonctionnalité est obsolète.
Bien qu'encore supportée par des navigateurs, son utilisation est découragée pour tout nouveau projet.
Évitez de l'utiliser.

Pour ton WYSIWYG, tu utilises notamment <font face="..." color="..." size="...">.....

Si je me réfère à CKeditor (que j'utilise), on aurait plutôt 3 balises <span> :
<span style="font-family:....;"><span style="color:....;"><span style="font-size:....;">....

[patricktoulon]

Bonsoir Jreaux62

non c'est pas rabajoi
je connais ckeditor il y a aussi la dernière évolution du TINI editor qui est pas mal aussi

seul problème il utilise "query" et malheureusement moi je ne peut pas dans mon userform excel

après des spans pour chaque propriétés si tu veux oui on peut faire aussi:

<p><span style="color :#0ff000;font-family:verdana> bonjour</span><span style=" color:#0FF123;font-size:30px>Jreaux62</span></p>

rien n'empêche

apres perso je me pose une question

la plus part des fonctions comme color,backcolor,etc... ajoute eux même les balises font etc.....

peut être que JavaScript devrait alors mettre a jour alors sa fonction execcommand

après rien ne m'empêche l'ors de la finalisation de mon document de faire une conversion en uses css

si tu a des idées sur cette questions je suis preneur

[Invité]

Je parlais aussi et surtout du fait de SEPARER chaque "instruction" (clic sur icone) dans une balise <span> individuelle.

Ce qui me semble plus facile à gérer que, comme tu sembles chercher à le faire, à regrouper plusieurs instructions dans une seule balise.
<span style="color :#0ff000;font-family:verdana> : 2 instructions dans une même balise.
Pas évident à gérer sans prise de tête et codes complexes...


Alors que : 1 icone -> 1 balise span
C'est simple à gérer / ajouter / supprimer.

[patricktoulon]

re

oui j'avais compris mais je suis parti sur la bases du résultat que j'obtiens avec execcommand qui semble ne pas poser problème dans un control ocx (webbrowser) dans un userform

j'ai déjà fait des modules de conversion avec ma fonction BYSPAN en vba notamment dans ma contribution vba grille exel to html le raisonnement ne changeant pas je pourrais le refaire

en JavaScript

j'ai même fait une fonction stinline2outline afin de récupérer tout les Style les dé doublonné et les mettre entre balises "<style></style>"

mais je ne suis pas dans mon élément dans JavaScript je tâtonne et découvre

[patricktoulon]

Bonjour a tous
bon voila j'ai bien galéré mais j'ai réussi a finir la fonction shadow

l'idée était de pouvoir revenir sur sa décision c'est a dire de changer le textshadow a volonté
en effet si je sélectionnais du texte dont une partie avait déjà un textshadow cette partie restais identique j'ai du combiner

voila la fonction

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function shadowcolor(coul){
if (selectionne_text()){   
 var selection = selectionne_text();
 var elements=document.all;
  for (var i=0;i<elements.length;i++){  if (elements[i].innerText==selection){var elem=elements[i];var ok="ok"}}
               if(ok=="ok"){
                  var codehtml= elem.innerHTML;                                                                  
                  var colhtml=elem.all;
                                      if (colhtml.length>0){
                                           for(var i=0;i<colhtml.length;i++){
                                             var strinnerT=colhtml[i].innerHTML;
                                             var str = colhtml[i].outerHTML;
                                             var deb = "class=" + str.split("class=")[1];
                                             var fin = deb.split(">")[0];                                                                                                                                                                          
                                             var str2=  str.replace(fin,"");                                                                                                                                                                     
                                             var bal=str2.substring(0, 7);
 
                                            if (bal =="<font >"){var codehtml=codehtml.replace(str,strinnerT);}
                                            if (bal !="<font >"){ var codehtml=codehtml.replace(fin,"");}
 
                                                                                                            }
                                          }
                                                               elem.innerHTML=codehtml;
                                                       elem.style.textShadow = "0px 0px 10px "+coul; 
                                                                 }
 
if(ok !="ok"){
 var selectedText = selection.extractContents();
   var balisefont = document.createElement("FONT");
   balisefont.className="shado";
                                             balisefont.appendChild(selectedText);
                                             balisefont.style.textShadow = "0px 0px 10px "+coul; 
   selection.insertNode(balisefont);
                              }
}
}
///////////////////////////////////////////////////////////////

pour parfaire cette fonction il faudrait que j'arrive a déterminer les élément qui sont concernés par la sélection en cas de croisement (partie droite de la précédente/partie gauche de la suivante )

[melka one]

attention a document.all qui fonctionne uniquement avec internet explorer qui peut etre remplacé par document.getElementsByTagName("*")

[patricktoulon]

Bonjour Melka one
oui j'ai lu cela
pour ma part ca n'a pas trop d'incidence vu que le wysiwyg et dans un controls ocx(webbrowser) dans mon userform excel et vu que celui ci utilise les librairies IE09 et quelque fonctions compatible IE10 et 11 avec des balises méta bien placées

mais en tout cas je ne savais pas que l'on pouvais utiliser le joker"*" de cette manière

merci pour le tuyaux

en VB on a la fonction right("quelquechose",5)qui nous donne les 5 dernières lettres de "quelquechose"

aurait il la même chose en JavaScript ?????????

merci pour les retours

[Invité]

String.substr() ?

[patricktoulon]

re
Bonjour Jreaux62
non ta formule donne les 5 premiers
alors j'ai trouvé toujours avec substring qui s'apparenterait a mid en VB,VBA,VBS

comme je ne connais pas la longueur de la chaine alors je fait comme ceci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
//quand je créé la balisefont et intègre la sélection il peut arriver que j'ai plusieurs enfants dans la balisefont 
 
//il me donc tester tout les éléments avec le substring(droite) correspondant au enfant de la balisefont
// j'essai de trouver la bonne formule 
if( balisefont.children.length >1){
var elements=editeur.getElementsByTagName("*");
for (var i=0;i<elements.length;i++){str=elements[i].innerText;alert(str.substring(str.length,str.length-4));}
}

merci pour les retours c'est sympa ca m'aide a faire passer mon mal de crane

[patricktoulon]

re
bonjour a tous ca y est on y est !!!

voila maintenant c'est vraiment a volonté
en fait c'était tres simple je ne sais pas pourquoi je me suis compliqué la vie
maintenant on modifie le shadow même avec des balises entrecroisées il fallait simplement s'occuper des enfant de la balises créée après le append Child sur le selectedtext

voila maintenant plus besoins de formater avant de refaire le shadow

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
////////////////////////////////////////////////////////////////////////////////////
function shadowcolor(coul){
if (selectionne_text()){   
 var selection = selectionne_text();
 var elements=editeur.getElementsByTagName("*");
  for (var i=0;i<elements.length;i++){  if (elements[i].innerText==selection){var elem=elements[i];var ok="ok"}}
               if(ok=="ok"){
                  var codehtml= elem.innerHTML;                                                                  
                  var colhtml=elem.getElementsByTagName("*");
                                      if (colhtml.length>0){
                                           for(var i=0;i<colhtml.length;i++){
                                             var strinnerT=colhtml[i].innerHTML;
                                             var str = colhtml[i].outerHTML;
                                             var deb = "class=" + str.split("class=")[1];
                                             var fin = deb.split(">")[0];                                                                                                                                                                          
                                             var str2=  str.replace(fin,"");                                                                                                                                                                     
                                             var bal=str2.substring(0, 7);
 
                                            if (bal =="<font >"){var codehtml=codehtml.replace(str,strinnerT);}
                                            if (bal !="<font >"){ var codehtml=codehtml.replace(fin,"");}
 
                                                                                                            }
                                          }
                                                               elem.innerHTML=codehtml;
                                                       elem.style.textShadow = "0px 0px 10px "+coul; 
                                                                 }
 
if(ok !="ok"){                 //debut du if pas ok
 var selectedText = selection.extractContents();
   var balisefont = document.createElement("FONT");
   balisefont.className="shado";
                                             balisefont.appendChild(selectedText);
if (balisefont.children.length>1){for (var i=0;i<balisefont.children.length;i++){balisefont.children[i].style.textShadow = "0px 0px 10px "+coul; }}
if (balisefont.children.length<2){ balisefont.style.textShadow = "0px 0px 10px "+coul; }
selection.insertNode(balisefont);
}//fin du if pas ok 
}//fin du if selectionnetext
}//fin de fonction shado
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

merci Jreaux;Melka one

[patricktoulon]

c'est quand on croit avoir gravi les dernières marches que soit on se rend compte que l'on a oublié les clés soit on les avais dans la poche


et oui en fait j'avais très bien travaillé au debut avec mon system de if ok/if pas ok

je m'ennuyais a vouloir corriger le défaut en cas de sélection multiple balises
mais en fait pas la peine il suffit de relancer la fonction

en effet la partie 1 gère les balises entière c'est a dire que si le texte sélectionné correspond a une balise entière on applique le style et on nettoie l'intérieur innerHTML

si ca n'est pas une balise entière on créé la balise et on lui applique le textshado

mais si la sélection et multiple ca applique que sur celle de gauche

alors en relançant la fonction la sélection ayant créé la balise la première fois prend la sélection comme un entier c'est le cas d'ailleurs et donc passe par le if ok et me nettoie le code
et par la même occasion ajoute le raté de la première passe
c'est vraiment tout bête
cette fois ci c'est du perfect!!!

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
////////////////////////////////////////////////////////////////////////////////////
function shadowcolor(coul){
if (selectionne_text()){   
 var selection = selectionne_text();
 var elements=editeur.getElementsByTagName("*");
  for (var i=0;i<elements.length;i++){  if (elements[i].innerText==selection){var elem=elements[i];var ok="ok"}}
               if(ok=="ok"){
                  var codehtml= elem.innerHTML;                                                                  
                  var colhtml=elem.getElementsByTagName("*");
                                      if (colhtml.length>0){
                                           for(var i=0;i<colhtml.length;i++){
                                             var strinnerT=colhtml[i].innerHTML;
                                             var str = colhtml[i].outerHTML;
                                             var deb = "class=" + str.split("class=")[1];
                                             var fin = deb.split(">")[0];                                                                                                                                                                          
                                             var str2=  str.replace(fin,"");                                                                                                                                                                     
                                             var bal=str2.substring(0, 7);
 
                                            if (bal =="<font >"){var codehtml=codehtml.replace(str,strinnerT);}
                                            if (bal !="<font >"){ var codehtml=codehtml.replace(fin,"");}
 
                                                                                                            }
                                          }
                                                               elem.innerHTML=codehtml;
                                                       elem.style.textShadow = "0px 0px 10px "+coul; 
                                                                 }
 
if(ok !="ok"){//debut du if pas ok
 var selectedText = selection.extractContents();
   var balisefont = document.createElement("FONT");
   balisefont.className="shado";  balisefont.appendChild(selectedText);
balisefont.style.textShadow = "0px 0px 10px "+coul; 
selection.insertNode(balisefont);
// on relance la fonction la selection sera donc la balise font donc une balise entiere
//donc la fonction passera par le if ok=="ok" et netoiera le code forcement
shadowcolor(coul); 
 
}//fin du if pas ok 
}//fin du if selectionnetext
}//fin de fonction shado
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

[patricktoulon]

bon apres plein de test le raisonnement du .all sur ledocument n'était pas bon quand la sélection était un subsubsub etc... enfant

mais comme le reste du raisonnement était bon j'ai décidé de l'appliquer directement dans la balise créée pour qu'il n'y aie pas de confusion

cette fois ci ca match a tout les coups meme dans les pires structures

@Jreaux je pense que je vais me servir de ce principe pour le faire en span avec css pure j'ai tout pour éviter les doublonnage ou les balises non fermées

en tout cas voila la fonction si ca peut servir

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
////////////////////////////////////////////////////////////////////////////////////
function shadowcolor(coul){
if (selectionne_text()){   
                                        var selection = selectionne_text(); 
                                        var selectedText = selection.extractContents();
                                        var balisefont = document.createElement("FONT");
                                        balisefont.className="shado";  balisefont.appendChild(selectedText);
                                       var strbal=balisefont.innerHTML;
                                       var colhtml=balisefont.getElementsByTagName("font");
                                               if (colhtml.length>0){
                                                           for(var i=0;i<colhtml.length;i++){
                                                           var strinnerT=colhtml[i].innerHTML;
                                                           var str = colhtml[i].outerHTML;
                                                           var deb = "class=" + str.split("class=")[1];
                                                           var fin = deb.split(">")[0];                                                                                                                                                                          
                                                           var str2=  str.replace(fin,"");                                                                                                                                                                     
                                                           var bal=str2.substring(0, 7);
 
                                                           if (bal =="<font >"){var strbal=strbal.replace(str,strinnerT);}
                                                           if (bal !="<font >"){ var strbal=strbal.replace(fin,"");}
                                                           }
                                               }
                                      balisefont.innerHTML=strbal;
                                     balisefont.style.textShadow = "0px 0px 10px "+coul; 
                                     selection.insertNode(balisefont);
 
                                    }//fin du if selectionnetext
}//fin de fonction shado
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////