Commit 1d93c63544059ee8195e84d178b24ed4b2c39a2f
Render and suggest emoji
cel committed on 11/24/2016, 2:48:32 AMParent: f00625ab123486916f87fdac226a199db6ad70bf
Files changed
modules_basic/markdown.js | changed |
modules_extra/index.js | changed |
modules_extra/emoji.js | added |
style.css | changed |
modules_basic/markdown.js | ||
---|---|---|
@@ -1,10 +1,21 @@ | ||
1 | 1 … | var markdown = require('ssb-markdown') |
2 | 2 … | var h = require('hyperscript') |
3 | 3 … | var ref = require('ssb-ref') |
4 | 4 … | |
5 | -var blob_url = require('../plugs').first(exports.blob_url = []) | |
5 … | +var plugs = require('../plugs') | |
6 … | +var blob_url = plugs.first(exports.blob_url = []) | |
7 … | +var emoji_url = plugs.first(exports.emoji_url = []) | |
6 | 8 … | |
9 … | +function renderEmoji(emoji) { | |
10 … | + var url = emoji_url(emoji) | |
11 … | + if (!url) return ':' + emoji + ':' | |
12 … | + return '<img src="' + encodeURI(url) + '"' | |
13 … | + + ' alt=":' + escape(emoji) + ':"' | |
14 … | + + ' title=":' + escape(emoji) + ':"' | |
15 … | + + ' class="emoji">' | |
16 … | +} | |
17 … | + | |
7 | 18 … | exports.markdown = function (content) { |
8 | 19 … | if('string' === typeof content) |
9 | 20 … | content = {text: content} |
10 | 21 … | //handle patchwork style mentions. |
@@ -15,8 +26,9 @@ | ||
15 | 26 … | }) |
16 | 27 … | |
17 | 28 … | var md = h('div.markdown') |
18 | 29 … | md.innerHTML = markdown.block(content.text, { |
30 … | + emoji: renderEmoji, | |
19 | 31 … | toUrl: function (id) { |
20 | 32 … | if(ref.isBlob(id)) return blob_url(id) |
21 | 33 … | return '#'+(mentions[id]?mentions[id]:id) |
22 | 34 … | } |
modules_extra/index.js | ||
---|---|---|
@@ -1,7 +1,9 @@ | ||
1 | 1 … | module.exports = { |
2 | 2 … | "audio-mp3.js": require('./audio-mp3.js'), |
3 | 3 … | "channel.js": require('./channel.js'), |
4 … | + "emoji.js": require('./emoji.js'), | |
5 … | + "suggest-emoji.js": require('./suggest-emoji.js'), | |
4 | 6 … | "git.js": require('./git.js'), |
5 | 7 … | "notifications.js": require('./notifications.js'), |
6 | 8 … | "meta-image.js": require('./meta-image.js'), |
7 | 9 … | "music-release-cc.js": require('./music-release-cc.js'), |
modules_extra/emoji.js | ||
---|---|---|
@@ -1,0 +1,14 @@ | ||
1 … | +var emojis = require('emoji-named-characters') | |
2 … | +var emojiNames = Object.keys(emojis) | |
3 … | + | |
4 … | +var plugs = require('../plugs') | |
5 … | +var blob_url = plugs.first(exports.blob_url = []) | |
6 … | + | |
7 … | +exports.emoji_names = function () { | |
8 … | + return emojiNames | |
9 … | +} | |
10 … | + | |
11 … | +exports.emoji_url = function (emoji) { | |
12 … | + return emoji in emojis && | |
13 … | + blob_url(emoji).replace(/\/blobs\/get/, '/img/emoji') + '.png' | |
14 … | +} |
style.css | |||
---|---|---|---|
@@ -259,9 +259,15 @@ | |||
259 | 259 … | border-right: 2px solid #eee; | |
260 | 260 … | padding-right: 5px; | |
261 | 261 … | } | |
262 | 262 … | ||
263 … | +.emoji { | ||
264 … | + height: 1em; | ||
265 … | + width: 1em; | ||
266 … | + vertical-align: middle; | ||
267 … | +} | ||
263 | 268 … | ||
269 … | + | ||
264 | 270 … | /* -- suggest box */ | |
265 | 271 … | ||
266 | 272 … | .suggest-box > * { | |
267 | 273 … | display: block; | |
@@ -285,8 +291,14 @@ | |||
285 | 291 … | background: #white; | |
286 | 292 … | border-radius: 1em; | |
287 | 293 … | } | |
288 | 294 … | ||
295 … | +/* emoji */ | ||
296 … | +.suggest-box img { | ||
297 … | + height: 20px; | ||
298 … | + width: 20px; | ||
299 … | +} | ||
300 … | + | ||
289 | 301 … | /* avatar */ | |
290 | 302 … | ||
291 | 303 … | .avatar--large, | |
292 | 304 … | .avatar--thumbnail, |
Built with git-ssb-web