| plugs/message/html/layout/mini.jsView |
|---|
| 1 | | -const {h, computed} = require('mutant') |
| 2 | | -const nest = require('depnest') |
| 1 … | +const { h, map, computed } = require('mutant') |
| 2 … | +var nest = require('depnest') |
| 3 | 3 … | var ref = require('ssb-ref') |
| 4 | 4 … | |
| 5 | 5 … | exports.needs = nest({ |
| 6 … | + 'profile.html.person': 'first', |
| 7 … | + 'message.obs.backlinks': 'first', |
| 8 … | + 'message.obs.name': 'first', |
| 6 | 9 … | 'message.html': { |
| 10 … | + link: 'first', |
| 11 … | + meta: 'map', |
| 7 | 12 … | action: 'map', |
| 8 | | - backlinks: 'first', |
| 9 | | - author: 'first', |
| 10 | | - meta: 'map', |
| 11 | 13 … | timestamp: 'first' |
| 12 | 14 … | }, |
| 13 | | - 'profile.html.person': 'first' |
| 15 … | + 'about.html.image': 'first' |
| 14 | 16 … | }) |
| 15 | 17 … | |
| 16 | 18 … | exports.gives = nest('message.html.layout') |
| 17 | 19 … | |
| 18 | | -exports.create = (api) => { |
| 19 | | - return nest('message.html.layout', mini) |
| 20 … | +exports.create = function (api) { |
| 21 … | + return nest('message.html.layout', layout) |
| 20 | 22 … | |
| 21 | | - function mini (msg, opts) { |
| 22 | | - if (opts.layout !== 'mini') return |
| 23 … | + function layout (msg, opts) { |
| 24 … | + if (!(opts.layout === 'mini')) return |
| 23 | 25 … | |
| 24 | | - var classList = [] |
| 25 | | - var additionalMeta = [] |
| 26 | | - var footer = [] |
| 26 … | + var backlinks = opts.backlinks ? api.message.obs.backlinks(msg.key) : [] |
| 27 … | + var classList = ['Message -mini'] |
| 28 … | + var replyInfo = null |
| 27 | 29 … | |
| 28 | | - if (opts.showActions) { |
| 29 | | - |
| 30 | | - footer.push( |
| 31 | | - computed(msg.key, (key) => { |
| 32 | | - if (ref.isMsg(key)) { |
| 33 | | - return h('footer', [ |
| 34 | | - h('div.actions', [ |
| 35 | | - api.message.html.action(msg) |
| 36 | | - ]) |
| 37 | | - ]) |
| 38 | | - } |
| 39 | | - }) |
| 40 | | - ) |
| 30 … | + if (msg.value.content.root) { |
| 31 … | + classList.push('-reply') |
| 32 … | + var branch = msg.value.content.branch |
| 33 … | + if (branch) { |
| 34 … | + if (!opts.previousId || (opts.previousId && last(branch) && opts.previousId !== last(branch))) { |
| 35 … | + replyInfo = h('span', ['in reply to ', api.message.html.link(last(branch))]) |
| 36 … | + } |
| 37 … | + } |
| 38 … | + } else if (msg.value.content.project) { |
| 39 … | + replyInfo = h('span', ['on ', api.message.html.link(msg.value.content.project)]) |
| 41 | 40 … | } |
| 42 | 41 … | |
| 43 | | - if (opts.priority >= 2) { |
| 42 … | + if (opts.priority === 2) { |
| 44 | 43 … | classList.push('-new') |
| 45 | | - additionalMeta.push(h('span.flag -new', {title: 'New Message'})) |
| 46 | 44 … | } |
| 47 | | - return h('Message -mini', {classList}, [ |
| 48 | | - h('header', [ |
| 49 | | - h('div.mini', [ |
| 50 | | - api.profile.html.person(msg.value.author), ' ', |
| 51 | | - opts.miniContent |
| 45 … | + |
| 46 … | + return h('div', { |
| 47 … | + classList |
| 48 … | + }, [ |
| 49 … | + messageHeader(msg, { |
| 50 … | + replyInfo, |
| 51 … | + priority: opts.priority, |
| 52 … | + miniContent: opts.miniContent |
| 53 … | + }), |
| 54 … | + h('section', [opts.content]), |
| 55 … | + computed(msg.key, (key) => { |
| 56 … | + if (ref.isMsg(key)) { |
| 57 … | + return h('footer', [ |
| 58 … | + h('div.actions', [ |
| 59 … | + api.message.html.action(msg) |
| 60 … | + ]) |
| 61 … | + ]) |
| 62 … | + } |
| 63 … | + }), |
| 64 … | + map(backlinks, backlink => { |
| 65 … | + return h('a.backlink', { |
| 66 … | + href: backlink, |
| 67 … | + title: backlink |
| 68 … | + }, [ |
| 69 … | + h('strong', 'Referenced from'), ' ', api.message.obs.name(backlink) |
| 70 … | + ]) |
| 71 … | + }) |
| 72 … | + ]) |
| 73 … | + |
| 74 … | + |
| 75 … | + |
| 76 … | + function messageHeader (msg, {replyInfo, priority, miniContent}) { |
| 77 … | + var additionalMeta = [] |
| 78 … | + if (opts.priority >= 2) { |
| 79 … | + additionalMeta.push(h('span.flag -new', {title: 'New Message'})) |
| 80 … | + } |
| 81 … | + return h('header', [ |
| 82 … | + h('div.main', [ |
| 83 … | + h('a.avatar', {href: `${msg.value.author}`}, [ |
| 84 … | + api.about.html.image(msg.value.author) |
| 85 … | + ]), |
| 86 … | + h('div.main', [ |
| 87 … | + h('div.name', [ |
| 88 … | + api.profile.html.person(msg.value.author) |
| 89 … | + ]), |
| 90 … | + h('div.meta', [ |
| 91 … | + miniContent, ' ', |
| 92 … | + replyInfo |
| 93 … | + ]) |
| 94 … | + ]) |
| 52 | 95 … | ]), |
| 53 | | - h('div.meta', {}, [ |
| 96 … | + h('div.meta', [ |
| 54 | 97 … | api.message.html.meta(msg), |
| 55 | | - api.message.html.timestamp(msg), |
| 56 | | - additionalMeta |
| 98 … | + additionalMeta, |
| 99 … | + h('strong', api.message.html.timestamp(msg)) |
| 57 | 100 … | ]) |
| 58 | | - ]), |
| 59 | | - h('section', [opts.content]), |
| 60 | | - footer |
| 61 | | - ]) |
| 101 … | + ]) |
| 102 … | + } |
| 62 | 103 … | } |
| 63 | 104 … | } |
| 105 … | + |
| 106 … | +function last (array) { |
| 107 … | + if (Array.isArray(array)) { |
| 108 … | + return array[array.length - 1] |
| 109 … | + } else { |
| 110 … | + return array |
| 111 … | + } |
| 112 … | +} |