git ssb

1
var h = require('hyperscript')
2
var pull = require('pull-stream')
3
var plugs = require('../plugs')
4
var cat = require('pull-cat')
5
6
var sbot_links2 = plugs.first(exports.sbot_links2 = [])
7
var avatar_name = plugs.first(exports.avatar_name = [])
8
var blob_url = require('../plugs').first(exports.blob_url = [])
9
10
var defaultTheme = {
11
  id: '&JFa42U6HtPm9k+s+AmpDIAoTJJI/PzoRC/J/WCfduDY=.sha256',
12
  name: 'patchbay-minimal.css'
13
}
14
15
var next = 'undefined' === typeof setImmediate ? setTimeout : setImmediate
16
17
if('undefined' !== typeof document)
18
  var link = document.head.appendChild(h('link', {rel: 'stylesheet'}))
19
20
var activeTheme
21
22
function useTheme(id) {
23
  activeTheme = id
24
  link.href = id ? blob_url(id) : ''
25
  var forms = [].slice.call(document.querySelectorAll('.themes__form'))
26
  forms.forEach(updateForm)
27
28
  var radios = [].slice.call(document.querySelectorAll('input[type=radio]'))
29
  radios.forEach(function (radio) {
30
    radio.checked = (radio.value === activeTheme)
31
  })
32
}
33
34
function useSavedTheme() {
35
  useTheme(localStorage.themeId || defaultTheme.id)
36
}
37
38
next(useSavedTheme)
39
40
function themes() {
41
  return cat([
42
    pull.values([
43
      {
44
        id: '',
45
        name: 'none',
46
        feed: ''
47
      },
48
      defaultTheme,
49
    ]),
50
    pull(
51
      sbot_links2({
52
        query: [
53
          {$filter: {rel: ['mentions', {$prefix: 'patchbay-'}]}},
54
          {$filter: {dest: {$prefix: '&'}}},
55
          {$map: {id: 'dest', feed: 'source', name: ['rel', 1]}}
56
        ],
57
        live: true,
58
        sync: false,
59
      }),
60
      pull.filter(function (link) {
61
        return /\.css$/.test(link.name)
62
      })
63
    )
64
  ])
65
}
66
67
function onRadioClick(e) {
68
  if (this.checked) useTheme(this.value)
69
}
70
71
function updateForm(form) {
72
  var same = localStorage.themeId === activeTheme
73
  form.querySelector('.themes__id').value = activeTheme
74
  form.querySelector('.themes__reset').disabled = same
75
  form.querySelector('.themes__submit').disabled = same
76
  return form
77
}
78
79
function renderTheme(link) {
80
  return h('div.theme',
81
    h('input', {type: 'radio', name: 'theme',
82
      value: link.id, onclick: onRadioClick,
83
      checked: link.id === activeTheme
84
    }),
85
    link.id ? h('a', {href: '#'+link.id}, link.name) : link.name, ' ',
86
    link.feed ? h('a', {href: '#'+link.feed}, avatar_name(link.feed)) : ''
87
  )
88
}
89
90
function insertAfter(parentNode, newNode, referenceNode) {
91
  var nextSibling = referenceNode && referenceNode.nextSibling
92
  if (nextSibling) parentNode.insertBefore(newNode, nextSibling)
93
  else parentNode.appendChild(newNode)
94
}
95
96
function theme_view() {
97
  var themeInput
98
  var themesList = h('form.themes__list')
99
  var themesPerFeed = {/* feedid: {blobid||name: theme} */}
100
101
  pull(
102
    themes(),
103
    pull.drain(function (theme) {
104
      var map = themesPerFeed[theme.feed] || (themesPerFeed[theme.feed] = {})
105
      // replace old theme
106
      var prevByName = map[theme.name]
107
      var prevById = map[theme.id]
108
      theme.el = renderTheme(theme)
109
      map[theme.name] = theme
110
      map[theme.id] = theme
111
      if (prevById) {
112
        // remove theme which is having its id reused
113
        themesList.removeChild(prevById.el)
114
        // prevById.el.appendChild(document.createTextNode(' (renamed)'))
115
        if (prevById === prevByName) {
116
          prevByName = null
117
        }
118
      }
119
      if (prevByName) {
120
        // update theme
121
        if (prevByName.id === localStorage.themeId
122
         || prevByName.id === activeTheme) {
123
          // keep old version because the user is still using it
124
          prevByName.el.appendChild(document.createTextNode(' (old)'))
125
          insertAfter(themesList, theme.el, prevByName.el)
126
        } else {
127
          // replace old version
128
          themesList.replaceChild(theme.el, prevByName.el)
129
        }
130
      } else {
131
        // show new theme
132
        themesList.appendChild(theme.el)
133
      }
134
    }, function (err) {
135
      if (err) console.error(err)
136
    })
137
  )
138
139
  return h('div.column.scroll-y', h('div',
140
    updateForm(h('form.themes__form', {onsubmit: onsubmit, onreset: onreset},
141
      themeInput = h('input.themes__id', {placeholder: 'theme id',
142
        value: link.href}), ' ',
143
      h('input.themes__reset', {type: 'reset'}), ' ',
144
      h('input.themes__submit', {type: 'submit', value: 'Save'}))),
145
      themesList
146
  ))
147
148
  function onsubmit(e) {
149
    e.preventDefault()
150
    useTheme(localStorage.themeId = themeInput.value)
151
  }
152
153
  function onreset(e) {
154
    e.preventDefault()
155
    useSavedTheme()
156
  }
157
}
158
159
exports.menu_items = function () {
160
  return h('a', {href:'#/theme'}, '/theme')
161
}
162
163
exports.screen_view = function (path) {
164
  if(path === '/theme') return theme_view()
165
}
166
167