git ssb

3+

arj / patchbook



Commit 22f627e1baaa2c6222122fc8361f75a9fdc2329e

Browse Files

Render rating messages so they are easier to interact with

Anders Rune Jensen committed on 11/21/2017, 8:55:46 PM
Parent: 0eecf56eb9dbb28cfd8e68836c5d7f71c3d6675d

Files changed

book/html/layout/detail.jschanged
book/html/simple-emoji.jsadded
message/html/render/about-subjective.jsadded
message/html/render/about-subjective.mcssadded
book/html/layout/detail.jsView
@@ -1,16 +1,15 @@
11 … const nest = require('depnest')
22 … const { h, when, computed, Value } = require('mutant')
3-var htmlEscape = require('html-escape')
43 … const addSuggest = require('suggest-box')
54 …
65 … exports.needs = nest({
76 … 'book.obs.book': 'first',
87 … 'about.html.image': 'first',
98 … 'about.obs.name': 'first',
109 … 'keys.sync.id': 'first',
1110 … 'emoji.async.suggest': 'first',
12- 'emoji.sync.url': 'first',
11 …+ 'book.html.simpleEmoji': 'first',
1312 … 'message.html': {
1413 … 'markdown': 'first'
1514 … },
1615 … 'book.html': {
@@ -26,35 +25,16 @@
2625 …
2726 … exports.create = (api) => {
2827 … return nest('book.html.layout', bookLayout)
2928 …
30- function renderEmoji (emoji, url) {
31- if (!url) return ':' + emoji + ':'
32- return `
33- <img
34- src="${htmlEscape(url)}"
35- alt=":${htmlEscape(emoji)}:"
36- title=":${htmlEscape(emoji)}:"
37- class="emoji"
38- >
39- `
40- }
41-
42- function simpleMarkdown(text) {
43- if (text.startsWith(':'))
44- return renderEmoji(text, api.emoji.sync.url(text.match(/:([^:]*)/)[1]))
45- else
46- return text
47- }
48-
4929 … function ratingEdit(isEditing, value) {
5030 … return when(isEditing,
5131 … h('input', {
5232 … 'ev-input': e => value.set(e.target.value),
5333 … value,
5434 … placeholder: 'your rating'
5535 … }),
56- h('span.text', { innerHTML: computed(value, simpleMarkdown) })
36 …+ h('span.text', { innerHTML: computed(value, api.book.html.simpleEmoji) })
5737 … )
5838 … }
5939 …
6040 … function ratingTypeEdit(isEditing, value) {
@@ -75,9 +55,9 @@
7555 … value.set(ev.detail.value)
7656 … })
7757 …
7858 … return when(isEditing, suggestWrapper,
79- h('span.text', { innerHTML: computed(value, simpleMarkdown) }))
59 …+ h('span.text', { innerHTML: computed(value, api.book.html.simpleEmoji) }))
8060 … }
8161 …
8262 … function simpleEdit(isEditing, name, value) {
8363 … const classList = computed([value, isEditing], (v, e) => {
book/html/simple-emoji.jsView
@@ -1,0 +1,31 @@
1 …+var nest = require('depnest')
2 …+var htmlEscape = require('html-escape')
3 …+
4 …+exports.needs = nest({
5 …+ 'emoji.sync.url': 'first'
6 …+})
7 …+
8 …+exports.gives = nest('book.html.simpleEmoji')
9 …+
10 …+exports.create = function (api) {
11 …+ return nest('book.html.simpleEmoji', simpleMarkdown)
12 …+
13 …+ function renderEmoji (emoji, url) {
14 …+ if (!url) return ':' + emoji + ':'
15 …+ return `
16 …+ <img
17 …+ src="${htmlEscape(url)}"
18 …+ alt=":${htmlEscape(emoji)}:"
19 …+ title=":${htmlEscape(emoji)}:"
20 …+ class="emoji"
21 …+ >
22 …+ `
23 …+ }
24 …+
25 …+ function simpleMarkdown(text) {
26 …+ if (text.startsWith(':'))
27 …+ return renderEmoji(text, api.emoji.sync.url(text.match(/:([^:]*)/)[1]))
28 …+ else
29 …+ return text
30 …+ }
31 …+}
message/html/render/about-subjective.jsView
@@ -1,0 +1,60 @@
1 …+const { h, Value, computed } = require('mutant')
2 …+var nest = require('depnest')
3 …+var extend = require('xtend')
4 …+
5 …+exports.needs = nest({
6 …+ 'about.obs.latestValue': 'first',
7 …+ 'sbot.async.get': 'first',
8 …+ 'book.html.simpleEmoji': 'first',
9 …+ 'message.html': {
10 …+ decorate: 'reduce',
11 …+ layout: 'first',
12 …+ markdown: 'first'
13 …+ }
14 …+})
15 …+
16 …+exports.gives = nest('message.html.render')
17 …+
18 …+exports.create = function (api) {
19 …+ return nest('message.html.render', subjective)
20 …+
21 …+ function subjective(msg, opts) {
22 …+ if (!msg.value || !msg.value.content)
23 …+ return
24 …+
25 …+ const content = msg.value.content
26 …+
27 …+ if (content.type == 'about' && content.rating && content.ratingType)
28 …+ {
29 …+ const element = api.message.html.layout(msg, extend({
30 …+ content: renderSubjective(msg),
31 …+ layout: content.review ? 'default' : 'mini'
32 …+ }, opts))
33 …+
34 …+ return api.message.html.decorate(element, { msg })
35 …+ }
36 …+ }
37 …+
38 …+ function bookTitle(msg) {
39 …+ const name = Value('')
40 …+ const bookKey = msg.value.content.about
41 …+ api.sbot.async.get(bookKey, (err, msg) => {
42 …+ let originalTitle = msg.content.title
43 …+ let latestTitle = api.about.obs.latestValue(bookKey, 'title')()
44 …+ name.set(latestTitle || originalTitle)
45 …+ })
46 …+ return name
47 …+ }
48 …+
49 …+ function renderSubjective(msg) {
50 …+ let title = bookTitle(msg)
51 …+ const content = msg.value.content
52 …+ return ['Rated ', h('a', { href: msg.value.content.about }, title),
53 …+ ' ' + content.rating + ' ',
54 …+ h('span.text', { innerHTML:
55 …+ computed(content.ratingType,
56 …+ api.book.html.simpleEmoji) }),
57 …+ computed(content.review, api.message.html.markdown)
58 …+ ]
59 …+ }
60 …+}
message/html/render/about-subjective.mcssView
@@ -1,0 +1,12 @@
1 …+Message {
2 …+ section.content {
3 …+ span {
4 …+ img.emoji {
5 …+ height: 1.2em;
6 …+ width: 1.2em;
7 …+ vertical-align: middle;
8 …+ margin-top: -0.2em;
9 …+ }
10 …+ }
11 …+ }
12 …+}

Built with git-ssb-web