Smileys auto-conversion

[B4rb3rouss]

Bonjour, Une petite idée à 3 francs 6 sous : convertir automatiquement certaines chaines de caractères en leur équivalents émoticônes. (Pas des images, peut-être seulement une police).

Exemple :

:) -> ☺
:D -> 😃
:( -> ☹
;) -> 😉
:P -> 😋
:/ -> 😕
:'( -> 😢
oO -> 😮
x.x -> 😵

[remrem]

Peut-être faire un addon pour ça ?

[B4rb3rouss]

@remrem : oui, j'ai essayé, cependant les addons ne permettent actuellement uniquement de modifier des morceaux de texte présents dans les templates, et pas dans le rendu final d'une page générée. Ou bien j'ai manqué un truc?

[remrem]

Nop, pas vraiment, sans système de hook ce n'est pas facile ( voui, je vais être lourd avec ça #70 ), tu peux toujours jeter un coup d'oeil sur https://github.com/remrem/bogotext-chapo-img/blob/master/chapo_img/chapo_img.php où je passe par $GLOBAL, en attendant de mieux...

[timovn]

Je peux ajouter un menu comme pour la couleur et la taille de police, avec des emojis. Les add-ons ne permettent pas (encore?) de faire ça.

[B4rb3rouss]

@timovn : ça pourrait être très agréable dans un premier temps. Dans les commentaires aussi peut-êtrE?

[B4rb3rouss]

J'ai une solution avec un petit bout de javascript. Ça ne devrait pas être trop dur de préciser des emoticônes personnalisées dans blogotext, mais ça dépend de la marche que tu veux suivre @BoboTiG . Voilà le bout de code :

    <div class="comm-content"> 
        Ceci est un test :) 
        autre test :)
    </div>

    <div class="comm-content"> 
        Ceci est un test :) 
        autre test :)
    </div>

    <div class="test"> 
        Ceci est un test :P 
        autre test :P 
         ;) 
         :D 
         :/ 
         :'( 
         oO 
         x.x 
         O:) 
         ^^ 
    </div>

<script>

var strtostr= [[/ :\) /g,' ☺ '], 
    [/ :D /g,' 😃 '],
    [/ :P /g,' 😋 '],
    [/ ;\) /g,' 😉 '],
    [/ :\/ /g,' 😕 '],
    [/ :\'\( /g,' 😢 '],
    [/ oO /g,' 😮 '],
    [/ x\.x /g,' 😵 '],
    [/ O:\) /g,' 😇 '],
    [/ \^\^ /g,' 😁 '],
];
var classes_to_replace = ["comm-content", "test"];

classes_to_replace.forEach(function(class_){
    var tochange = document.getElementsByClassName(class_);
    var j;
    for (j = 0; j < tochange.length; j++) {
        var i;
        for (i = 0; i < strtostr.length; i++) {
            var oldtxt = tochange[j].innerHTML;
            var newtxt = oldtxt.replace(strtostr[i][0],strtostr[i][1]);
            tochange[j].innerHTML = newtxt;
        }

    }
});
</script>

[B4rb3rouss]

Légère correction au niveau des espaces. Ça donne un fichier smiley.js :

var strtostr= [
    [/ :\)/g,' ☺'], 
    [/ :\(/g,' ☹'], 
    [/ :D/g,' 😃'],
    [/ :P/g,' 😋'],
    [/ ;\)/g,' 😉'],
    [/ :\//g,' 😕'],
    [/ :\'\(/g,' 😢'],
    [/ oO/g,' 😮'],
    [/ x\.x/g,' 😵'],
    [/ O:\)/g,' 😇'],
    [/ \^\^/g,' 😁'],
];

var classes_to_replace = ["com-content", "art-content", "entry-content", "post-content"];

classes_to_replace.forEach(function(class_){
    var tochange = document.getElementsByClassName(class_);
    var j;
    for (j = 0; j < tochange.length; j++) {
        var i;
        for (i = 0; i < strtostr.length; i++) {
            var oldtxt = tochange[j].innerHTML;
            var newtxt = oldtxt.replace(strtostr[i][0],strtostr[i][1]);
            tochange[j].innerHTML = newtxt;
        }

    }
});

Et dans le fichier list.html du thème blogotext, on rajoute cette ligne : <script src="/js/smiley.js"></script>

[B4rb3rouss]

Un bémol : ça convertit aussi dans les balises <code>.

[BoboTiG]

C'est pas mal, faudrait voir pour ne pas toucher aux balides code et pre. Dans tous les cas, tu sais où envoyer les modifs pour un addon ;)