Files: ecda2432805a17ed2c63337f3316d731822ad189 / modules / sheet / profiles.js
2955 bytesRaw
1 | var {h, when, map, computed, Value, lookup} = require('mutant') |
2 | var nest = require('depnest') |
3 | var catchLinks = require('../../lib/catch-links') |
4 | |
5 | exports.needs = nest({ |
6 | 'sheet.display': 'first', |
7 | 'keys.sync.id': 'first', |
8 | 'contact.obs.following': 'first', |
9 | 'profile.obs.rank': 'first', |
10 | 'about.html.image': 'first', |
11 | 'about.obs.name': 'first', |
12 | 'app.navigate': 'first', |
13 | 'intl.sync.i18n': 'first' |
14 | }) |
15 | |
16 | exports.gives = nest('sheet.profiles') |
17 | |
18 | exports.create = function (api) { |
19 | const i18n = api.intl.sync.i18n |
20 | return nest('sheet.profiles', function (ids, title) { |
21 | api.sheet.display(close => { |
22 | var currentFilter = Value() |
23 | var nameLookup = lookup(ids, (id) => { |
24 | return [id, api.about.obs.name(id)] |
25 | }) |
26 | var filteredIds = computed([ids, nameLookup, currentFilter], (ids, nameLookup, filter) => { |
27 | if (filter) { |
28 | var result = [] |
29 | for (var k in nameLookup) { |
30 | if ((nameLookup[k] && nameLookup[k].toLowerCase().includes(filter.toLowerCase())) || k === filter) { |
31 | result.push(k) |
32 | } |
33 | } |
34 | return result |
35 | } else { |
36 | return ids |
37 | } |
38 | }) |
39 | var content = h('div', { |
40 | style: { padding: '20px' } |
41 | }, [ |
42 | h('h2', { |
43 | style: { 'font-weight': 'normal' } |
44 | }, [ |
45 | title, |
46 | h('input', { |
47 | type: 'search', |
48 | placeholder: 'filter names', |
49 | 'ev-input': function (ev) { |
50 | currentFilter.set(ev.target.value) |
51 | }, |
52 | hooks: [FocusHook()], |
53 | style: { |
54 | 'float': 'right', |
55 | 'font-size': '100%' |
56 | } |
57 | }) |
58 | ]), |
59 | renderContactBlock(filteredIds) |
60 | ]) |
61 | |
62 | catchLinks(content, (href, external, anchor) => { |
63 | if (!external) { |
64 | api.app.navigate(href, anchor) |
65 | close() |
66 | } |
67 | }) |
68 | |
69 | return { |
70 | content, |
71 | footer: [ |
72 | h('button -close', { |
73 | 'ev-click': close |
74 | }, i18n('Close')) |
75 | ] |
76 | } |
77 | }) |
78 | }) |
79 | |
80 | function renderContactBlock (profiles) { |
81 | var yourId = api.keys.sync.id() |
82 | var yourFollows = api.contact.obs.following(yourId) |
83 | profiles = api.profile.obs.rank(profiles) |
84 | return [ |
85 | h('div', { |
86 | classList: 'ProfileList' |
87 | }, [ |
88 | map(profiles, (id) => { |
89 | var following = computed(yourFollows, f => f.includes(id)) |
90 | return h('a.profile', { |
91 | href: id, |
92 | classList: [ |
93 | when(following, '-following') |
94 | ] |
95 | }, [ |
96 | h('div.avatar', [api.about.html.image(id)]), |
97 | h('div.main', [ |
98 | h('div.name', [ api.about.obs.name(id) ]) |
99 | ]) |
100 | ]) |
101 | }, { idle: true, maxTime: 2 }) |
102 | ]) |
103 | ] |
104 | } |
105 | } |
106 | |
107 | function FocusHook () { |
108 | return function (element) { |
109 | setTimeout(() => { |
110 | element.focus() |
111 | element.select() |
112 | }, 5) |
113 | } |
114 | } |
115 |
Built with git-ssb-web