Skip to content

This jquery plugin adds emoji support to textareas, supports colon aliases (e.g. ๐Ÿ˜„) and features an emoji picker to insert emojis directly into the textarea.

License

Notifications You must be signed in to change notification settings

wstoettinger/jquery.emojiarea.js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

48 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

jquery.emojiarea.js

This jquery plugin adds emoji support to textareas, supports colon aliases (e.g. ๐Ÿ˜„) and features an emoji picker to insert emojis directly into the textarea. Currently three different usage modes are supported: unicode, css and image.

This library is inspired by OneSignal/emoji-picker and diy/jquery-emojiarea. It has been rewritten from scratch with easy usability from the developer perspective in mind.

Out comes a much cleaner, smaller and more flexible emoji library than all others I know of.

Installation

npm i --save jquery.emojiarea.js

Versatile usage

Currently three different usage modes are supported:

  • unicode: plain unicode emojis are inserted, no markup.
  • css: small tags with little footprint are inserted in the markup. the image is set in the css
  • image: the whole image tag (including style) is inserted into the markup

Currently about 850 distinct emoticons (excluding variations) are supported, these are currently sorted in 5 groups where each group has its own sprite png file.

The sprites and groups can be easily customized.

Features in development

  • automatically replace ascii emoticons (currently only colon aliases supported e.g. :smlie: => ๐Ÿ˜€)
  • generate sprites in build process, or maybe integrate with iamcal/emoji-data
  • update emojis according to unicode technical standard #51 with current version 5 of unicode.org Emoji List (list and full chart)
  • create class hierarchy for unicode / css / image modes to reduce the code footprint for simpler versions
  • autocomplete (with dropdown) for colon aliases (also modular)

Known Bugs/Todos

  • fix caret position after paste and/or insert
  • workaround for css and image mode in edge

About

This jquery plugin adds emoji support to textareas, supports colon aliases (e.g. ๐Ÿ˜„) and features an emoji picker to insert emojis directly into the textarea.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published