git ssb

0+

alanz / patchwork



forked from Matt McKegg / patchwork

Commit 755b0f1ae26a1af4371659e3f3a45b9cf6c690c0

Browse Files

style private, message confirm box, and mention suggestions

Matt McKegg committed on 11/1/2016, 1:38:05 AM
Parent: c3bad31f482772bb2f1cb0a4e5b4f99071a9a625

Files changed

modules/message.jschanged
modules/private.jschanged
modules/message-confirm.jsadded
styles/message.mcsschanged
styles/patchbay-tweaks.csschanged
styles/message-confirm.mcssadded
modules/message.jsView
@@ -1,5 +1,6 @@
11 var h = require('../lib/h')
2+var when = require('@mmckegg/mutant/when')
23
34 var plugs = require('patchbay/plugs')
45 var message_content = plugs.first(exports.message_content = [])
56 var message_content_mini = plugs.first(exports.message_content_mini = [])
@@ -68,14 +69,14 @@
6869 ]),
6970 h('div.meta', message_meta(msg))
7071 ]),
7172 h('section', [el]),
72- h('footer', [
73+ when(msg.key, h('footer', [
7374 h('div.actions', [
7475 message_action(msg),
7576 h('a', {href: '#' + msg.key}, 'Reply')
7677 ])
77- ])
78+ ]))
7879 ])
7980
8081 // ); hyperscript does not seem to set attributes correctly.
8182 element.setAttribute('tabindex', '0')
modules/private.jsView
@@ -7,8 +7,9 @@
77 var message_unbox = plugs.first(exports.message_unbox = [])
88 var get_id = plugs.first(exports.get_id = [])
99 var avatar_image_link = plugs.first(exports.avatar_image_link = [])
1010 var update_cache = plugs.first(exports.update_cache = [])
11+var h = require('../lib/h')
1112
1213 exports.screen_view = function (path, sbot) {
1314 if (path === '/private') {
1415 var id = get_id()
@@ -43,12 +44,14 @@
4344 }
4445 }
4546
4647 exports.message_meta = function (msg) {
47- if(msg.value.content.recps || msg.value.private) {
48- return h('span.row', 'PRIVATE', map(msg.value.content.recps, function (id) {
49- return avatar_image_link('string' == typeof id ? id : id.link, 'thumbnail')
50- }))
48+ if (msg.value.content.recps || msg.value.private) {
49+ return h('span.private', [
50+ map(msg.value.content.recps, function (id) {
51+ return avatar_image_link(typeof id === 'string' ? id : id.link, 'thumbnail')
52+ })
53+ ])
5154 }
5255 }
5356
5457 function unbox () {
modules/message-confirm.jsView
@@ -1,0 +1,51 @@
1+var lightbox = require('hyperlightbox')
2+var h = require('../lib/h')
3+var plugs = require('patchbay/plugs')
4+var get_id = plugs.first(exports.get_id = [])
5+var publish = plugs.first(exports.sbot_publish = [])
6+var message_render = plugs.first(exports.message_render = [])
7+
8+exports.message_confirm = function (content, cb) {
9+ cb = cb || function () {}
10+
11+ var lb = lightbox()
12+ document.body.appendChild(lb)
13+
14+ var msg = {
15+ value: {
16+ author: get_id(),
17+ previous: null,
18+ sequence: null,
19+ timestamp: Date.now(),
20+ content: content
21+ }
22+ }
23+
24+ var okay = h('button', {
25+ 'ev-click': function () {
26+ lb.remove()
27+ publish(content, cb)
28+ },
29+ 'ev-keydown': function (ev) {
30+ if (ev.keyCode === 27) cancel.click() // escape
31+ }
32+ }, [
33+ 'okay'
34+ ])
35+
36+ var cancel = h('button', {'ev-click': function () {
37+ lb.remove()
38+ cb(null)
39+ }}, [
40+ 'Cancel'
41+ ])
42+
43+ lb.show(h('MessageConfirm', [
44+ h('section', [
45+ message_render(msg)
46+ ]),
47+ h('footer', [okay, cancel])
48+ ]))
49+
50+ okay.focus()
51+}
styles/message.mcssView
@@ -63,8 +63,40 @@
6363 border-radius: 10px;
6464 display: inline-block;
6565 vertical-align: top;
6666 }
67+
68+ span.private {
69+ display: inline-block;
70+ margin: -3px -3px -3px 4px;
71+ border: 4px solid #525050;
72+ position: relative;
73+
74+ a {
75+ display: inline-block
76+
77+ img {
78+ margin: 0
79+ vertical-align: bottom
80+ border: none
81+ }
82+ }
83+
84+ :after {
85+ content: 'private';
86+ position: absolute;
87+ background: #525050;
88+ bottom: 0;
89+ left: -1px;
90+ font-size: 10px;
91+ padding: 2px 4px 0 2px;
92+ border-top-right-radius: 5px;
93+ color: white;
94+ font-weight: bold;
95+ pointer-events: none;
96+ white-space: nowrap
97+ }
98+ }
6799 }
68100 }
69101
70102 section {
styles/patchbay-tweaks.cssView
@@ -27,4 +27,32 @@
2727
2828 div.compose textarea {
2929 transition: height 0.1s
3030 }
31+
32+div.lightbox {
33+ box-shadow: #5f5f5f 1px 2px 100px;
34+ bottom: inherit !important;
35+ overflow: hidden !important;
36+}
37+
38+div.suggest-box {
39+ background: #333;
40+}
41+
42+div.suggest-box ul {
43+ left: 390px;
44+ top: 87px;
45+ position: fixed;
46+ padding: 5px;
47+ border-radius: 3px;
48+ background: #fdfdfd;
49+ border: 1px solid #CCC;
50+}
51+
52+div.suggest-box li {
53+ padding: 3px;
54+}
55+
56+div.suggest-box strong {
57+ font-weight: normal;
58+}
styles/message-confirm.mcssView
@@ -1,0 +1,18 @@
1+MessageConfirm {
2+ section {
3+ max-height: 80vh;
4+ overflow: auto;
5+ margin: -20px;
6+ padding: 20px;
7+ margin-bottom: 0;
8+ }
9+ footer {
10+ text-align: right;
11+ background: #e2e2e2;
12+ margin: 0px -20px -20px;
13+ padding: 5px;
14+ border-top: 1px solid #d6d6d6;
15+ position: relative;
16+ box-shadow: 0 0 6px rgba(51, 51, 51, 0.47);
17+ }
18+}

Built with git-ssb-web