insérer un émoticone dans un champs de saisi texte html

**mnssylvain** · 17/01/2022, 18h18

Bonjour à tous,

Ça fait un moment que je galère pour trouver une solution à mon problème et après avoir écumé le net et ce forum, je me tourne vers vous.
Je précise que je suis en version 17.

J'ai donc un champ de saisie texte html qui me sert à enregistrer le corps d'un email.
Je souhaite donc pouvoir insérer des émoticônes dans mon texte en cliquant sur une liste d’émoticônes (zone répétée) un peu comme n'importe quelle messagerie....

Si j'ai bien compris les émoticônes sont des caractères unicode que l'on peut insérer dans du texte . Par exemple cet émoticône 😏 a été mis par copier coller à partir de cette source

D'ailleurs si je copie colle dans ma zone de texte ça fonctionne, il est bien enregistré dans mon fichier HF. (en pas joli et noir et blanc.... mais une fois envoyé par mail il reprend des couleurs dans la messagerie donc ça me va...)

Par contre impossible de le copier coller dans le code de windev pour l'attribuer à une variable. A priori pour que cela soit faisable il faudrait passer le projet en unicode mais ça me génère beaucoup d'erreurs notamment sur les procédures de php4wd auxquelles je préfère ne pas toucher....

J'ai cherché du côté des fonctions de conversion

Code :

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

CaractUnicode()

Mais impossible de trouver à quel n° les émoticônes correspondent....

Je viens de trouver une solution de contournement mais je me dis que quand même il doit y avoir plus simple.
Pour le moment j'ai créé un fichier HF avec une rubrique texte dans la quelle je copie l'émoticône.
Si j'attribue la valeur de ma rubrique à une variable de type chaine unicode et que je la mets dans le presse papier. Alors je peux coller mon émoticône dans mon champ html.....

Voila j'attends vos remarques et pistes à explorer avec impatience !
Merci d'avance

**Voroltinquo** · 17/01/2022, 20h15

Bonjour,
Voici quelques liens qui vont pouvoir t'aider
la table des emoji
La table des smileys
La table des skins ainsi que les emojis sur lesquels il sont applicables
En haut de page, tu a un bref résumé de l'utilisation

**mnssylvain** · 17/01/2022, 21h13

Bonjour,
Merci pour tes pistes. C'est un peu ce que j'ai trouvé dans le lien "source" de mon message.
Je ne vois pas comment m'en servir dans windev pour l'insérer sous forme de texte dans mon champ de saisie... dslé....

**jurassic pork** · 18/01/2022, 07h58

hello,
tu peux t'inspirer de ce code qui affiche une série d'émojis dans un champ HTML :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
HtmlString est une chaîne = "<html>" +
"<body><divAlign=Center >Emojis Segoe UI</div>" +
"<p style=""font-size:24px;font-family: segoe ui emoji;"">"
index est un entier
POUR index = 0 A 79 
HtmlString += "<span>&#" + NumériqueVersChaîne(0x1F600 + index) + ";</span>"
FIN
HtmlString += "</p></body></html>"
 
 
HTM_SansNom1 = HtmlString

Nom : EmojisWindev.PNG
Affichages : 1206
Taille : 12,7 Ko

Pour avoir le code des émojis tu peux utiliser le logiciel gratuit BabelMap

Nom : BabelMap.PNG
Affichages : 1217
Taille : 64,4 Ko

Ami calmant, J.P

**mnssylvain** · 18/01/2022, 08h02

Bonjour

Merci pour cette réponse mais il y a je pense un détails qui vous a échappé et du coup je comprends mieux vos précédentes réponses.
En effet je ne souhaite pas mettre un émoticône dans un champ HTML pour l'afficher...... je souhaite pouvoir le saisir dans un champ de saisie au format html pour ensuite l'envoyer par mail. Et c'est là que les choses se compliquent.....

**jurassic pork** · 18/01/2022, 08h15

sous quelle forme la saisie ? pour le sourire deux point tiret parenthèse ? &#128512 ? autre chose ?

**mnssylvain** · 18/01/2022, 08h53

Comme un bon dessin vaut mieux qu'un long discours voici une capture d'écran
Voilà où j'en suis: L'utilisateur doit pouvoir cliquer sur les émoticônes en bas à droites qui sont dans une zone répétées. Le code correspondant est copié dans le presse papier et du coup il peut le coller dans son texte.
J'ai pas réussi à faire mieux ne disposant pas des commandes htmlinsere en version 17.... et qu'il est à priori impossible de connaitre la position exacte du curseur dans un champs de saisie html (comme rtf d'ailleurs.... à moins que vous ayez une solution aussi pour ça

)

Nom : message.jpg
Affichages : 1150
Taille : 126,5 Ko

**jurassic pork** · 18/01/2022, 11h22

voici un code qui insère une emoticone à la fin d'un champ de saisie HTML.

Code :

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

1
2
Emoticone est une chaîne =  "<span style=""font-size:24px;font-family: segoe ui emoji;"">&#" + NumériqueVersChaîne(0x1F600) + ";</span>"
Texte_HTML += Emoticone

mais le souci c'est que sur les versions anciennes (certainement en dessous de Windev 26) il n' y a pas l'option Unicode dans la description du champ voir la fin de la discussion ici . Le code n'est pas conservé sans cette option :

Il vous suffit d'ouvrir la description du champ de saisie et de cocher la case UNICODE.
Si celle-ci n'est pas cochée, vous allez récupérer des "??" à la place de la valeur unicode.

**mnssylvain** · 18/01/2022, 11h45

Effectivement il n'y a pas l'option "unicode" dans la description d'un champ de saisi au format HTML dans la version 17.
Elle y est par contre pour le champ de saisi en RTF..... mais du coup je ne peux pas insérer d'image.....
Bref il faudra peut être qu'un jour je me décide à prendre la dernière version de Windev.....

Après avoir écris ces premières lignes j'ai quand même testé le code.... et miracle ça fonctionne ! et en plus l’émoticône est bien joli en couleur dans mon champ de saisi! incroyable....
Un ENORME merci !
Je teste un peu pour faire un retour et je passe en résolu... j'adore ce forum

**mnssylvain** · 22/01/2022, 18h35

Voici comme promis un petit retour.... qui servira certainement à quelqu'un vu le mal que j'ai eu à trouver des infos sur ce problème !
J'ai bien réussi à faire mon insertion d'émoji dans ma zone de saisie au format texte HTML mais il me reste un petit problème à régler pour l'envoi du mail.... je l'expose à la fin de ce post.

Lors d'un clic sur un emoji il s'insère à la fin du texte. On ne peut pas faire en sorte avec ma version 17 de l'insérer à l'emplacement du curseur.... mais bon c'est déjà très bien.
On peut donc l'insérer à la fin puis le déplacer dans le texte ensuite.

Pour afficher les émojis j'ai stocké dans un dossier "emoticon" toutes les images correspondantes aux différents émoji en les triant dans des sous dossiers..... (Je les ai toutes prises une par une n'ayant pas trouvé de package prêt à télécharger).
Tous les émoticons sont renommés par leur code hexa... par exemple

=> 0x1f601.png

Je les affiche dans un zone répétée dont le code d'initialisation est:

Code :

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

1
2
3
4
5
6
7
8
UnFichier, ResListeFichier sont des chaînes
// Le parcours se fait également dans les sous-répertoires et est interruptible.
ResListeFichier = fListeFichier(fRepDonnées()+"\emoticon\*.png",frRécursif + frInterruptible)
// Pour chaque fichier trouvé
POUR TOUTE CHAÎNE UnFichier DE ResListeFichier SÉPARÉE PAR RC
	// Ajout du fichier dans la zone répétée
	ZoneRépétéeAjoute(ZR_emoticone,UnFichier)
FIN

La zone répétée affiche donc tous les émojis. j'ai donc mis au dessus des petites images qui en cliquant dessus me permettent de trier les émoji par catégories (sous dossier du dossier "emoticon") dont le code sur clic est quasi le même que le précédent, je parcours juste un dossier de plus....

Code :

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

1
2
3
4
5
6
7
8
9
10
11
ZoneRépétéeSupprimeTout(ZR_emoticone)
UnFichier, ResListeFichier sont des chaînes
 
// Le parcours se fait également dans les sous-répertoires et est interruptible.
ResListeFichier = fListeFichier(fRepDonnées()+"\emoticon\smiley\*.png",frRécursif + frInterruptible)
 
// Pour chaque fichier trouvé
POUR TOUTE CHAÎNE UnFichier DE ResListeFichier SÉPARÉE PAR RC
	// Ajout du fichier dans la zone répétée
	ZoneRépétéeAjoute(ZR_emoticone,UnFichier)
FIN

Et enfin pour insérer l'émoji dans la zone de texte sur le code "Sélection d'une ligne" de la zone répétée:

Code :

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

1
2
3
4
5
6
 
sEmoti est une chaîne UNICODE
sNomemoti est une chaîne UNICODE= Gauche(fNomLong(ZR_emoticone.ATT_Imoticone..Valeur),Taille(fNomLong(ZR_emoticone.ATT_Imoticone..Valeur))-4)
sEmoti =  "<span style=""font-size:24px;font-family: segoe ui emoji;"">&#" + NumériqueVersChaîne(HexaVersEntier(sNomemoti)) + ";</span>"
ZoneRépétéeSelectMoins(ZR_emoticone)
SAI_Messages +=sEmoti

voila le résultat en image c'est peut être plus parlant.
Nom : message1.jpg
Affichages : 1116
Taille : 69,5 Ko

Il me reste cependant un problème à régler......
L'envoi du mail fonctionne correctement (affichage de l'emoji dans le mail reçu) si je fais un envoi direct avec ouvresessionsmtp......
Par contre si je fais un ouvresessionmail pour que le message s'ouvre dans thunderbird afin de le modifier et surtout pour qu'il soit conservé dans les mails envoyés pour en garder une trace.... là j'ai un problème d'encodage. Le message reçu m'affiche "??" ou "ðŸ˜€"

Voici le code de l'envoi de mail avec EmailOuvreSession

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
sretour est un entier=EmailOuvreSession("")
//// Initialisation de la structure e-mail
EmailRAZ()
Email.AccuséRéception=Faux
Email.NbDestinataire =1
Email.Destinataire[1] = client.Email
Email.Expéditeur = Parametres.EmailUtilisateur
Email.Sujet = Messages.Sujet 
 
// gestion des pièces jointes
i est un entier =1
Email.NbAttache=ListeOccurrence(LISTE_PiecesJointes)
 
POUR TOUTE CHAÎNE spj DE Messages.PiecesJointes SEPARÉE PAR RC
	Email.Attache[i]=spj
	i++
FIN
 
sMessage est une chaîne UNICODE =  ChaîneConstruit(Messages.messages,client.Prenom,client.login,client.mdp)
sMessage = ChaîneVersUTF8(sMessage)
sMessage="<html><head><meta http-equiv=""Content-Type"" content=""multipart/mixed; charset=utf-8"";/>"+sMessage
SI EnModeTest() ALORS
	EmailImporteHTML(sMessage,"c:\Monappli"+"emoticon\")
SINON
	EmailImporteHTML(sMessage,fRepDonnées+"\emoticon\")
FIN
 
//email.HTML=smessage
Email.Message=sMessage
 
 
test est un booléen = EmailEnvoieMessage(sretour,Vrai)
SI test=Faux ALORS
	Info(ErreurInfo(errComplet))
FIN
EmailFermeSession(sretour)

Si vous avez une idée.....

**mnssylvain** · 02/02/2022, 14h51

Bonjour à tous,

Je n'ai pas trouvé de solution à mon problème d'envoi de mail, mais comme le sujet principal est réglé je le passe en résolu...
Merci à tout ceux qui m'ont aidé.

insérer un émoticone dans un champs de saisi texte html [WD17]

WinDev

Discussions similaires

Partager

Partager