WebChat emoji 対応

[teamikl]

Emoji を、Web チャット内で使えるようにします。

emoji: http://www.emoji-cheat-sheet.com/

• [ ] コロンで囲まれた文字を img タグに変換 (JS/jQuery)
  • [ ] 存在しないキーの対応の為に、絵文字のリストを作る
  • [ ] 入力補完 see jQuery.textcomplete

imageの参照先

• [ ] CDN の利用
  • http://www.tortue.me/
  • サービス間でのブラウザのキャッシュが期待出来る :+1:
  • サイトが閉鎖するとリンク切れになる :-1:
• ローカルにインストールする場合
  • 導入
  • [ ] emoji をダウンロードして配置
  • [ ] image置き場のpath設定

[teamikl]

function EmogifyCDN(cdn) {
  var tmpl = '<img src="' + cdn + '$1.png">';
  return function(text){
    return text.replace(/:([a-zA-Z0-9_\+]+):/g, tmpl);
  };
}
var emojify = EmogifyCDN("/emoji/");

console.log(emojify('test :+1: :o:')) // test <img src="/emoji/+1.png"> <img src="/emoji/o.png">

• [ ] test escape
• [ ] match pattern (tags should not match, so explicit pattern match)
• [ ] size for img (or add class for CSS)