Twitter: twitter/twemoji : Emoji pour tout le monde. https://twemoji.twitter.com/

Une bibliothèque simple qui fournit une prise en charge standard des emoji Unicode sur toutes les plateformes.

Twemoji v13.1 adhère à la spécification Unicode 13.0 et prend en charge la spécification Emoji 13.1. Nous ne prenons pas en charge les emoji personnalisés.

La bibliothèque Twemoji offre un support pour 3 521 Emojis définis en Unicode.

Usage

Prise en charge CDN

Les gens de MaxCDN ont gracieusement fourni le support CDN.

Utilisez ce qui suit dans le balise de votre (vos) document(s) HTML :


« >
script src="https://twemoji.maxcdn.com/v/latest/twemoji.min.js" crossorigin="anonymous">script>

Cela garantit que vous utiliserez toujours la dernière version de la bibliothèque.

Si, à la place, vous souhaitez inclure explicitement la dernière version, vous pouvez ajouter la balise suivante :


« >
script src="https://twemoji.maxcdn.com/v/13.1.0/twemoji.min.js" integrity="sha384-gPMUf7aEYa6qc3MgqTrigJqf4gzeO6v11iPCKv+AP2S4iWRWCoWyiR+Z7rWHM/hU" crossorigin="anonymous">script>

Télécharger

Si vous souhaitez plutôt télécharger une version spécifique, veuillez consulter le gh-pages branche, où vous trouverez les actifs construits pour nos versions les plus récentes et les plus anciennes.

API

Voici toutes les méthodes exposées dans le twemoji espace de noms.

twemoji.parse( … ) V1

Il s’agit de l’utilitaire d’analyse principal et comporte 3 surcharges par type d’analyse.

Bien qu’il existe deux types d’analyses pris en charge par cet utilitaire, nous vous recommandons d’utiliser l’analyse DOM, expliquée ci-dessous. Chaque type d’analyse accepte un rappel pour générer une source d’image ou un objet d’options avec des informations d’analyse.

Le deuxième type d’analyse est l’analyse de chaîne, expliquée dans la documentation héritée ici. Ceci n’est pas recommandé car cette méthode ne nettoie pas la chaîne ou n’empêche pas l’exécution de code malveillant ; une telle désinfection est hors de portée.

analyse DOM

Si le premier argument de twemoji.parse est un HTMLElement, les balises d’image générées remplaceront les emoji qui sont à l’intérieur #text nœuds uniquement sans compromettre les nœuds ou les écouteurs environnants, et en évitant complètement l’utilisation de innerHTML.

Si la sécurité est une préoccupation majeure, cette analyse peut être considérée comme l’option la plus sûre mais avec une légère pénalité de performance due aux opérations DOM qui sont inévitablement cher.

var div = document.createElement('div');
div.textContent = 'I u2764uFE0F emoji!';
document.body.appendChild(div);

twemoji.parse(document.body);

var img = div.querySelector('img');

// note the div is preserved
img.parentNode === div; // true

img.src;        // https://twemoji.maxcdn.com/v/latest/72x72/2764.png
img.alt;        // u2764uFE0F
img.className;  // emoji
img.draggable;  // false

Toutes les autres surcharges décrites pour string sont disponibles exactement de la même manière pour l’analyse DOM.

Objet en paramètre

Voici la liste des propriétés acceptées par l’objet facultatif qui peuvent être passées au parse fonction.

  {
    callback: Function,   // default the common replacer
    attributes: Function, // default returns {}
    base: string,         // default MaxCDN
    ext: string,          // default ".png"
    className: string,    // default "emoji"
    size: string|number,  // default "72x72"
    folder: string        // in case it's specified
                          // it replaces .size info, if any
  }

rappeler

La fonction à invoquer pour générer une image src(s).

Par défaut c’est une fonction comme la suivante :

function imageSourceGenerator(icon, options) {
  return ''.concat(
    options.base, // by default  Inc. CDN
    options.size, // by default "72x72" string
    '/',
    icon,         // the found emoji as code point
    options.ext   // by default ".png"
  );
}

base

L’url par défaut est la même que twemoji.base, donc si vous modifiez le premier, il sera reflété par défaut pour toutes les chaînes ou nœuds analysés.

poste

L’extension d’image par défaut est la même que twemoji.ext lequel est ".png".

Si vous modifiez le premier, il sera reflété par défaut pour toutes les chaînes ou nœuds analysés.

nom du cours

Le défaut class pour chaque image générée est emoji. Il est possible d’en spécifier un autre via cette propriété.

Taille

La taille de l’actif par défaut est la même que twemoji.size lequel est "72x72".

Si vous modifiez le premier, il sera reflété par défaut pour toutes les chaînes ou nœuds analysés.

dossier

Au cas où vous ne voudriez pas spécifier une taille pour l’image. Il est possible de choisir un dossier, comme dans le cas des emoji SVG.

twemoji.parse(genericNode, {
  folder: 'svg',
  ext: '.svg'
});

Cela générera des URL telles que https://twemoji.maxcdn.com/svg/2764.svg au lieu d’utiliser une image basée sur une taille spécifique.

Utilitaires

Utilitaires / aides de base pour convertir les points de code en substituts JavaScript et vice versa.

twemoji.convert.fromCodePoint()

Pour un point de code HEX donné, renvoie les paires de substitution UTF-16.

twemoji.convert.fromCodePoint('1f1e8');
 // "ud83cudde8"

twemoji.convert.toCodePoint()

Pour des paires de substitution UTF-16 données, renvoie le point de code HEX équivalent.

 twemoji.convert.toCodePoint('ud83cudde8ud83cuddf3');
 // "1f1e8-1f1f3"

 twemoji.convert.toCodePoint('ud83cudde8ud83cuddf3', '~');
 // "1f1e8~1f1f3"

Des astuces

Styles en ligne

Si vous souhaitez dimensionner les emoji en fonction du texte environnant, vous pouvez ajouter le CSS suivant à votre feuille de style :

img.emoji {
   height: 1em;
   width: 1em;
   margin: 0 .05em 0 .1em;
   vertical-align: -0.1em;
}

Cela garantira que les emoji tirent leur largeur et leur hauteur du font-size du texte avec lequel ils sont affichés. Il ajoute également un peu d’espace avant et après chaque emoji et les tire un peu vers le haut pour un meilleur alignement optique.

Jeu de caractères UTF-8

Pour prendre en charge correctement les emoji, le jeu de caractères du document doit être défini sur UTF-8. Cela peut être fait en incluant la balise meta suivante dans le document

Exclure les caractères (V1)

Pour empêcher certains caractères d’être remplacés par twemoji.js, appelez twemoji.parse() avec un rappel, renvoyant false pour l’icône Unicode spécifique. Par exemple:

twemoji.parse(document.body, {
    callback: function(icon, options, variant) {
        switch ( icon ) {
            case 'a9':      // © copyright
            case 'ae':      // ® registered trademark
            case '2122':    // ™ trademark
                return false;
        }
        return ''.concat(options.base, options.size, '/', icon, options.ext);
    }
});

API héritée (V1)

Si vous utilisez toujours notre API V1, vous pouvez lire notre documentation héritée ici.

Contribuant

La documentation contributive est disponible ici.

Conditions d’attribution

En tant que projet open source, l’attribution est à notre avis critique d’un point de vue juridique, pratique et motivationnel. Les graphiques sont sous licence CC-BY 4.0, qui contient un très bon guide sur les meilleures pratiques en matière d’attribution.

Cependant, nous considérons le guide un peu onéreux et en tant que projet, accepterons une mention dans un projet README ou dans une section ou un pied de page « À propos » sur un site Web. Dans les applications mobiles, un endroit commun serait dans la section Paramètres/À propos (par exemple, voir la section Paramètres->À propos->Légal de l’application mobile). Nous considérerions qu’une mention dans la source HTML/JS est également suffisante.

Des projets de communauté

Commiteurs et contributeurs

Le but de ce projet est de simplement fournir des emoji pour tout le monde. Nous accueillons certainement les améliorations et les correctifs, mais nous ne pouvons pas fusionner toutes les demandes d’extraction suggérées par la communauté en raison de la nature simple du projet.

Les règles de cotisation sont disponibles dans le CONTRIBUTING.md déposer.

Merci à tous nos contributeurs.

Licence

Copyright 2019 , Inc et autres contributeurs

Code sous licence MIT : http://opensource.org/licenses/MIT

Graphiques sous licence CC-BY 4.0 : https://creativecommons.org/licenses/by/4.0/

#twemoji #Emoji #pour #tout #monde #httpstwemojicom