git ssb

2+

mixmix / ticktack



Commit 49eec82c7891d936a2052acbedce9e6971b79933

Browse Files

Merge branch 'master' into address_book

mix committed on 1/24/2018, 8:58:36 PM
Parent: 81be5c1abab4ffedf042908064fb23061a893bab
Parent: ff085910be38e1563594bc54a5493521ef9128ed

Files changed

app/html/lightbox.jsadded
app/html/lightbox.mcssadded
app/index.jschanged
app/page/userShow.jschanged
app/page/userShow.mcsschanged
contact/html/block.jsadded
contact/index.jschanged
styles/mixins.jschanged
translations/en.jschanged
app/html/lightbox.jsView
@@ -1,0 +1,24 @@
1+const nest = require('depnest')
2+const { h, computed, when, Value } = require('mutant')
3+
4+exports.gives = nest('app.html.lightbox')
5+
6+exports.create = (api) => {
7+ return nest('app.html.lightbox', (content, isOpen) => {
8+
9+ if (typeof isOpen !== 'function') isOpen = Value(false)
10+
11+ const closeMe = () => isOpen.set(false)
12+
13+
14+ const lb = h('Lightbox', { className: when(isOpen, '-open', '-close'), 'ev-click': closeMe },
15+ h('div.content', {'ev-click': (ev) => ev.stopPropagation()},[
16+ content
17+ ]))
18+
19+ lb.close = closeMe
20+
21+ return lb
22+ })
23+}
24+
app/html/lightbox.mcssView
@@ -1,0 +1,47 @@
1+Lightbox {
2+ display: flex
3+ flex-direction: row
4+ position: fixed
5+ z-index: 999
6+ width: 100%
7+ height: 100%
8+ text-align: center
9+ top: 0
10+ left: 0
11+ background: rgba(0,0,0,0.8)
12+
13+ div.content {
14+ margin: auto
15+ padding: 30px
16+ border-radius: 5px
17+ $backgroundPrimary
18+ $dontSelect
19+
20+ div.dialog {
21+ div.message {
22+ $colorFontPrimary
23+ }
24+
25+ div.actions {
26+ display: flex
27+ padding-top: 15px
28+
29+ div.Button {
30+ margin: auto
31+
32+ -primary {
33+ $backgroundPrimary
34+ }
35+ }
36+ }
37+ }
38+ }
39+
40+ -open {
41+ display: flex;
42+ }
43+
44+ -close {
45+ display: none;
46+ }
47+}
app/index.jsView
@@ -7,8 +7,9 @@
77 comments: require('./html/comments'),
88 header: require('./html/header'),
99 thread: require('./html/thread'),
1010 link: require('./html/link'),
11+ lightbox: require('./html/lightbox'),
1112 blogCard: require('./html/blogCard'),
1213 blogNav: require('./html/blogNav'),
1314 scroller: require('./html/scroller'),
1415 sideNav: {
app/page/userShow.jsView
@@ -15,8 +15,9 @@
1515 'app.html.blogNav': 'first',
1616 'app.html.scroller': 'first',
1717 'app.html.sideNav': 'first',
1818 'contact.html.follow': 'first',
19+ 'contact.html.block': 'first',
1920 'feed.pull.profile': 'first',
2021 'feed.pull.rollup': 'first',
2122 'message.html.markdown': 'first',
2223 'keys.sync.id': 'first',
@@ -69,9 +70,10 @@
6970 h('div.introduction', computed(api.about.obs.description(feed), d => api.message.html.markdown(d || ''))),
7071 feed !== myId
7172 ? h('div.actions', [
7273 api.contact.html.follow(feed),
73- h('div.directMessage', directMessageButton)
74+ h('div.directMessage', directMessageButton),
75+ api.contact.html.block(feed)
7476 ])
7577 : '',
7678 ]),
7779 ]
app/page/userShow.mcssView
@@ -36,8 +36,12 @@
3636 }
3737
3838 div.directMessage {
3939 }
40+
41+ div.Block {
42+ margin-left: 1rem
43+ }
4044 }
4145 }
4246 }
4347
contact/html/block.jsView
@@ -1,0 +1,60 @@
1+const nest = require('depnest')
2+const { h, Array: MutantArray, computed, when, map, Value } = require('mutant')
3+
4+exports.gives = nest('contact.html.block')
5+
6+exports.needs = nest({
7+ 'contact.async.block': 'first',
8+ 'contact.async.unblock': 'first',
9+ 'contact.obs.blockers': 'first',
10+ 'keys.sync.id': 'first',
11+ 'translations.sync.strings': 'first',
12+ 'app.html.lightbox': 'first'
13+})
14+
15+exports.create = (api) => {
16+
17+ return nest('contact.html.block', block)
18+
19+ function block (feed) {
20+ const strings = api.translations.sync.strings()
21+ const myId = api.keys.sync.id()
22+
23+ if (feed === myId) return
24+
25+ const { blockers } = api.contact.obs
26+ const theirBlockers = blockers(feed)
27+ const youBlockThem = computed(theirBlockers, blockers => blockers.includes(myId))
28+ const { unblock, block } = api.contact.async
29+ const className = when(youBlockThem, '-blocking')
30+
31+ const isOpen = Value(false)
32+
33+ const blockAndClose = (feed) => {
34+ block(feed)
35+ isOpen.set(false)
36+ }
37+
38+ const confirmationDialog = h("div.dialog", [
39+ h("div.message",strings.userShow.action.blockConfirmationMessage),
40+ h("div.actions", [
41+ h('Button', {'ev-click': () => isOpen.set(false)}, strings.userShow.action.cancel),
42+ h('Button -primary', {'ev-click': () => blockAndClose(feed)}, strings.userShow.action.block)
43+ ])
44+ ])
45+
46+ const lb = api.app.html.lightbox(confirmationDialog, isOpen)
47+
48+ return h('Block', { className }, [
49+ when(theirBlockers.sync,
50+ when(youBlockThem,
51+ h('Button', { 'ev-click': () => unblock(feed) }, strings.userShow.action.unblock),
52+ h('Button', { 'ev-click': () => isOpen.set(true) }, strings.userShow.action.block)
53+ ),
54+ h('Button', { disabled: 'disabled' }, strings.loading )
55+ ),
56+ lb
57+ ])
58+ }
59+}
60+
contact/index.jsView
@@ -1,7 +1,8 @@
11 module.exports = {
22 html: {
33 follow: require('./html/follow'),
4+ block: require('./html/block')
45 },
56 obs: {
67 relationships: require('./obs/relationships'),
78 },
styles/mixins.jsView
@@ -180,5 +180,10 @@
180180 color: #c121dc
181181 border: 1px solid #e6e6e6
182182 border-radius: 2px
183183 }
184+
185+$dontSelect {
186+ user-select: none !important
187+ -webkit-touch-callout: none !important
188+}
184189 `
translations/en.jsView
@@ -108,9 +108,13 @@
108108 userShow: {
109109 action: {
110110 follow: 'Follow',
111111 unfollow: 'Unfollow',
112- directMessage: 'New Direct Message'
112+ directMessage: 'New Direct Message',
113+ block: 'Block',
114+ unblock: 'Unblock',
115+ blockConfirmationMessage: 'block means you will never receive message from this user',
116+ cancel: 'Cancel'
113117 },
114118 state: {
115119 friends: 'You are friends',
116120 youFollow: 'You follow them',

Built with git-ssb-web