git ssb

1
'use strict'
2
var dataurl = require('dataurl-')
3
var hyperfile = require('hyperfile')
4
var hypercrop = require('hypercrop')
5
var hyperlightbox = require('hyperlightbox')
6
var h = require('hyperscript')
7
var pull = require('pull-stream')
8
var getAvatar = require('ssb-avatar')
9
var plugs = require('../plugs')
10
var ref = require('ssb-ref')
11
var visualize = require('visualize-buffer')
12
var self_id = require('../keys').id
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
21
function crop (d, cb) {
22
  var data
23
  var canvas = hypercrop(h('img', {src: d}))
24
25
  return h('div.column.avatar_pic',
26
    canvas,
27
    //canvas.selection,
28
    h('div.row.avatar_pic__controls',
29
      h('button', 'okay', {onclick: function () {
30
        cb(null, canvas.selection.toDataURL())
31
      }}),
32
      h('button', 'cancel', {onclick: function () {
33
        cb(new Error('canceled'))
34
      }})
35
    )
36
  )
37
}
38
39
exports.needs = {
40
  message_confirm: 'first',
41
  sbot_blobs_add: 'first',
42
  blob_url: 'first',
43
  sbot_links: 'first',
44
  avatar_name: 'first'
45
}
46
47
exports.gives = 'avatar_edit'
48
49
exports.create = function (api) {
50
  return function (id) {
51
52
    var img = visualize(new Buffer(id.substring(1), 'base64'), 256)
53
    img.classList.add('avatar')
54
55
    var lb = hyperlightbox()
56
    var name_input = h('input', {placeholder: 'rename'})
57
    var name = api.avatar_name(id)
58
    var selected = null, selected_data = null
59
60
    getAvatar({links: api.sbot_links}, self_id, id, function (err, avatar) {
61
      if (err) return console.error(err)
62
      //don't show user has already selected an avatar.
63
      if(selected) return
64
      if(ref.isBlob(avatar.image))
65
        img.src = api.blob_url(avatar.image)
66
    })
67
68
    var also_pictured = h('div.profile__alsopicturedas.wrap')
69
70
    pull(
71
      api.sbot_links({dest: id, rel: 'about', values: true}),
72
      pull.map(function (e) {
73
        return e.value.content.image
74
      }),
75
      pull.filter(function (e) {
76
        return e && 'string' == typeof e.link
77
      }),
78
      pull.unique('link'),
79
      pull.drain(function (image) {
80
        also_pictured.appendChild(
81
          h('a', {href:'#', onclick: function (ev) {
82
              ev.stopPropagation()
83
              ev.preventDefault()
84
              selected = image
85
              img.src = api.blob_url(image.link || image)
86
            }},
87
            h('img.avatar', {src: api.blob_url(image)})
88
          )
89
        )
90
      })
91
    )
92
93
    return h('div.row.profile',
94
      lb,
95
      img,
96
      h('div.column.profile__info',
97
        h('strong', name),
98
        name_input,
99
100
        hyperfile.asDataURL(function (data) {
101
          var el = crop(data, function (err, data) {
102
            if(data) {
103
              img.src = data
104
              var _data = dataurl.parse(data)
105
              pull(
106
                pull.once(_data.data),
107
                api.sbot_blobs_add(function (err, hash) {
108
                  //TODO. Alerts are EVIL.
109
                  //I use them only in a moment of weakness.
110
111
                  if(err) return alert(err.stack)
112
                  selected = {
113
                    link: hash,
114
                    size: _data.data.length,
115
                    type: _data.mimetype,
116
                    width: 512,
117
                    height: 512
118
                  }
119
120
                })
121
              )
122
            }
123
            lb.close()
124
          })
125
          lb.show(el)
126
        }),
127
        h('button', 'update', {onclick: function () {
128
          if(name_input.value)
129
            name.textContent = name_input.value
130
131
          if(selected)
132
            api.message_confirm({
133
              type: 'about',
134
              about: id,
135
              name: name_input.value || undefined,
136
              image: selected
137
            })
138
          else if(name_input.value) //name only
139
            api.message_confirm({
140
              type: 'about',
141
              about: id,
142
              name: name_input.value || undefined,
143
            })
144
          else
145
            //another moment of weakness
146
            alert('must select a name or image')
147
        }}),
148
      also_pictured
149
      )
150
    )
151
  }
152
}
153