Emoji and web application

Download SQL query

I am back after few months or so of not blogging. Have you heard something called “Emoji”?

Image may be NSFW.
Clik here to view.

Emoji; is the Japanese term for the ideograms or smileys used mostly in Japanese electronic messages and webpages. These small images are starting to appear more and more outside Japan. Originally meaning pictograph, the word emoji literally means “picture” (e) + “letter” (moji).
Refer: http://en.wikipedia.org/wiki/Emoji

If you want to know what the emoji meanings check the following cheat sheet
http://www.emoji-cheat-sheet.com/

Although originally only available in Japan, some emoji character sets have been incorporated into Unicode (Unicode 6.0 in 2010), allowing them to be used elsewhere as well. The core emoji are as of Unicode 6.0 consists of 722 characters.

http://www.unicode.org/charts/PDF/U1F300.pdf
http://www.unicode.org/charts/PDF/U1F600.pdf
http://www.unicode.org/charts/PDF/U1F680.pdf
http://www.unicode.org/charts/PDF/U2600.pdf

More recent iOS, Android, Windows 8 and OS X (Mountain Lion +) display Emoji natively, regardless of the typeface. However, how we display that on the all other desktop and the web application? When you are viewing Emoji with unsupported device or browser, Emoji shows up as squares or foreign text. You can convert them to a viewable format just by pasting it in the box above then viewing it in the preview.

I have found that several open source JavaScript libraries and the projects support for this. The most comprehensive seems to be Github’s Gemoji project.

Following are some of other good projects and scripts

https://github.com/fengmk2/emoji
https://github.com/iamcal/js-emoji

For more info about Emoji Unicode table, please check below URL
http://apps.timwhitlock.info/emoji/tables/unicode

Emoji and Database

Emojis are UTF-8 encoded symbols. Therefore, to save the Emoji in the database, your database column should support for the UTF-8 encoding.

Emoji and MySQL

To store the Emoji in the MySQL, you have to modify the table character set to support UTF-8.  Please keep in mind starting from iOS5, Emoji represents as 4-byte characters.  That means your MySQL table charset should set as utf8mb4. (Earlier version of iOS Emoji worked well with utf8 charset). utf8mb4 support is dependent on the MySQL version that you use. MySQL 5.5+ works fine with 4-byte characters when properly configured.

create table MyEmoji (emojicolumn VARCHAR(255) CHARACTER SET utf8mb4) default character set utf8mb4;

Make Sure Followings,

1. Your database table character set is: utf8mb4
2. Your PHP application character set is: UTF-8

   <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
   

   <?php
    header('Content-type: text/html; charset=utf-8');
   ?>
   

3. In the application database, connection character set is: utf8mb4

For more information: http://mathiasbynens.be/notes/mysql-utf8mb4#utf8-to-utf8mb4

Emoji and MS SQL

SQL Server does not support UTF-8 by default. However, it supports UCS2 to store Unicode characters. (UCS2 is typically UTF-16).  SQL server handles the UTF-8 conversion automatically. However, keep in mind, MS SQL VARCHAR column type does not support for this. Instead of that you have to use NVARCHAR column type. Then you must precede all Unicode strings with a prefix N when you deal with Unicode string constants in SQL Server

For more information: http://support.microsoft.com/kb/239530

CREATE TABLE [dbo].[MyEmoji](
    [EmojiColumn] [nvarchar](255) NULL
)
INSERT INTO MyEmoji (EmojiColumn) VALUES (N'EncodedString')

Make sure followings,

1. Your database table column is: nvarchar
2. You are sending in Unicode data by adding an N in front of the encoded string

How to enable Emoji keyboard in iOS and Android

iPhone – http://support.apple.com/kb/ht4976
Android – http://anewdomain.net/2013/09/25/enable-emoji-keyboard-in-android-4-1-higher/

EmoJi for PHP

http://code.iamcal.com/php/emoji/

Image may be NSFW.
Clik here to view.

Image may be NSFW.
Clik here to view.