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
            h('div', [
84
              h('label', [
85
                h('input', {
86
                  type: 'checkbox',
87
                  checked: filterFollowing,
88
                  'ev-change': (ev) => filterFollowing.set(ev.target.checked)
89
                }), ' ', i18n('Hide following messages')
90
              ])
91
            ])
92
          ])
93
        ])
94
      ])
95
    ])
96
97
    function getLocaleName (code) {
98
      var translated = i18n(code)
99
      var name = localeNameLookup[code]
100
101
      if (name !== translated && code !== translated) {
102
        return `${name} (${translated})`
103
      } else {
104
        return name
105
      }
106
    }
107
  })
108
}
109