Files: 82c5123cafb9cea6c68aaa6559910eeef043dab0 / modules / avatar-edit.js
3098 bytesRaw
1 | var dataurl = require('dataurl') |
2 | var hyperfile = require('hyperfile') |
3 | var hypercrop = require('hypercrop') |
4 | var hyperlightbox = require('hyperlightbox') |
5 | var h = require('hyperscript') |
6 | var pull = require('pull-stream') |
7 | var getAvatar = require('ssb-avatar') |
8 | var plugs = require('../plugs') |
9 | var ref = require('ssb-ref') |
10 | |
11 | var self_id = require('../keys').id |
12 | var default_avatar = '&qjeAs8+uMXLlyovT4JnEpMwTNDx/QXHfOl2nv2u0VCM=.sha256' |
13 | |
14 | var confirm = plugs.first(exports.message_confirm = []) |
15 | var sbot_blobs_add = plugs.first(exports.sbot_blobs_add = []) |
16 | var blob_url = plugs.first(exports.blob_url = []) |
17 | var sbot_links = plugs.first(exports.sbot_links = []) |
18 | var avatar_name = plugs.first(exports.avatar_name = []) |
19 | |
20 | function crop (d, cb) { |
21 | var data |
22 | var canvas = hypercrop(h('img', {src: d})) |
23 | |
24 | return h('div.column.avatar_pic', |
25 | canvas, |
26 | //canvas.selection, |
27 | h('div.row.avatar_pic__controls', |
28 | h('button', 'okay', {onclick: function () { |
29 | cb(null, canvas.selection.toDataURL()) |
30 | }}), |
31 | h('button', 'cancel', {onclick: function () { |
32 | cb(new Error('canceled')) |
33 | }}) |
34 | ) |
35 | ) |
36 | } |
37 | |
38 | exports.avatar_edit = function (id) { |
39 | |
40 | var img = h('img', {src: blob_url(default_avatar)}) |
41 | var lb = hyperlightbox() |
42 | var name_input = h('input', {placeholder: 'rename'}) |
43 | var name = avatar_name(id) |
44 | var selected = null |
45 | |
46 | getAvatar({links: sbot_links}, self_id, id, function (err, avatar) { |
47 | if (err) return console.error(err) |
48 | //don't show user has already selected an avatar. |
49 | if(selected) return |
50 | if(ref.isBlob(avatar.image)) |
51 | img.src = blob_url(avatar.image) |
52 | }) |
53 | |
54 | return h('div.row.profile', |
55 | lb, |
56 | img, |
57 | h('div.column.profile__info', |
58 | h('strong', name), |
59 | name_input, |
60 | |
61 | hyperfile.asDataURL(function (data) { |
62 | var el = crop(data, function (err, data) { |
63 | if(data) { |
64 | img.src = data |
65 | selected = dataurl.parse(data) |
66 | } |
67 | lb.close() |
68 | }) |
69 | lb.show(el) |
70 | }), |
71 | h('button', 'update', {onclick: function () { |
72 | if(name_input.value) |
73 | name.textContent = name_input.value |
74 | |
75 | if(selected) { |
76 | pull( |
77 | pull.once(selected.data), |
78 | sbot_blobs_add(function (err, hash) { |
79 | //TODO. Alerts are EVIL. |
80 | //I use them only in a moment of weakness. |
81 | if(err) return alert(err.stack) |
82 | confirm({ |
83 | type: 'about', |
84 | about: id, |
85 | name: name_input.value || undefined, |
86 | image: { |
87 | link: hash, |
88 | size: selected.data.length, |
89 | type: selected.mimetype, |
90 | width: 512, |
91 | height: 512 |
92 | } |
93 | }) |
94 | }) |
95 | ) |
96 | } |
97 | else if(input.value) //name only |
98 | confirm({ |
99 | type: 'about', |
100 | about: id, |
101 | name: name_input.value || undefined, |
102 | }) |
103 | else |
104 | //another moment of weakness |
105 | alert('must select a name or image') |
106 | }}) |
107 | ) |
108 | ) |
109 | } |
110 | |
111 |
Built with git-ssb-web