git ssb

1
var nest = require('depnest')
2
var ref = require('ssb-ref')
3
var {h, when, computed, map, send, dictToCollection, resolve} = require('mutant')
4
var extend = require('xtend')
5
6
exports.needs = nest({
7
  'about.obs': {
8
    name: 'first',
9
    description: 'first',
10
    names: 'first',
11
    images: 'first',
12
    color: 'first'
13
  },
14
  'blob.sync.url': 'first',
15
  'blob.html.input': 'first',
16
  'message.async.publish': 'first',
17
  'message.html.markdown': 'first',
18
  'about.html.image': 'first',
19
  'feed.html.rollup': 'first',
20
  'feed.pull.profile': 'first',
21
  'sbot.async.publish': 'first',
22
  'keys.sync.id': 'first',
23
  'sheet.display': 'first',
24
  'profile.obs.rank': 'first',
25
  'profile.sheet.edit': 'first',
26
  'app.navigate': 'first',
27
  'contact.obs': {
28
    followers: 'first',
29
    following: 'first',
30
    blockers: 'first'
31
  },
32
  'contact.async.block': 'first',
33
  'contact.async.unblock': 'first',
34
  'intl.sync.i18n': 'first',
35
})
36
exports.gives = nest('page.html.render')
37
38
exports.create = function (api) {
39
  const i18n = api.intl.sync.i18n
40
  return nest('page.html.render', function profile (id) {
41
    if (!ref.isFeed(id)) return
42
43
    var name = api.about.obs.name(id)
44
    var description = api.about.obs.description(id)
45
    var yourId = api.keys.sync.id()
46
    var yourFollows = api.contact.obs.following(yourId)
47
    var rawFollowers = api.contact.obs.followers(id)
48
    var rawFollowing = api.contact.obs.following(id)
49
    var friendsLoaded = computed([rawFollowers.sync, rawFollowing.sync], (...x) => x.every(Boolean))
50
    var { block, unblock } = api.contact.async
51
52
    var friends = computed([rawFollowing, rawFollowers], (following, followers) => {
53
      return Array.from(following).filter(follow => followers.includes(follow))
54
    })
55
56
    var following = computed([rawFollowing, friends], (following, friends) => {
57
      return Array.from(following).filter(follow => !friends.includes(follow))
58
    })
59
60
    var followers = computed([rawFollowers, friends], (followers, friends) => {
61
      return Array.from(followers).filter(follower => !friends.includes(follower))
62
    })
63
64
    var isFriends = computed([friends], function (friends) {
65
      return friends.includes(yourId)
66
    })
67
68
    var followsYou = computed([following], function (followsYou) {
69
      return followsYou.includes(yourId)
70
    })
71
72
    var youFollow = computed([yourFollows], function (youFollow) {
73
      return youFollow.includes(id)
74
    })
75
76
    var blockers = api.contact.obs.blockers(id)
77
    var youBlock = computed(blockers, function(blockers) {
78
      return blockers.includes(yourId)
79
    })
80
81
    var names = api.about.obs.names(id)
82
    var images = api.about.obs.images(id)
83
84
    var namePicker = h('div', {className: 'Picker'}, [
85
      map(dictToCollection(names), (item) => {
86
        var isSelf = computed(item.value, (ids) => ids.includes(id))
87
        var isAssigned = computed(item.value, (ids) => ids.includes(yourId))
88
        return h('a.name', {
89
          'ev-click': () => {
90
            if (!isAssigned()) {
91
              assignName(id, resolve(item.key))
92
            }
93
          },
94
          href: '#',
95
          classList: [
96
            when(isSelf, '-self'),
97
            when(isAssigned, '-assigned')
98
          ],
99
          title: nameList(when(isSelf, i18n('Self Assigned'), i18n('Assigned By')), item.value)
100
        }, [
101
          item.key
102
        ])
103
      }),
104
      h('a -add', {
105
        'ev-click': () => {
106
          rename(id)
107
        },
108
        href: '#',
109
      }, ['+'])
110
    ])
111
112
    var imagePicker = h('div', {className: 'Picker'}, [
113
      map(dictToCollection(images), (item) => {
114
        var isSelf = computed(item.value, (ids) => ids.includes(id))
115
        var isAssigned = computed(item.value, (ids) => ids.includes(yourId))
116
        return h('a.name', {
117
          'ev-click': () => {
118
            if (!isAssigned()) {
119
              assignImage(id, resolve(item.key))
120
            }
121
          },
122
          href: '#',
123
          classList: [
124
            when(isSelf, '-self'),
125
            when(isAssigned, '-assigned')
126
          ],
127
          title: nameList(when(isSelf, i18n('Self Assigned'), i18n('Assigned By')), item.value)
128
        }, [
129
          h('img', {
130
            className: 'Avatar',
131
            style: { 'background-color': api.about.obs.color(id) },
132
            src: computed(item.key, api.blob.sync.url)
133
          })
134
        ])
135
      }),
136
      h('span.add', [
137
        api.blob.html.input(file => {
138
          assignImage(id, file.link)
139
        }, {
140
          accept: 'image/*',
141
          resize: { width: 500, height: 500 }
142
        })
143
      ])
144
    ])
145
146
    var prepend = h('header', {className: 'ProfileHeader'}, [
147
      h('div.image', api.about.html.image(id)),
148
      h('div.main', [
149
        h('div.title', [
150
          h('h1', [name]),
151
          h('div.meta', [
152
            when(id === yourId, [
153
              h('button', {'ev-click': api.profile.sheet.edit}, i18n('Edit Your Profile'))
154
            ], [
155
              when(youBlock, [
156
                h('a.ToggleButton.-unblocking', {
157
                  'href': '#',
158
                  'title': i18n('Click to unblock'),
159
                  'ev-click': () => unblock(id, console.log)
160
                }, i18n('Blocked'))
161
              ], [
162
                when(youFollow,
163
                  h('a.ToggleButton.-unsubscribe', {
164
                    'href': '#',
165
                    'title': i18n('Click to unfollow'),
166
                    'ev-click': send(unfollow, id)
167
                  }, when(isFriends, i18n('Friends'), i18n('Following'))),
168
                  h('a.ToggleButton.-subscribe', {
169
                    'href': '#',
170
                    'ev-click': send(follow, id)
171
                  }, when(followsYou, i18n('Follow Back'), i18n('Follow')))
172
                ),
173
                h('a.ToggleButton.-blocking', {
174
                  'href': '#',
175
                  'title': i18n('Block'),
176
                  'ev-click': () => block(id, console.log)
177
                }, i18n('Block'))
178
              ])
179
            ])
180
          ])
181
        ]),
182
        h('section -description', [
183
          computed(description, (text) => {
184
            if (typeof text === 'string') {
185
              return api.message.html.markdown(text)
186
            }
187
          })
188
        ]),
189
        h('section', [ namePicker, imagePicker ])
190
      ])
191
    ])
192
193
    var feedView = api.feed.html.rollup(api.feed.pull.profile(id), {
194
      prepend,
195
      displayFilter: (msg) => msg.value.author === id,
196
      rootFilter: (msg) => !youBlock(),
197
      bumpFilter: (msg) => msg.value.author === id
198
    })
199
200
    var container = h('div', {className: 'SplitView'}, [
201
      h('div.main', [
202
        feedView
203
      ]),
204
      h('div.side.-right', [
205
        h('button PrivateMessageButton', {'ev-click': () => api.app.navigate('/private', {compose: {to: id}})}, i18n('Send Private Message')),
206
        when(friendsLoaded,
207
          h('div', [
208
            renderContactBlock(i18n('Friends'), friends, yourFollows),
209
            renderContactBlock(i18n('Followers'), followers, yourFollows),
210
            renderContactBlock(i18n('Following'), following, yourFollows)
211
          ]),
212
          h('div', {className: 'Loading'})
213
        )
214
      ])
215
    ])
216
217
    // refresh feed (to hide all posts) when blocked
218
    youBlock(feedView.reload)
219
220
    container.pendingUpdates = feedView.pendingUpdates
221
    container.reload = feedView.reload
222
    return container
223
  })
224
225
  function renderContactBlock (title, profiles, yourFollows) {
226
    profiles = api.profile.obs.rank(profiles)
227
    return [
228
      when(computed(profiles, x => x.length), h('h2', title)),
229
      h('div', {
230
        classList: 'ProfileList'
231
      }, [
232
        map(profiles, (id) => {
233
          var following = computed(yourFollows, f => f.includes(id))
234
          return h('a.profile', {
235
            href: id,
236
            classList: [
237
              when(following, '-following')
238
            ]
239
          }, [
240
            h('div.avatar', [api.about.html.image(id)]),
241
            h('div.main', [
242
              h('div.name', [ api.about.obs.name(id) ])
243
            ])
244
          ])
245
        }, {
246
          maxTime: 5,
247
          idle: true
248
        })
249
      ])
250
    ]
251
  }
252
253
  function follow (id) {
254
    api.sbot.async.publish({
255
      type: 'contact',
256
      contact: id,
257
      following: true
258
    })
259
  }
260
261
  function unfollow (id) {
262
    api.sbot.async.publish({
263
      type: 'contact',
264
      contact: id,
265
      following: false
266
    })
267
  }
268
269
  function assignImage (id, image) {
270
    api.message.async.publish({
271
      type: 'about',
272
      about: id,
273
      image
274
    })
275
  }
276
277
  function assignName (id, name) {
278
    api.message.async.publish({
279
      type: 'about',
280
      about: id,
281
      name
282
    })
283
  }
284
285
  function rename (id) {
286
    api.sheet.display(close => {
287
      var currentName = api.about.obs.name(id)
288
      var input = h('input', {
289
        style: {'font-size': '150%'},
290
        value: currentName()
291
      })
292
      setTimeout(() => {
293
        input.focus()
294
        input.select()
295
      }, 5)
296
      return {
297
        content: h('div', {
298
          style: {
299
            padding: '20px',
300
            'text-align': 'center'
301
          }
302
        }, [
303
          h('h2', {
304
            style: {
305
              'font-weight': 'normal'
306
            }
307
          }, [i18n('What whould you like to call '), h('strong', [currentName]), '?']),
308
          input
309
        ]),
310
        footer: [
311
          h('button -save', {
312
            'ev-click': () => {
313
              if (input.value.trim() && input.value !== currentName()) {
314
                // no confirm
315
                api.sbot.async.publish({
316
                  type: 'about',
317
                  about: id,
318
                  name: input.value.trim()
319
                })
320
              }
321
              close()
322
            }
323
          }, i18n('Confirm')),
324
          h('button -cancel', {
325
            'ev-click': close
326
          }, i18n('Cancel'))
327
        ]
328
      }
329
    })
330
  }
331
332
  function nameList (prefix, ids) {
333
    var items = map(ids, api.about.obs.name)
334
    return computed([prefix, items], (prefix, names) => {
335
      return (prefix ? (prefix + '\n') : '') + names.map((n) => `- ${n}`).join('\n')
336
    })
337
  }
338
}
339