Files: e875995b3285440296b82b811ebcba99145cfd56 / views.js
10324 bytesRaw
1 | var pull = require('pull-stream') |
2 | var sbot = require('./scuttlebot') |
3 | var hyperscroll = require('hyperscroll') |
4 | var stream = require('hyperloadmore/stream') |
5 | var h = require('hyperscript') |
6 | var ref = require('ssb-ref') |
7 | var next = require('pull-next-query') |
8 | |
9 | var render = require('./render').render |
10 | |
11 | var config = require('./config')() |
12 | var human = require('human-time') |
13 | var tools = require('./tools') |
14 | var id = require('./keys').id |
15 | var avatar = require('./avatar') |
16 | var compose = require('./compose') |
17 | |
18 | var keyPage = function () { |
19 | var screen = document.getElementById('screen') |
20 | |
21 | var importKey = h('textarea.import', {placeholder: 'Import a new public/private key', name: 'textarea', style: 'width: 97%; height: 100px;'}) |
22 | |
23 | var content = h('div.content', |
24 | h('div.message#key', |
25 | h('h1', 'Your Key'), |
26 | h('p', {innerHTML: 'Your public/private key is: <pre><code>' + localStorage[config.caps.shs + '/secret'] + '</code></pre>'}, |
27 | h('button.btn', {onclick: function (e){ |
28 | localStorage[config.caps.shs +'/secret'] = '' |
29 | alert('Your public/private key has been deleted') |
30 | e.preventDefault() |
31 | location.hash = "" |
32 | location.reload() |
33 | }}, 'Delete Key') |
34 | ), |
35 | h('hr'), |
36 | h('form', |
37 | importKey, |
38 | h('button.btn', {onclick: function (e){ |
39 | if(importKey.value) { |
40 | localStorage[config.caps.shs + '/secret'] = importKey.value.replace(/\s+/g, ' ') |
41 | e.preventDefault() |
42 | alert('Your public/private key has been updated') |
43 | } |
44 | location.hash = "" |
45 | location.reload() |
46 | }}, 'Import key'), |
47 | ) |
48 | ) |
49 | ) |
50 | screen.appendChild(hyperscroll(content)) |
51 | } |
52 | |
53 | function getMessage (src) { |
54 | |
55 | var content = h('div.content') |
56 | var screen = document.getElementById('screen') |
57 | |
58 | screen.appendChild(hyperscroll(content)) |
59 | |
60 | sbot.get(src, function (err, data) { |
61 | if (err) { |
62 | var message = h('div.message', 'Missing message!') |
63 | content.appendChild(message) |
64 | } |
65 | if (data) { |
66 | var message = {} |
67 | |
68 | message.value = data |
69 | message.key = src |
70 | |
71 | if (content.firstChild) { |
72 | content.insertBefore(render(message), content.firstChild) |
73 | } else { |
74 | content.appendChild(render(message)) |
75 | } |
76 | } |
77 | }) |
78 | } |
79 | |
80 | |
81 | function userStream (src) { |
82 | |
83 | var screen = document.getElementById('screen') |
84 | var content = h('div.content') |
85 | |
86 | screen.appendChild(hyperscroll(content)) |
87 | |
88 | function createStream (opts) { |
89 | return pull( |
90 | next(sbot.query, opts, ['value', 'timestamp']), |
91 | pull.map(function (msg) { |
92 | return render(msg) |
93 | }) |
94 | ) |
95 | } |
96 | |
97 | pull( |
98 | createStream({ |
99 | limit: 100, |
100 | reverse: true, |
101 | live: false, |
102 | query: [{$filter: { value: { author: src}}}] |
103 | }), |
104 | stream.bottom(content) |
105 | ) |
106 | |
107 | pull( |
108 | createStream({ |
109 | limit: 100, |
110 | old: false, |
111 | live: true, |
112 | query: [{$filter: { value: {author: src}}}] |
113 | }), |
114 | stream.top(content) |
115 | ) |
116 | |
117 | |
118 | var profile = h('div.content#profile', h('div.message', h('div.messageContent'))) |
119 | |
120 | if (screen.firstChild.firstChild) { |
121 | screen.firstChild.insertBefore(profile, screen.firstChild.firstChild) |
122 | } else { |
123 | screen.firstChild.appendChild(profile) |
124 | } |
125 | |
126 | var name = avatar.name(src) |
127 | |
128 | var editname = h('span', |
129 | avatar.name(src), |
130 | h('button.btn', 'New name', { |
131 | onclick: function () { |
132 | var nameput = h('input', {placeholder: name.textContent}) |
133 | var nameedit = |
134 | h('span', nameput, |
135 | h('button.btn', 'Preview', { |
136 | onclick: function () { |
137 | if (nameput.value[0] != '@') |
138 | tobename = nameput.value |
139 | else |
140 | tobename = nameput.value.substring(1, 100) |
141 | var newname = h('span', h('a', {href: '#' + src}, '@' + tobename), h('button.btn', 'Publish', { |
142 | onclick: function () { |
143 | var donename = h('span', h('a', {href: '#' + src}, '@' + tobename)) |
144 | sbot.publish({type: 'about', about: src, name: tobename}) |
145 | localStorage[src + 'name'] = tobename |
146 | newname.parentNode.replaceChild(donename, newname) |
147 | } |
148 | })) |
149 | nameedit.parentNode.replaceChild(newname, nameedit) |
150 | } |
151 | }) |
152 | ) |
153 | editname.parentNode.replaceChild(nameedit, editname) |
154 | } |
155 | }) |
156 | ) |
157 | var editimage = h('span', |
158 | h('button.btn', 'New image', { |
159 | onclick: function () { |
160 | var upload = |
161 | h('span', |
162 | hyperfile.asDataURL(function (data) { |
163 | if(data) { |
164 | //img.src = data |
165 | var _data = dataurl.parse(data) |
166 | pull( |
167 | pull.once(_data.data), |
168 | sbot.addblob(function (err, hash) { |
169 | if(err) return alert(err.stack) |
170 | selected = { |
171 | link: hash, |
172 | size: _data.data.length, |
173 | type: _data.mimetype |
174 | } |
175 | }) |
176 | ) |
177 | } |
178 | }), |
179 | h('button.btn', 'Preview image', { |
180 | onclick: function() { |
181 | if (selected) { |
182 | console.log(selected) |
183 | var oldImage = document.getElementById('profileImage') |
184 | var newImage = h('span.avatar--medium', h('img', {src: config.blobsUrl + selected.link})) |
185 | var publish = h('button.btn', 'Publish image', { |
186 | onclick: function () { |
187 | sbot.publish({ |
188 | type: 'about', |
189 | about: src, |
190 | image: selected |
191 | }, function (err, published) { |
192 | console.log(published) |
193 | }) |
194 | } |
195 | }) |
196 | upload.parentNode.replaceChild(publish, upload) |
197 | oldImage.parentNode.replaceChild(newImage, oldImage) |
198 | } |
199 | /*if(selected) { |
200 | api.message_confirm({ |
201 | type: 'about', |
202 | about: id, |
203 | image: selected |
204 | }) |
205 | } else { alert('select an image before hitting preview')}*/ |
206 | } |
207 | }) |
208 | ) |
209 | editimage.parentNode.replaceChild(upload, editimage) |
210 | } |
211 | }) |
212 | ) |
213 | |
214 | var avatars = h('div.avatars', |
215 | h('a', {href: '#' + src}, |
216 | h('span.avatar--medium#profileImage', avatar.image(src)), |
217 | editname, |
218 | h('br'), |
219 | editimage |
220 | ) |
221 | ) |
222 | pull( |
223 | sbot.query({query: [{$filter: { value: { author: src}}}], limit: 1}), |
224 | pull.drain(function (msg) { |
225 | var howlong = h('span', h('br'), ' arrived ', human(new Date(msg.value.timestamp))) |
226 | avatars.appendChild(howlong) |
227 | avatars.appendChild(h('hr')) |
228 | }) |
229 | ) |
230 | |
231 | |
232 | var buttons = h('div.buttons') |
233 | |
234 | profile.firstChild.firstChild.appendChild(avatars) |
235 | profile.firstChild.firstChild.appendChild(buttons) |
236 | |
237 | var writeMessage = h('button.btn', 'Public message ', avatar.name(src), { |
238 | onclick: function () { |
239 | opts = {} |
240 | opts.type = 'post' |
241 | opts.mentions = '[' + name.textContent + '](' + src + ')' |
242 | var composer = h('div#composer', h('div.message', h('div.messageContent', compose(opts)))) |
243 | profile.appendChild(composer) |
244 | } |
245 | }) |
246 | |
247 | var writePrivate = h('button.btn', 'Private message ', avatar.name(src), { |
248 | onclick: function () { |
249 | opts = {} |
250 | opts.type = 'post' |
251 | opts.mentions = '[' + name.textContent + '](' + src + ')' |
252 | opts.recps = [src, id] |
253 | var composer = h('div#composer', h('div.message', h('div.messageContent', compose(opts)))) |
254 | profile.appendChild(composer) |
255 | } |
256 | }) |
257 | |
258 | buttons.appendChild(tools.follow(src)) |
259 | |
260 | buttons.appendChild(h('button.btn', 'Generate follows', { |
261 | onclick: function () { |
262 | profile.firstChild.firstChild.appendChild(tools.getFollowing(src)) |
263 | profile.firstChild.firstChild.appendChild(tools.getFollowers(src)) |
264 | } |
265 | })) |
266 | |
267 | buttons.appendChild(h('button.btn', 'Generate blocks', { |
268 | onclick: function () { |
269 | profile.firstChild.firstChild.appendChild(tools.getBlocks(src)) |
270 | profile.firstChild.firstChild.appendChild(tools.getBlocked(src)) |
271 | } |
272 | })) |
273 | buttons.appendChild(h('hr')) |
274 | buttons.appendChild(tools.mute(src)) |
275 | buttons.appendChild(writeMessage) |
276 | buttons.appendChild(writePrivate) |
277 | buttons.appendChild(h('a', {href: '#wall/' + src}, h('button.btn', avatar.name(src), "'s wall"))) |
278 | } |
279 | |
280 | function mentionsStream (src) { |
281 | |
282 | var screen = document.getElementById('screen') |
283 | var content = h('div.content') |
284 | |
285 | screen.appendChild(hyperscroll(content)) |
286 | |
287 | function createStream (opts) { |
288 | return pull( |
289 | next(sbot.backlinks, opts, ['value', 'timestamp']), |
290 | pull.map(function (msg) { |
291 | return render(msg) |
292 | }) |
293 | ) |
294 | } |
295 | |
296 | pull( |
297 | createStream({ |
298 | limit: 100, |
299 | reverse: true, |
300 | index: 'DTA', |
301 | live: false, |
302 | query: [{$filter: {dest: src}}] |
303 | }), |
304 | stream.bottom(content) |
305 | ) |
306 | |
307 | pull( |
308 | createStream({ |
309 | limit: 100, |
310 | old: false, |
311 | index: 'DTA', |
312 | live: true, |
313 | query: [{$filter: {dest: src}}] |
314 | }), |
315 | stream.top(content) |
316 | ) |
317 | } |
318 | |
319 | function everythingStream () { |
320 | |
321 | var screen = document.getElementById('screen') |
322 | var content = h('div.content') |
323 | |
324 | screen.appendChild(hyperscroll(content)) |
325 | |
326 | function createStream (opts) { |
327 | return pull( |
328 | next(sbot.query, opts, ['value', 'timestamp']), |
329 | pull.map(function (msg) { |
330 | if (msg.value) { |
331 | return render(msg) |
332 | } |
333 | }) |
334 | ) |
335 | } |
336 | |
337 | pull( |
338 | createStream({ |
339 | limit: 250, |
340 | reverse: true, |
341 | live: false, |
342 | query: [{$filter: { value: { timestamp: { $gt: 0 }}}}] |
343 | }), |
344 | stream.bottom(content) |
345 | ) |
346 | |
347 | pull( |
348 | createStream({ |
349 | limit: 250, |
350 | old: false, |
351 | live: true, |
352 | query: [{$filter: { value: { timestamp: { $gt: 0 }}}}] |
353 | }), |
354 | stream.top(content) |
355 | ) |
356 | } |
357 | |
358 | module.exports = function () { |
359 | var src = window.location.hash.substring(1) |
360 | |
361 | if (ref.isFeed(src)) { |
362 | userStream(src) |
363 | } else if (ref.isMsg(src)) { |
364 | getMessage(src) |
365 | } else if ((src.substring(0, 5) == 'wall/') && (ref.isFeed(src.substring(5)))) { |
366 | mentionsStream(src.substring(5)) |
367 | } else if (ref.isMsg(src)) { |
368 | messageStream() |
369 | } else if (src == 'key') { |
370 | keyPage() |
371 | } else { |
372 | everythingStream() |
373 | } |
374 | |
375 | } |
376 |
Built with git-ssb-web