Files: 3a294e357e15360aded899e2d83d79b4e4c584ea / modules / page / html / render / settings.js
2818 bytesRaw
1 | var { h, computed } = require('mutant') |
2 | var nest = require('depnest') |
3 | var appRoot = require('app-root-path') |
4 | |
5 | var themeNames = Object.keys(require('../../../../styles')) |
6 | |
7 | exports.needs = nest({ |
8 | 'settings.obs.get': 'first', |
9 | 'settings.sync.set': 'first', |
10 | 'intl.sync.locales': 'first', |
11 | 'intl.sync.i18n': 'first', |
12 | 'intl.sync.localeNames': 'first' |
13 | }) |
14 | |
15 | exports.gives = nest('page.html.render') |
16 | |
17 | exports.create = function (api) { |
18 | return nest('page.html.render', function channel (path) { |
19 | if (path !== '/settings') return |
20 | const i18n = api.intl.sync.i18n |
21 | |
22 | const currentTheme = api.settings.obs.get('patchwork.theme') |
23 | const currentLang = api.settings.obs.get('patchwork.lang') |
24 | const locales = api.intl.sync.locales() |
25 | const localeNameLookup = api.intl.sync.localeNames() |
26 | const filterFollowing = api.settings.obs.get('filters.following') |
27 | |
28 | var prepend = [ |
29 | h('PageHeading', [ |
30 | h('h1', [ |
31 | h('strong', i18n('Settings')) |
32 | ]), |
33 | ]) |
34 | ] |
35 | |
36 | return h('Scroller', { style: { overflow: 'auto' } }, [ |
37 | h('div.wrapper', [ |
38 | h('section.prepend', prepend), |
39 | h('section.content', [ |
40 | |
41 | h('section', [ |
42 | h('h2', i18n('Theme')), |
43 | h('select', { |
44 | style: { |
45 | 'font-size': '120%' |
46 | }, |
47 | value: currentTheme, |
48 | 'ev-change': (ev) => api.settings.sync.set({ |
49 | patchwork: {theme: ev.target.value} |
50 | }) |
51 | }, [ |
52 | themeNames.map(name => h('option', {value: name}, [name])) |
53 | ]) |
54 | ]), |
55 | |
56 | h('section', [ |
57 | h('h2', i18n('Language')), |
58 | h('select', { |
59 | style: { |
60 | 'font-size': '120%' |
61 | }, |
62 | value: currentLang, |
63 | 'ev-change': (ev) => api.settings.sync.set({ |
64 | patchwork: {lang: ev.target.value} |
65 | }) |
66 | }, [ |
67 | locales.map(code => h('option', {value: code}, [ |
68 | code.toUpperCase(), ' - ', getLocaleName(code) |
69 | ])) |
70 | ]) |
71 | ]), |
72 | |
73 | h('section', [ |
74 | h('h2', i18n('Filters')), |
75 | h('label', [ |
76 | h('input', { |
77 | type: 'checkbox', |
78 | checked: filterFollowing, |
79 | 'ev-change': (ev) => api.settings.sync.set({ |
80 | filters: {following: ev.target.checked} |
81 | }) |
82 | }), i18n(' Hide following messages') |
83 | ]) |
84 | ]) |
85 | ]) |
86 | ]) |
87 | ]) |
88 | |
89 | function getLocaleName (code) { |
90 | var translated = i18n(code) |
91 | var name = localeNameLookup[code] |
92 | |
93 | if (name !== translated && code !== translated) { |
94 | return `${name} (${translated})` |
95 | } else { |
96 | return name |
97 | } |
98 | } |
99 | }) |
100 | } |
101 |
Built with git-ssb-web