Merge remote-tracking branch 'origin/develop'

README.md

@@ -8,54 +8,47 @@
 `+Emoji` _灵感来源于 `文字 + Emoji` 之意_
 
 ### 下载：
-https://github.com/Kenshin/emoji/releases
+http://ksria.com/emoji
 
-### 截图:
+### 截图：
 
 **独立窗口**  
-![image](https://user-images.githubusercontent.com/31840739/30678148-df47e6c4-9e55-11e7-80cc-984c6bf8ee5b.png)
-
-**语义化**  
-<img src="https://i.imgur.com/c4IhA0Y.gif" />
+<img src="http://ksria.com/emoji/assets/images/window.png" width="500" />
 
 **Popup 窗口**  
-![image](https://user-images.githubusercontent.com/31840739/30730829-7038822c-9f2f-11e7-966a-10655f8a1e7f.png)
+<img src="http://ksria.com/emoji/assets/images/popup.png" width="500" />
+
+**中文语义化**  
+<img src="http://ksria.com/emoji/assets/images/chinese.gif" />
 
 **插入全部**  
 <img src="https://i.imgur.com/QLgzf4B.gif" />
 
-**通过关键字插入**  
-<img src="https://i.imgur.com/vBtKQke.gif" />
+**选项**  
+<img src="http://ksria.com/emoji/assets/images/option.png" width="500" />
 
 ### 功能：
 
-- 使用了最基本的 emoji 集合，支持任何 App；  
+- 使用了最基本的 Emoji 集合，支持任何 App；  
 _均不会出现乱码情况_
 
-- 支持关键字（中/英文）查询匹配 emoji；  
-  > 呼出关键字 <:: | ：：> <关键字 | 空格> <空格>  
-  > 例如：
-  > - `::gr　`   // 查询关键字 gr 为内容的 emoji
-  > - `::　　`    // 查询全部 emoji
-  > - `：：笑　` // 查询中文语义
-  > - `：：　　`  // 查询全部 emoji
+- 支持关键字（中/英文）查询匹配 Emoji；  
+  > 呼出关键字 [:: | ：：] [关键字 | 空格] [空格]
+
+  例如：
+  * `::gr　`   // 查询关键字 gr 为内容的 Emoji
+  * `::　　`    // 查询全部 Emoji
+  * `：：笑　` // 查询中文语义
+  * `：：　　`  // 查询全部 Emoji
 
 - 复制到剪切板并支持多个复制；
 
 - 支持快捷键呼出；  
-  _默认快捷键 <kbd>command / ctrl + Shift + Y</kbd>_
+  > 默认快捷键 <kbd>command / ctrl + Shift + Y</kbd>
 
 - 可作为独立窗口存在；
 
-- 快捷键插入后，光标仍处于输入框中；
-
-- 全部的 emoji 使用了 Google Android 7.0
-
-### 下一步：
-
-- [ ] 重构代码；
-
-- [ ] 定制化；
+- 个性化定制，包括：可定义触发条件、插入规则，黑名单（支持 [minimatch](https://github.com/isaacs/minimatch) 模糊匹配）等；
 
 ### 附一段使用视频：
 
@@ -65,31 +58,36 @@ _均不会出现乱码情况_
 
 ### 已知问题：
 
-- iFrame 无法使用  `dropdown` 模式;
-
-- 非标准 `<input> / <textarea>` 类标签无法使用快捷键 `::  ` 呼出；
+- iFrame 无法使用 `插入模式`；
 
-- 当为 `window` 独立使用状态时，插入功能失效；
+- 非标准 `<input> / <textarea>` 类标签无法使用快捷键 `::  ` 呼出 `插入模式`；
 
 ### 感谢：
 
-> 希望有开源代码可以利用一下，结果找到了如下三个：
-
 - https://github.com/Janson-Leung/Emoji-Extension-for-Chrome  
 
 - https://github.com/locomojis/Chromoji
 
 - https://github.com/dofy/apple-emoji-dict
 
-> **`+Emoji` 是在 [Emoji-Extension-for-Chrome](https://github.com/Janson-Leung/Emoji-Extension-for-Chrome) 的基础上开发的；中文语义字典由 [apple-emoji-dict](https://github.com/dofy/apple-emoji-dict) 提供来源。** _（ +Emoji 正式版发布后，我会在显著位置注明上述开源地址及作者）_
+> **`+Emoji` 使用了 [Emoji-Extension-for-Chrome](https://github.com/Janson-Leung/Emoji-Extension-for-Chrome) 部分代码；中文语义字典由 [apple-emoji-dict](https://github.com/dofy/apple-emoji-dict) 提供来源。**
 
 ### 简悦的诞生离不开它们：
 - Emoji 来源于 [Google Android 7.0](https://github.com/googlei18n/noto-emoji)
 - LOGO 来源于 [ShareIcon](https://www.shareicon.net/wink-interface-faces-emoji-ideogram-tongue-feelings-emoticons-smileys-798496)
 - [Node.js](https://nodejs.org/) · [NPM](https://www.npmjs.com)
 - [Webpack](https://webpack.github.io/)
+- [ES6](http://es6-features.org/) · [Babel](https://babeljs.io)
+- [PostCSS](http://postcss.org/) · [cssnext](http://cssnext.io/)
+- [jQuery](https://jquery.com/) · [Velocity.js](http://velocityjs.org/) · [minimatch](https://github.com/isaacs/minimatch)
+- [Visual Studio Code](https://code.visualstudio.com/)
+- [Sketch](https://www.sketchapp.com/) · [Pixelmator](http://www.pixelma
 - 咖啡 · 网易音乐 · Google Chrome · rMBP
 
+#### 请杯咖啡：
+如果你找不到适合的 Emoji 扩展，并觉得 +Emoji 还不错的话，请我喝杯咖啡也是件惬意的事情 😁 😘 👍
+![支付](http://ksria.qiniudn.com/zhifu_m.png)
+
 ### 许可：
 [![license-badge]][license-link]
 

npmw.cmd

@@ -0,0 +1,50 @@
+::===========================================================
+:: +Emoji   : +Emoji development/publish environment
+:: HOST     : https://github.com/kenshin/emoji
+:: Author   : Kenshin<[email protected]>
+:: Version  : 0.0.1
+::===========================================================
+
+@echo off
+
+::===========================================================
+:: Initialize
+::===========================================================
+if "%1" == "run" (
+    if "%2" == "develop" (
+         goto develop
+    ) else if "%2" == "publish"  (
+        goto publish
+    ) else (
+        @echo npmw noly support command: `npmw run develop` and `npmw run publish`.
+        goto quit
+    )
+) else (
+    @echo npmw noly support command: `npmw run develop` and `npmw run publish`.
+    goto quit
+)
+
+::===========================================================
+:: develop : Development environment
+::===========================================================
+:develop
+@echo webpack --devtool=source-map --progress --colors --watch
+set NODE_ENV=development
+webpack --devtool=source-map --progress --colors --watch
+goto quit
+
+::===========================================================
+:: publish : Production environment
+::===========================================================
+:publish
+@echo webpack -p --progress --colors
+set NODE_ENV=production
+webpack --progress --colors
+goto quit
+
+::===========================================================
+:: quit : Quit batch script.
+::===========================================================
+:quit
+@echo npmw batch quit.
+exit /b 0

package.json

@@ -1,21 +1,48 @@
 {
-    "name": "emoji_project_workflow",
-    "version": "1.0.0",
-    "description": "+Emoji develop/deploy",
-    "author": "Kenshin Wang <[email protected]>",
-    "license": "MIT",
-    "homepage": "http://ksria.com/emoji",
-    "repository": {
-        "type": "git",
-        "url": "git://github.com/kenshin/emoji.git"
-    },
-    "bugs": {
-        "url": "https://github.com/kenshin/emoji/issues",
-        "email": "[email protected]"
-    },
-    "engines": {
+  "name": "emoji_project_workflow",
+  "version": "1.0.0",
+  "description": "+Emoji develop/deploy",
+  "author": "Kenshin Wang <[email protected]>",
+  "license": "MIT",
+  "homepage": "http://ksria.com/emoji",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/kenshin/emoji.git"
+  },
+  "bugs": {
+    "url": "https://github.com/kenshin/emoji/issues",
+    "email": "[email protected]"
+  },
+  "engines": {
     "node": ">= 0.10.0"
-    },
-    "devDependencies": {},
-    "dependencies": {}
+  },
+  "scripts": {
+    "develop": "NODE_ENV=development webpack --devtool=source-map --progress --colors --watch",
+    "publish": "NODE_ENV=production  webpack --progress --colors"
+  },
+  "devDependencies": {
+    "autoprefixer": "^6.7.7",
+    "babel-core": "^6.21.0",
+    "babel-loader": "^6.2.10",
+    "babel-polyfill": "^6.20.0",
+    "babel-preset-es2015": "^6.18.0",
+    "babel-preset-react": "^6.16.0",
+    "babel-preset-stage-0": "^6.16.0",
+    "css-loader": "^0.26.1",
+    "expose-loader": "^0.7.1",
+    "file-loader": "^0.9.0",
+    "import-postcss": "^8.0.2",
+    "minimatch": "^3.0.4",
+    "postcss-cssnext": "^2.10.0",
+    "postcss-loader": "^1.3.3",
+    "react": "0.14.8",
+    "react-dom": "0.14.8",
+    "style-loader": "^0.13.1",
+    "url-loader": "^0.5.7",
+    "webpack": "1.14.0"
+  },
+  "dependencies": {
+    "clean-webpack-plugin": "^0.1.14",
+    "copy-webpack-plugin": "^4.0.1"
+  }
 }

src/background.js

@@ -4,65 +4,97 @@ console.log( "=== +emoji background load ===" )
  * Init
  ***********************/
 
-setDefaultSettings();
-chrome.extension.onMessage.addListener(listener);
-
-function setDefaultSettings() {
-    if (typeof localStorage.scale == 'undefined')
-        localStorage.scale = 1.0;
-    if (typeof localStorage.hidePUA == 'undefined')
-        localStorage.hidePUA = 'true';
-    if (typeof localStorage.usefont == 'undefined')
-        localStorage.usefont = 'false';
-    if (typeof localStorage.blacklist == 'undefined')
-        localStorage.blacklist = 'example.com, another-example.com';
-    if (typeof localStorage.popup == 'undefined')
-        localStorage.popup = 'popup';
+const storage = {
+    version : "1.0.0",
+    message_id: 0,
+    popup   : "popup",
+    blank   : false,
+    clip    : false,
+    clicked : false,
+    recent  : "",
+    // (::|[\uff1a]{2})([\u4e00-\u9fa5]|[a-zA-Z ])+ $
+    trigger_prefix: "",
+    trigger_suffix: "",
+    blacklist: [
+        "twitter.com",
+        "google.com"
+    ]
+};
+
+/**
+ * Google Analytics 
+ */
+analytics();
+function analytics() {
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');        
+    ga('create', 'UA-405976-10', 'auto');
+    ga('send', 'pageview');
 }
 
-function listener(request, sender, sendResponse) {
-    if (request == 'get_settings') {
-        var blacklist = localStorage.blacklist;
-        blacklist = blacklist.replace(/\n/g, ',');
-        blacklist = blacklist.replace(/,+/g, ',');
-        blacklist = blacklist.replace(/^,|,$/g, '');
-        blacklist = blacklist.split(',');
-
-        for (var i = blacklist.length; i--;)
-            blacklist[i] = blacklist[i].trim();
-
-        if (blacklist.length == 1 && !blacklist[0])
-            blacklist = [];
-
-        sendResponse({
-            scale     : localStorage.scale,
-            usefont   : localStorage.usefont == 'true',
-            hidePUA   : localStorage.hidePUA == 'true',
-            blacklist : blacklist,
-            popup     : localStorage.popup,
-        });
+initialize();
+chrome.extension.onMessage.addListener( listener );
+
+/**
+ * Conver local storage
+ * 
+ * @param {object} local storage
+ */
+function conver( object ) {
+    const news = { ...object };
+    Object.keys( news ).forEach( key => {
+        news[key] == "true"  && ( news[key] = true );
+        news[key] == "false" && ( news[key] = false );
+    });
+    return news;
+}
+
+/**
+ * Initialize
+ */
+function initialize() {
+    Object.keys( storage ).forEach( key => {
+        localStorage[key] == undefined && ( localStorage[key] = storage[key] );
+    });
+    console.log( localStorage )
+}
+
+/**
+ * Lister chorme message
+ * 
+ * @param {object} request
+ * @param {object} sender
+ * @param {object} sendResponse
+ */
+function listener( request, sender, sendResponse ) {
+    if ( request == "get_settings" ) {
+        sendResponse( conver( localStorage ));
     } else if ( request && request.id == "popup" ) {
         localStorage.popup = request.value;
         localStorage.popup == "popup" ? removeWindow() : createWindow();
         localStorage.popup == "popup" ? chrome.browserAction.setPopup({ popup: popup_url }) : chrome.browserAction.setPopup({ popup: "" });
+    } else if ( request && request.id == "set_settings" ) {
+        Object.keys( request.value ).forEach( key => {
+            localStorage[key] = request.value[key];
+        });
+    } else if ( request && request.id == "clear_settings" ) {
+        localStorage.clear();
+        initialize();
+    } else if ( request && request.id == "analytics" ) {
+        ga( "send", {
+            hitType      : "event",
+            eventCategory: request.value.eventCategory,
+            eventAction  : request.value.eventAction,
+        });
     }
-    /*
-    if (request == 'insertCSS') {
-        chrome.tabs.insertCSS(sender.tab.id, {
-          file: 'backup/sprite/sprite.css',
-          allFrames: true
-        })
-        return true
-    }
-    */
 }
 
 /***********************
  * Emoji pasting
  ***********************/
 
-localStorage.message_id = 0;
-
 // listen to other tabs, last one always overwrites the others
 chrome.extension.onMessage.addListener(function (message) {
     if (message.name == "input_deselected") {