├── .gitignore ├── icon.png ├── icon-large.png ├── README.md ├── manifest.json ├── content.js ├── popup.js └── popup.html /.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | key.pem 3 | -------------------------------------------------------------------------------- /icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/robinhuy/emoticon-input/developer/icon.png -------------------------------------------------------------------------------- /icon-large.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/robinhuy/emoticon-input/developer/icon-large.png -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Emoticon Input 2 | Emoticon input everywhere is a free extension that lets you view and copy emoticons to use everywhere. 3 | 4 | ### Features 5 | - Choose the emoticon, Click & Paste to almost everywhere you can. 6 | - Save 10 recent emoticons. 7 | - Total 280 emoticons, separate 4 categories. 8 | 9 | ### Install 10 | Chrome Web Store: https://chrome.google.com/webstore/detail/emoticon-input-everywhere/bohndelehfpgmhpfohgnoihjdknklnbf 11 | 12 | -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "manifest_version": 2, 3 | 4 | "name": "Emoticon input everywhere", 5 | "short_name": "Emoticon input", 6 | "description": "Allow input emoticon in everywhere", 7 | "version": "1.3", 8 | "author": "Robin Huy", 9 | 10 | "browser_action": { 11 | "default_icon": "icon.png", 12 | "default_popup": "popup.html", 13 | "default_title": "Emoticon input everywhere" 14 | }, 15 | 16 | "content_scripts": [ 17 | { 18 | "matches": ["http://*/*", "https://*/*"], 19 | "js": ["content.js"] 20 | } 21 | ], 22 | 23 | "permissions": [ 24 | "activeTab" 25 | ] 26 | } -------------------------------------------------------------------------------- /content.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by Robin Huy 3 | */ 4 | 5 | chrome.runtime.onMessage.addListener(function (request) { 6 | function eieShowToast(icon) { 7 | // Create toast container 8 | var toastContainer = document.createElement('div'); 9 | toastContainer.style.top = '10%'; 10 | toastContainer.style.right = '7%'; 11 | toastContainer.style.maxWidth = '80%'; 12 | toastContainer.style.position = 'fixed'; 13 | toastContainer.style.zIndex = '999999'; 14 | toastContainer.style.fontSize = '15px'; 15 | toastContainer.style.lineHeight = '1.5'; 16 | toastContainer.style.color = 'rgba(0,0,0,0.87)'; 17 | 18 | // Create toast 19 | var toast = document.createElement('div'); 20 | toast.style.transform = 'translateY(-35px)'; 21 | toast.style.top = '35px'; 22 | toast.style.marginTop = '10px'; 23 | toast.style.padding = '10px 25px'; 24 | toast.style.backgroundColor = '#323232'; 25 | toast.style.color = '#ffffff'; 26 | toast.style.display = 'flex'; 27 | toast.style.alignItems = 'center'; 28 | toast.style.justifyContent = 'space-between'; 29 | toast.style.boxShadow = '0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2)'; 30 | 31 | // Set text 32 | var span = document.createElement('span'); 33 | var text = document.createTextNode(icon + ' \u00A0 copied to clipboard'); 34 | span.appendChild(text); 35 | 36 | // Append child 37 | toast.appendChild(span); 38 | toastContainer.appendChild(toast); 39 | document.body.appendChild(toastContainer); 40 | 41 | // Remove toast after 3 second 42 | setTimeout(function () { 43 | document.body.removeChild(toastContainer); 44 | }, 3000); 45 | } 46 | 47 | // Show toast when received message "copy emoticon" 48 | if (request.action === 'copy-emoticon') { 49 | eieShowToast(request.icon); 50 | } 51 | }); -------------------------------------------------------------------------------- /popup.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by Robin Huy 3 | */ 4 | 5 | /** 6 | * Handle event when user click to Tab 7 | */ 8 | function handleOnclickTab() { 9 | var tabs = document.getElementsByClassName('tab'); 10 | 11 | for (var i = 0; i < tabs.length; i++) { 12 | tabs[i].addEventListener('click', function () { 13 | // Remove class "active" from all tabs 14 | for (var j = 0; j < tabs.length; j++) { 15 | tabs[j].classList.remove('active'); 16 | } 17 | 18 | // Add class "active" to chosen tab 19 | this.classList.add('active'); 20 | 21 | // Hide all tab contents 22 | var tabContents = document.getElementsByClassName('tab-content'); 23 | for (var k = 0; k < tabContents.length; k++) { 24 | tabContents[k].style.display = 'none'; 25 | } 26 | 27 | // Show chosen tab content 28 | var tabId = this.children[0].getAttribute('href').replace('#', ''); 29 | document.getElementById(tabId).style.display = 'block'; 30 | }); 31 | } 32 | } 33 | 34 | /** 35 | * Handle event when user click to Emoticon 36 | */ 37 | function handleOnclickEmoticon() { 38 | var span = document.getElementsByClassName('emoticon'); 39 | 40 | for (var i = 0; i < span.length; i++) { 41 | span[i].addEventListener('click', function () { 42 | var self = this; 43 | 44 | // Create dummy input and set value to span's text 45 | var input = document.createElement('input'); 46 | input.value = self.innerText; 47 | document.body.appendChild(input); 48 | 49 | // Select dummy input then copy selection 50 | input.select(); 51 | document.execCommand('copy'); 52 | 53 | // Update recently used emoticons 54 | setRecentlyEmoticons(JSON.stringify({ 55 | title: self.title, 56 | characters: self.innerText 57 | })); 58 | displayRecentlyEmoticons(); 59 | 60 | // Remove dummy input 61 | document.body.removeChild(input); 62 | 63 | // Notification 64 | chrome.tabs.query({active: true}, function (tabs) { 65 | chrome.tabs.sendMessage(tabs[0].id, { 66 | action: 'copy-emoticon', 67 | icon: self.innerText 68 | }); 69 | 70 | // Close extension tab 71 | window.close(); 72 | }); 73 | }); 74 | } 75 | } 76 | 77 | /** 78 | * Get recently used emoticons from local storage 79 | */ 80 | function getRecentlyEmoticons() { 81 | if (typeof(Storage) !== 'undefined') { 82 | var data; 83 | 84 | try { 85 | data = JSON.parse(localStorage.getItem('recently_used_emoticons')) || []; 86 | } catch (e) { 87 | data = []; 88 | } 89 | 90 | return data; 91 | } else { 92 | return []; 93 | } 94 | } 95 | 96 | /** 97 | * Save recently used emoticon to local storage 98 | * @param emoticon{string} - JSON Stringify represents emoticon like: "{title: '', characters: ''}" 99 | */ 100 | function setRecentlyEmoticons(emoticon) { 101 | var data = getRecentlyEmoticons(); 102 | 103 | // Remove this emoticon if already exist 104 | if (data.indexOf(emoticon) !== -1) 105 | data.splice(data.indexOf(emoticon), 1); 106 | 107 | // Add this emoticon to top 108 | data.unshift(emoticon); 109 | 110 | // Limit 10 recently emoticons 111 | if (data.length > 10) 112 | data.pop(); 113 | 114 | if (typeof(Storage) !== 'undefined') { 115 | localStorage.setItem('recently_used_emoticons', JSON.stringify(data)); 116 | } 117 | } 118 | 119 | /** 120 | * Display recently emoticons 121 | */ 122 | function displayRecentlyEmoticons() { 123 | var data = getRecentlyEmoticons(); 124 | 125 | var emoticons = ''; 126 | for (var i = 0; i < data.length; i++) { 127 | var emoticon = {}; 128 | try { 129 | emoticon = JSON.parse(data[i]); 130 | emoticons += '' + emoticon.characters + ''; 131 | } catch (err) { 132 | console.log(err); 133 | } 134 | } 135 | 136 | document.getElementById('recently-emoticons').innerHTML = emoticons; 137 | } 138 | 139 | document.addEventListener('DOMContentLoaded', function () { 140 | displayRecentlyEmoticons(); 141 | handleOnclickTab(); 142 | handleOnclickEmoticon(); 143 | }); 144 | -------------------------------------------------------------------------------- /popup.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Emoji Input 6 | 95 | 96 | 97 | 98 | 99 | 100 |
101 |

Recently emoticons

102 |
 
103 | 104 |

All emoticons

105 | 111 | 112 |
113 |
114 | 😁 115 | 😬 116 | 😂 117 | 😃 118 | 😄 119 | 😅 120 | 😆 121 | 😇 122 | 😉 123 | 😊 124 | 😋 125 | 😌 126 | 😍 127 | 😎 128 | 😏 129 | 🤔 130 | 🤗 131 | 😐 132 | 😑 133 | 😒 134 | 😓 135 | 😔 136 | 😕 137 | 😖 138 | 😘 139 | 😗 140 | 😙 141 | 😚 142 | 😛 143 | 😜 144 | 😝 145 | 😞 146 | 😟 147 | 😤 148 | 😠 149 | 😡 150 | 😣 151 | 😤 152 | 😥 153 | 😢 154 | 😭 155 | 😦 156 | 😧 157 | 😩 158 | 😫 159 | 😪 160 | 😴 161 | 😮 162 | 😯 163 | 😨 164 | 😰 165 | 😱 166 | 😲 167 | 😳 168 | 😴 169 | 😵 170 | 😶 171 | 🙁 172 | 🙂 173 | 🙃 174 | 🙄 175 | 😷 176 | 🤕 177 | 😈 178 | 👿 179 | 👹 180 | 👺 181 | 💀 182 | 👻 183 | 👽 184 |
185 | 186 |
187 | 👶 188 | 👦 189 | 👧 190 | 👨 191 | 👩 192 | 👴 193 | 👵 194 | 👮 195 | 🕵 196 | 💂 197 | 👷 198 | 👸 199 | 👳 200 | 👲 201 | 👱 202 | 👰 203 | 👼 204 | 🎅 205 | 🙍 206 | 🙎 207 | 🙅 208 | 🙆 209 | 💁 210 | 🙋 211 | 💆 212 | 💇 213 | 🙇 214 | 🚶 215 | 🏃 216 | 💃 217 | 👯 218 | 🕴 219 | 👫 220 | 👬 221 | 👭 222 | 💏 223 | 💑 224 | 👪 225 | 💪 226 | 👈 227 | 👉 228 | ☝ 229 | 👆 230 | 🖕 231 | 👇 232 | ✌ 233 | 🖖 234 | 🤘 235 | 🖐 236 | ✋ 237 | 👌 238 | 👍 239 | 👎 240 | ✊ 241 | 👊 242 | 👋 243 | 👏 244 | 👐 245 | 🙌 246 | 🙏 247 | ✍ 248 | 💅 249 | 👂 250 | 👃 251 | 👣 252 | 👀 253 | 👁 254 | 👅 255 | 👄 256 | 💋 257 |
258 | 259 |
260 | 🐱 261 | 😸 262 | 😹 263 | 😺 264 | 😻 265 | 😼 266 | 😽 267 | 😾 268 | 😿 269 | 🙀 270 | 🙈 271 | 🙉 272 | 🙊 273 | 🐵 274 | 🐒 275 | 🐶 276 | 🐕 277 | 🐩 278 | 🐺 279 | 🐈 280 | 🦁 281 | 🐯 282 | 🐅 283 | 🐆 284 | 🐴 285 | 🐎 286 | 🦄 287 | 🐮 288 | 🐂 289 | 🐃 290 | 🐄 291 | 🐷 292 | 🐗 293 | 🐽 294 | 🐏 295 | 🐑 296 | 🐐 297 | 🐪 298 | 🐫 299 | 🐘 300 | 🐭 301 | 🐁 302 | 🐀 303 | 🐹 304 | 🐰 305 | 🐇 306 | 🐿 307 | 🐻 308 | 🐨 309 | 🐼 310 | 🦃 311 | 🐓 312 | 🐔 313 | 🐣 314 | 🐤 315 | 🐥 316 | 🐦 317 | 🐧 318 | 🕊 319 | 🐸 320 | 🐊 321 | 🐢 322 | 🐍 323 | 🐲 324 | 🐉 325 | 🐳 326 | 🐋 327 | 🐬 328 | 🐟 329 | 🐠 330 | 331 | 332 | 333 | 334 | 335 | 336 | 337 | 338 | 339 | 340 | 341 |
342 | 343 |
344 | ☠ 345 | 🛀 346 | 🛌 347 | 💌 348 | 💣 349 | 🕳 350 | 🛍 351 | 📿 352 | 💎 353 | 🔪 354 | 🏺 355 | 🗺 356 | 💈 357 | 🖼 358 | 🛎 359 | 🚪 360 | 🛏 361 | 🛋 362 | 🚽 363 | ☕ 364 | ☘ 365 | ⛑ 366 | ⛏ 367 | ⚒ 368 | ⚓ 369 | ⚔ 370 | ⚖ 371 | ⌛ 372 | ⚗ 373 | ⚙ 374 | ⛓ 375 | ⚰ 376 | ⚱ 377 | ⚽ 378 | ⚾ 379 | ⛸ 380 | ⛄ 381 | ⛅ 382 | ⛈ 383 | ☔ 384 | ⚡ 385 | ☄ 386 | ✨ 387 | ⛩ 388 | ⛪ 389 | ⛱ 390 | ⛳ 391 | ⛴ 392 | ⛵ 393 | ⛽ 394 | ☢ 395 | ☣ 396 | ☦ 397 | ☪ 398 | ☮ 399 | ☸ 400 | ⚛ 401 | ♈ 402 | ♉ 403 | ♊ 404 | ♋ 405 | ♌ 406 | ♍ 407 | ♎ 408 | ♏ 409 | ♐ 410 | ♑ 411 | ♒ 412 | ♓ 413 | ⛎ 414 |
415 |
416 |
417 | 418 | 421 | 422 | 423 | 424 | 425 | --------------------------------------------------------------------------------