Commit f3abfca785a8f7b93cc0240027581e4dbe4385d9
refactor preview message to use Message
mix irving committed on 1/4/2017, 9:49:16 PMParent: 41ed6a5aa572f6de601bab35fc108a955657c074
Files changed
modules_basic/message.js | changed |
modules_core/message-confirm.js | changed |
modules_core/message-confirm.mcss | added |
style.css | changed |
modules_basic/message.js | ||
---|---|---|
@@ -26,9 +26,9 @@ | ||
26 | 26 … | message_render, |
27 | 27 … | mcss: () => fs.readFileSync(__filename.replace(/js$/, 'mcss'), 'utf8') |
28 | 28 … | } |
29 | 29 … | |
30 | - function message_render (msg, sbot) { | |
30 … | + function message_render (msg) { | |
31 | 31 … | var content = api.message_content_mini(msg) |
32 | 32 … | if (content) return mini(msg, content) |
33 | 33 … | |
34 | 34 … | content = api.message_content(msg) |
@@ -83,4 +83,5 @@ | ||
83 | 83 … | |
84 | 84 … | function message_content_mini_fallback(msg) { |
85 | 85 … | return h('code', msg.value.content.type) |
86 | 86 … | } |
87 … | + |
modules_core/message-confirm.js | ||
---|---|---|
@@ -1,27 +1,33 @@ | ||
1 | -var lightbox = require('hyperlightbox') | |
2 | -var h = require('hyperscript') | |
3 | -var u = require('../util') | |
4 | -var self_id = require('../keys').id | |
1 … | +const fs = require('fs') | |
2 … | +const lightbox = require('hyperlightbox') | |
3 … | +const h = require('../h') | |
4 … | +const u = require('../util') | |
5 … | +const self_id = require('../keys').id | |
5 | 6 … | //publish or add |
6 | 7 … | |
7 | -var plugs = require('../plugs') | |
8 … | +const plugs = require('../plugs') | |
8 | 9 … | |
9 | 10 … | exports.needs = { |
10 | - publish: 'first', message_content: 'first', avatar: 'first', | |
11 … | + publish: 'first', | |
12 … | + message_render: 'first', | |
13 … | + avatar: 'first', | |
11 | 14 … | message_meta: 'map' |
12 | 15 … | } |
13 | 16 … | |
14 | -exports.gives = 'message_confirm' | |
17 … | +exports.gives = { | |
18 … | + message_confirm: 'true', | |
19 … | + mcss: 'true' | |
20 … | +} | |
15 | 21 … | |
16 | -//var publish = plugs.first(exports.sbot_publish = []) | |
17 | -//var message_content = plugs.first(exports.message_content = []) | |
18 | -//var avatar = plugs.first(exports.avatar = []) | |
19 | -//var message_meta = plugs.map(exports.message_meta = []) | |
20 | -// | |
21 | 22 … | exports.create = function (api) { |
22 | - return function (content, cb) { | |
23 … | + return { | |
24 … | + message_confirm, | |
25 … | + mcss: () => fs.readFileSync(__filename.replace(/js$/, 'mcss'), 'utf8') | |
26 … | + } | |
23 | 27 … | |
28 … | + function message_confirm (content, cb) { | |
29 … | + | |
24 | 30 … | cb = cb || function () {} |
25 | 31 … | |
26 | 32 … | var lb = lightbox() |
27 | 33 … | document.body.appendChild(lb) |
@@ -36,32 +42,33 @@ | ||
36 | 42 … | content: content |
37 | 43 … | } |
38 | 44 … | } |
39 | 45 … | |
40 | - var okay = h('button', 'okay', {onclick: function () { | |
41 | - lb.remove() | |
42 | - api.publish(content, cb) | |
43 | - }}) | |
46 … | + var okay = h('button', { | |
47 … | + 'ev-click': () => { | |
48 … | + lb.remove() | |
49 … | + api.publish(content, cb) | |
50 … | + }}, | |
51 … | + 'okay' | |
52 … | + ) | |
44 | 53 … | |
45 | - var cancel = h('button', 'Cancel', {onclick: function () { | |
46 | - lb.remove() | |
47 | - cb(null) | |
48 | - }}) | |
54 … | + var cancel = h('button', { | |
55 … | + 'ev-click': () => { | |
56 … | + lb.remove() | |
57 … | + cb(null) | |
58 … | + }}, | |
59 … | + 'Cancel' | |
60 … | + ) | |
49 | 61 … | |
50 | 62 … | okay.addEventListener('keydown', function (ev) { |
51 | 63 … | if(ev.keyCode === 27) cancel.click() //escape |
52 | 64 … | }) |
53 | 65 … | |
54 | - lb.show(h('div.column.message-confirm', | |
55 | - h('div.message', | |
56 | - h('div.title.row', | |
57 | - h('div.avatar', api.avatar(msg.value.author, 'thumbnail')), | |
58 | - h('div.message_meta.row', api.message_meta(msg)) | |
59 | - ), | |
60 | - h('div.message_content', api.message_content(msg) | |
61 | - || h('pre', JSON.stringify(msg, null, 2))) | |
62 | - ), | |
63 | - h('div.row.message-confirm__controls', okay, cancel) | |
66 … | + lb.show(h('MessageConfirm', [ | |
67 … | + h('header -preview_description', h('h1', 'Preview')), | |
68 … | + h('section -message_preview', api.message_render(msg)), | |
69 … | + h('section -actions', [okay, cancel]) | |
70 … | + ] | |
64 | 71 … | )) |
65 | 72 … | |
66 | 73 … | okay.focus() |
67 | 74 … | } |
modules_core/message-confirm.mcss | |||
---|---|---|---|
@@ -1,0 +1,36 @@ | |||
1 … | +MessageConfirm { | ||
2 … | + section { | ||
3 … | + -preview_description { | ||
4 … | + } | ||
5 … | + | ||
6 … | + -message_preview { | ||
7 … | + background-color: white | ||
8 … | + | ||
9 … | + div { | ||
10 … | + border: none | ||
11 … | + header.author { | ||
12 … | + div { | ||
13 … | + section { | ||
14 … | + -timestamp { | ||
15 … | + display: none | ||
16 … | + } | ||
17 … | + } | ||
18 … | + } | ||
19 … | + } | ||
20 … | + section.action { | ||
21 … | + display: none | ||
22 … | + } | ||
23 … | + } | ||
24 … | + } | ||
25 … | + | ||
26 … | + -actions { | ||
27 … | + margin-top: 1rem | ||
28 … | + display: flex | ||
29 … | + justify-content: flex-end | ||
30 … | + | ||
31 … | + button { | ||
32 … | + margin: 0 0 0 1rem | ||
33 … | + } | ||
34 … | + } | ||
35 … | +} | ||
36 … | + |
style.css | ||
---|---|---|
@@ -338,18 +338,17 @@ | ||
338 | 338 … | /* lightbox - used in message-confirm */ |
339 | 339 … | |
340 | 340 … | .lightbox { |
341 | 341 … | overflow: auto; |
342 | - padding: 1.5em; | |
343 | - margin-top: 3em; | |
344 | - margin-bottom: 3em; | |
345 | - width: 600px; | |
342 … | + width: 650px; | |
343 … | + padding: 25px; | |
344 … | + margin: 3em 0; | |
345 … | + | |
346 … | + z-index: 2; | |
347 … | + | |
346 | 348 … | background: #f5f5f5; |
347 | - margin-left: auto; | |
348 | - margin-right: auto; | |
349 | 349 … | border: 1px solid #eee; |
350 | 350 … | border-radius: .2em; |
351 | - z-index: 2; | |
352 | 351 … | } |
353 | 352 … | |
354 | 353 … | /* searchprompt */ |
355 | 354 … |
Built with git-ssb-web