From 7ebe2e558d348bc83d921e5a2fd4c1390f05438d Mon Sep 17 00:00:00 2001
From: CRIMX <straybugs@gmail.com>
Date: Fri, 23 Dec 2016 01:02:51 +0800
Subject: [PATCH] added unicode support

---
 README.md | 25 +++++++++++++++++++++++--
 index.js  | 18 +++++++++++++++---
 2 files changed, 38 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index 653d265..01d6cb0 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,5 @@
 # hexo-filter-github-emojis
 
-[![Build Status](https://travis-ci.org/crimx/hexo-filter-github-emojis.svg?branch=master)](https://travis-ci.org/crimx/hexo-filter-github-emojis)
-[![Coverage Status](https://img.shields.io/coveralls/crimx/hexo-filter-github-emojis.svg)](https://coveralls.io/r/crimx/hexo-filter-github-emojis?branch=master)
 [![Npm Version](https://img.shields.io/npm/v/hexo-filter-github-emojis.svg)](https://npmjs.org/package/hexo-filter-github-emojis) 
 [![Npm Downloads Month](https://img.shields.io/npm/dm/hexo-filter-github-emojis.svg)](https://npmjs.org/package/hexo-filter-github-emojis)
 [![Npm Downloads Total](https://img.shields.io/npm/dt/hexo-filter-github-emojis.svg)](https://npmjs.org/package/hexo-filter-github-emojis)
@@ -26,6 +24,7 @@ githubEmojis:
   enable: true
   className: github-emoji
   localEmojis:
+  unicode: false
 ```
 
 The filter will try to download the latest version of [Github Emojis][ghemojis] list. If the network is unavailable or too slow it will use the backup version.
@@ -47,4 +46,26 @@ The filter will try to download the latest version of [Github Emojis][ghemojis]
       arrow_right: https://path/tp/arrow_right.png
   ```
 
+- **unicode** - If you set this option to true, the filter will generate something like this:
+
+  ```html
+  <span class="github-emoji" title=":sparkles:" data-src="https://assets-cdn.github.com/images/icons/emoji/unicode/2728.png">&#x2728;</span>
+  ```
+  Then you can fallback to image with JavaScript. For example, with jQuery:
+
+  ```javascript
+    $('span.github-emoji').each(function (i, emoji) {
+      var $emoji = $(emoji)
+      var codepoint = $emoji.html()
+      $('<img height="20" width="20">')
+        .prop('src', $emoji.data('src'))
+        .prop('alt', $emoji.attr('title'))
+        .on('error', function () {
+          // image loading failed
+          $emoji.html(codepoint)
+        })
+        .appendTo($emoji.empty())
+    })
+  ```
+
 [ghemojis]: https://api.github.com/emojis
diff --git a/index.js b/index.js
index d4a87d6..19c2a30 100644
--- a/index.js
+++ b/index.js
@@ -5,6 +5,7 @@ var _ = require('lodash')
 
 var options = _.assign({
   enable: true,
+  unicode: false,
   className: 'github-emoji'
 }, hexo.config.githubEmojis)
 
@@ -45,9 +46,20 @@ if (options.enable !== false) {
   hexo.extend.filter.register('before_post_render', function (data) {
     data.content = data.content.replace(/:(\w+):/ig, function (match, p1) {
       if (githubEmojis[p1]) {
-        return '<img class="' + options.className +
-        '" title="' + match + '" alt="' + match + '" src="' +
-        githubEmojis[p1] + '" height="20" width="20" />'
+        // unicode code point
+        var codepoint = /\/(\w+)\.\w+$/.exec(githubEmojis[p1].split('?')[0])
+        codepoint = codepoint && codepoint[1]
+
+        if (options.unicode && codepoint) {
+          return '<span class="' + options.className +
+            '" title="' + match +
+            '" data-src="' + githubEmojis[p1] +
+            '">&#x' + codepoint + ';</span>'
+        } else {
+          return '<img class="' + options.className +
+            '" title="' + match + '" alt="' + match + '" src="' +
+            githubEmojis[p1] + '" height="20" width="20" />'
+        }
       } else {
         return match
       }