git ssb

16+

Dominic / patchbay



Commit 14d54b356c1ef57cc1dca625f3b0886b7c31de34

get mini messages working, new simple styles

not sure if good idea

also break raw data again
Michael Williams committed on 12/23/2016, 7:27:16 AM
Parent: 79d1c71afb7e8054f9bb37aedaa506e33c61ec8a

Files changed

modules_basic/index.jschanged
modules_basic/message.jschanged
modules_basic/message.mcsschanged
modules_basic/message-author.jsadded
modules_basic/message-footer.jsdeleted
modules_basic/message-author.mcssadded
modules_basic/message-footer.mcssdeleted
modules_basic/message-header.jsdeleted
modules_basic/message-header.mcssdeleted
modules_basic/reply.jsadded
modules_basic/index.jsView
@@ -11,11 +11,10 @@
1111 "follow.js": require('./follow.js'),
1212 "invite.js": require('./invite.js'),
1313 "like.js": require('./like.js'),
1414 "markdown.js": require('./markdown.js'),
15 + "message-author.js": require('./message-author.js'),
1516 "message-backlinks.js": require('./message-backlinks.js'),
16- "message-footer.js": require('./message-footer.js'),
17- "message-header.js": require('./message-header.js'),
1817 "message-link.js": require('./message-link.js'),
1918 "message-name.js": require('./message-name.js'),
2019 "message.js": require('./message.js'),
2120 "names.js": require('./names.js'),
@@ -23,8 +22,9 @@
2322 "private.js": require('./private.js'),
2423 "pub.js": require('./pub.js'),
2524 "public.js": require('./public.js'),
2625 "relationships.js": require('./relationships.js'),
26 + "reply.js": require('./reply.js'),
2727 "search-box.js": require('./search-box.js'),
2828 "setup.js": require('./setup'),
2929 "suggest-mentions.js": require('./suggest-mentions.js'),
3030 "thread.js": require('./thread.js'),
modules_basic/message.jsView
@@ -6,10 +6,13 @@
66
77 exports.needs = {
88 avatar_name: 'first',
99 avatar_link: 'first',
10- message_meta: 'first',
11- message_header: 'first',
10 + message_meta: 'map',
11 + message_action: 'map',
12 + message_link: 'first',
13 + message_backlinks: 'first',
14 + message_author: 'first',
1215 message_content: 'first',
1316 message_content_mini: 'first',
1417 message_footer: 'first'
1518 }
@@ -26,29 +29,29 @@
2629 }
2730
2831 function message_render (msg, sbot) {
2932 var content = api.message_content_mini(msg)
30- // TODO re-enable
31- //if(content) return mini(msg, content)
33 + if (content) return mini(msg, content)
3234
3335 var content = api.message_content(msg)
34- if(!content) return mini(msg, message_content_mini_fallback(msg))
36 + if (!content) return mini(msg, message_content_mini_fallback(msg))
3537
36- var msgEl = h('Message', {
37- 'ev-keydown': navigateToMessageOnEnter
38 + return h('Message', {
39 + 'ev-keydown': navigateToMessageOnEnter,
40 + attributes: {
41 + tabindex: '0'
42 + }
3843 }, [
39- h('header', api.message_header(msg)),
40- h('section -content', content),
41- h('footer', api.message_footer(msg))
44 + h('hr'),
45 + h('header.author', api.message_author(msg)),
46 + h('section.meta', api.message_meta(msg)),
47 + h('section.content', content),
48 + h('section.action', api.message_action(msg)),
49 + h('footer.backlinks', api.message_backlinks(msg))
4250 ])
4351
44- // ); hyperscript does not seem to set attributes correctly.
45- msgEl.setAttribute('tabindex', '0')
46-
47- return msgEl
48-
4952 function navigateToMessageOnEnter (ev) {
50- //on enter, hit first meta.
53 + // on enter, hit first meta.
5154 if(ev.keyCode == 13) {
5255
5356 // unless in an input
5457 if (ev.target.nodeName === 'INPUT'
@@ -56,28 +59,27 @@
5659
5760 // HACK! (mw)
5861 // there's no exported api to open a new tab. :/
5962 // it's only done in `app.js` module in an`onhashchange` handler.
60- // sooooooo yeah this shit:
63 + // sooooooo yeah this shit for now :)
6164 var wtf = h('a', { href: `#${msg.key}` })
6265 msgEl.appendChild(wtf)
6366 wtf.click()
6467 }
6568 }
6669 }
6770
6871 function mini(msg, el) {
69- var div = h('div.message.message--mini', [
70- h('div.row', [
71- h('div', [
72- api.avatar_link(msg.value.author, api.avatar_name(msg.value.author)),
73- h('span.message_content', el)
74- ]),
75- h('div.message_meta.row', api.message_meta(msg))
76- ])
72 + return h('Message -mini', {
73 + attributes: {
74 + tabindex: '0'
75 + }
76 + }, [
77 + h('hr'),
78 + h('header.author', api.message_author(msg, { size: 0 })),
79 + h('section.meta', api.message_meta(msg)),
80 + h('section.content', el)
7781 ])
78- div.setAttribute('tabindex', '0')
79- return div
8082 }
8183 }
8284
8385
modules_basic/message.mcssView
@@ -1,19 +1,42 @@
11 Message {
2- padding: 1em;
2 + padding-top: 1em
3 + padding-bottom: 1em
34
4- header {
5 + -mini {
6 + padding-top: 0.25rem
7 + padding-bottom: 0.25rem
8 + }
59
10 + hr {
11 +
612 }
713
8- section {
9- -content {
10- (img) {
11- max-width: 100%
12- }
14 + header.author {
15 + float: left
16 + display: flex
17 + flex-direction: column
18 + }
19 +
20 + section.meta {
21 + float: right
22 + }
23 +
24 + section.content {
25 + (img) {
26 + max-width: 100%
1327 }
1428 }
1529
16- footer {
30 + section.action {
31 + display: flex
32 + justify-content: flex-end
1733
34 + a {
35 + margin-left: .5em
36 + }
1837 }
38 +
39 + footer.backlinks {
40 +
41 + }
1942 }
modules_basic/message-author.jsView
@@ -1,0 +1,39 @@
1 +var fs = require('fs')
2 +var Path = require('path')
3 +var h = require('../h')
4 +var when = require('@mmckegg/mutant/when')
5 +
6 +exports.needs = {
7 + avatar_link: 'first',
8 + avatar_image: 'first',
9 + avatar_name: 'first',
10 + timestamp: 'first'
11 +}
12 +
13 +exports.gives = {
14 + message_author: true,
15 + mcss: true
16 +}
17 +
18 +exports.create = function (api) {
19 + return {
20 + message_author,
21 + mcss: () => fs.readFileSync(Path.join(__dirname, 'message-author.mcss'))
22 + }
23 +
24 + function message_author (msg, opts = {}) {
25 + var { size = 1 } = opts
26 + var { value } = msg
27 + var { author } = value
28 + return h('MessageAuthor', {
29 + className: size === 0 ? '-mini' : ''
30 + }, [
31 + when(size > 0,
32 + h('section -image', api.avatar_link(author, api.avatar_image(author, 'thumbnail')))
33 + ),
34 + h('section -name', api.avatar_link(author, api.avatar_name(author))),
35 + h('section -timestamp', api.timestamp(msg))
36 + ])
37 + }
38 +}
39 +
modules_basic/message-footer.jsView
@@ -1,45 +1,0 @@
1-var fs = require('fs')
2-var Path = require('path')
3-var h = require('../h')
4-
5-exports.needs = {
6- message_action: 'map',
7- message_link: 'first',
8- message_backlinks: 'first'
9-}
10-
11-exports.gives = {
12- message_footer: true,
13- mcss: true,
14-}
15-
16-exports.create = function (api) {
17- return {
18- message_footer,
19- mcss: () => fs.readFileSync(Path.join(__dirname, 'message-footer.mcss'))
20- }
21-
22- function message_footer (msg) {
23- return h('MessageFooter', [
24- h('section.actions', [
25- api.message_action(msg),
26- h('a', {href: '#' + msg.key}, 'Reply')
27- ]),
28- backlinks(msg)
29- ])
30- }
31-
32- function backlinks (msg) {
33- var links = api.message_backlinks(msg)
34- var backlinksEl = h('section.backlinks')
35- if(links.length) {
36- backlinksEl.appendChild(h('label', [
37- 'backlinks:',
38- h('div', links.map(function (key) {
39- return api.message_link(key)
40- }))
41- ]))
42- }
43- return backlinksEl
44- }
45-}
modules_basic/message-author.mcssView
@@ -1,0 +1,12 @@
1 +MessageAuthor {
2 + display: flex
3 + flex-direction: column
4 +
5 + -mini {
6 + flex-direction: row
7 +
8 + section {
9 + margin-right: 1rem;
10 + }
11 + }
12 +}
modules_basic/message-footer.mcssView
@@ -1,17 +1,0 @@
1-MessageFooter {
2- display: flex
3- flex-direction: column
4-
5- section.actions {
6- display: flex
7- justify-content: flex-end
8-
9- a {
10- margin-left: .5em
11- }
12- }
13-
14- section.backlinks {
15-
16- }
17-}
modules_basic/message-header.jsView
@@ -1,39 +1,0 @@
1-var fs = require('fs')
2-var Path = require('path')
3-var h = require('../h')
4-
5-exports.needs = {
6- avatar_link: 'first',
7- avatar_image: 'first',
8- avatar_name: 'first',
9- message_meta: 'map',
10- message_link: 'first',
11- timestamp: 'first'
12-}
13-
14-exports.gives = {
15- message_header: true,
16- mcss: true
17-}
18-
19-exports.create = function (api) {
20- return {
21- message_header,
22- mcss: () => fs.readFileSync(Path.join(__dirname, 'message-header.mcss'))
23- }
24-
25- function message_header (msg) {
26- var { value } = msg
27- var { author } = value
28- return h('MessageHeader', [
29- h('section.author', [
30- api.avatar_link(author, api.avatar_image(author, 'thumbnail')),
31- api.avatar_link(author, api.avatar_name(author)),
32- api.timestamp(msg)
33- ]),
34- h('section.meta', api.message_meta(msg))
35- ])
36- }
37-}
38-
39-
modules_basic/message-header.mcssView
@@ -1,10 +1,0 @@
1-MessageHeader {
2- display: flex
3-
4- section.author {
5- flex: 1
6- }
7-
8- section.meta {
9- }
10-}
modules_basic/reply.jsView
@@ -1,0 +1,9 @@
1 +var h = require('../h')
2 +
3 +exports.gives = 'message_action'
4 +
5 +exports.create = function () {
6 + return function (msg) {
7 + return h('a', { href: '#' + msg.key }, 'Reply')
8 + }
9 +}

Built with git-ssb-web