git ssb

1
const nest = require('depnest')
2
const Blog = require('scuttle-blog')
3
const isBlog = require('scuttle-blog/isBlog')
4
const { h, Value, computed, when, resolve } = require('mutant')
5
const isEmpty = require('lodash/isEmpty')
6
7
exports.gives = nest('message.html.render')
8
9
exports.needs = nest({
10
  'about.obs.color': 'first',
11
  'blob.sync.url': 'first',
12
  'message.html.decorate': 'reduce',
13
  'message.html.layout': 'first',
14
  'message.html.markdown': 'first',
15
  'sbot.obs.connection': 'first'
16
  // 'history.sync.push': 'first',
17
})
18
19
exports.create = function (api) {
20
  return nest('message.html.render', blogRenderer)
21
22
  function blogRenderer (msg, opts) {
23
    if (!isBlog(msg)) return
24
25
    var blog = Blog(api.sbot.obs.connection).obs.get(msg)
26
    var showBlog = Value(false)
27
28
    const element = api.message.html.layout(msg, Object.assign({}, {
29
      content: when(showBlog,
30
        BlogFull(blog, api.message.html.markdown),
31
        BlogCard({
32
          blog,
33
          onClick: () => showBlog.set(true),
34
          color: api.about.obs.color,
35
          blobUrl: api.blob.sync.url
36
        })
37
        // Sample(blog, api.blob.sync.url, showBlog)
38
      ),
39
      layout: 'default'
40
    }, opts))
41
42
    return api.message.html.decorate(element, { msg })
43
  }
44
}
45
46
function BlogFull (blog, renderMd) {
47
  return computed(blog.body, body => {
48
    if (!isEmpty(body)) {
49
      return h('BlogFull.Markdown', [
50
        h('h1', blog.title),
51
        renderMd(body)
52
      ])
53
    }
54
55
    return h('BlogFull.Markdown', [
56
      h('h1', blog.title),
57
      blog.summary,
58
      h('p', 'loading...')
59
    ])
60
  })
61
}
62
63
function BlogCard ({ blog, blobUrl, onClick, color }) {
64
  const thumbnail = when(blog.thumbnail,
65
    h('Thumbnail', {
66
      style: {
67
        'background-image': `url("${blobUrl(resolve(blog.thumbnail))}")`,
68
        'background-position': 'center',
69
        'background-size': 'cover'
70
      }
71
    }),
72
    h('Thumbnail -empty', {
73
      style: { 'background-color': color(blog.title) }
74
    }, [
75
      h('i.fa.fa-file-text-o')
76
    ])
77
  )
78
79
  var b = h('BlogCard', { 'ev-click': onClick }, [
80
    // h('div.context', [
81
    //   api.about.html.avatar(author, 'tiny'),
82
    //   h('div.name', api.about.obs.name(author)),
83
    //   api.message.html.timeago(blog)
84
    // ]),
85
    h('div.content', [
86
      thumbnail,
87
      h('div.text.Markdown', [
88
        h('h1', blog.title),
89
        // when(blog.channel, api.message.html.channel(blog.channel))
90
        h('div.summary', blog.summary),
91
        h('div.read', 'Read blog')
92
      ])
93
    ])
94
  ])
95
96
  return b
97
}
98