git ssb

1
var { h, when } = require('mutant')
2
var nest = require('depnest')
3
4
var themeNames = Object.keys(require('../../../../styles'))
5
6
exports.needs = nest({
7
  'settings.obs.get': 'first',
8
  'settings.sync.set': 'first',
9
  'intl.sync.locales': 'first',
10
  'intl.sync.i18n': 'first',
11
  'intl.sync.localeNames': 'first'
12
})
13
14
exports.gives = nest('page.html.render')
15
16
exports.create = function (api) {
17
  return nest('page.html.render', function channel (path) {
18
    if (path !== '/settings') return
19
    const i18n = api.intl.sync.i18n
20
21
    const locales = api.intl.sync.locales()
22
    const localeNameLookup = api.intl.sync.localeNames()
23
    const fontSizes = ['8px', '10px', '12px', '14px', '16px', '18px', '20px']
24
25
    const theme = api.settings.obs.get('patchwork.theme', 'light')
26
    const lang = api.settings.obs.get('patchwork.lang', '')
27
    const fontSize = api.settings.obs.get('patchwork.fontSize', '')
28
    const filterFollowing = api.settings.obs.get('filters.following')
29
    const onlySubscribed = api.settings.obs.get('filters.onlySubscribed')
30
31
    var prepend = [
32
      h('PageHeading', [
33
        h('h1', [
34
          h('strong', i18n('Settings'))
35
        ])
36
      ])
37
    ]
38
39
    return h('Scroller', { style: { overflow: 'auto' } }, [
40
      h('div.wrapper', [
41
        h('section.prepend', prepend),
42
        h('section.content', [
43
44
          h('section', [
45
            h('h2', i18n('Theme')),
46
            h('select', {
47
              style: { 'font-size': '120%' },
48
              value: theme,
49
              'ev-change': (ev) => theme.set(ev.target.value)
50
            }, [
51
              themeNames.map(name => h('option', {value: name}, [name]))
52
            ])
53
          ]),
54
55
          h('section', [
56
            h('h2', i18n('Language')),
57
            h('select', {
58
              style: { 'font-size': '120%' },
59
              value: lang,
60
              'ev-change': (ev) => lang.set(ev.target.value)
61
            }, [
62
              h('option', {value: ''}, i18n('Default')),
63
              locales.map(code => h('option', {value: code}, [
64
                '[', code, '] ', getLocaleName(code)
65
              ]))
66
            ])
67
          ]),
68
69
          h('section', [
70
            h('h2', i18n('Font Size')),
71
            h('select', {
72
              style: { 'font-size': '120%' },
73
              value: fontSize,
74
              'ev-change': (ev) => fontSize.set(ev.target.value)
75
            }, [
76
              h('option', {value: ''}, i18n('Default')),
77
              fontSizes.map(size => h('option', {value: size}, size))
78
            ])
79
          ]),
80
81
          h('section', [
82
            h('h2', i18n('Public Feed Options')),
83
84
            h('div', [
85
              checkbox(filterFollowing, {
86
                label: i18n('Hide following messages')
87
              })
88
            ]),
89
90
            h('div', [
91
              checkbox(onlySubscribed, {
92
                label: i18n('Only include posts from subscribed channels')
93
              })
94
            ])
95
          ])
96
        ])
97
      ])
98
    ])
99
100
    function getLocaleName (code) {
101
      var translated = i18n(code)
102
      var name = localeNameLookup[code]
103
104
      if (name !== translated && code !== translated) {
105
        return `${name} (${translated})`
106
      } else {
107
        return name
108
      }
109
    }
110
  })
111
}
112
113
function checkbox (param, {label}) {
114
  return h('label', [
115
    h('input', {
116
      type: 'checkbox',
117
      checked: param,
118
      'ev-change': (ev) => param.set(ev.target.checked)
119
    }), ' ', label
120
  ])
121
}
122