Files: cabc473e5efae9784e813e91373c35c0b8c5635f / modules / page / html / render / settings.js
2774 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 | }) |
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 currentTheme = api.settings.obs.get('patchwork.theme') |
22 | const currentLang = api.settings.obs.get('patchwork.lang') |
23 | const langNames = api.intl.sync.locales() |
24 | const filterFollowing = api.settings.obs.get('filters.following') |
25 | |
26 | var prepend = [ |
27 | h('PageHeading', [ |
28 | h('h1', [ |
29 | h('strong', i18n('Settings')) |
30 | ]), |
31 | ]) |
32 | ] |
33 | |
34 | return h('Scroller', { style: { overflow: 'auto' } }, [ |
35 | h('div.wrapper', [ |
36 | h('section.prepend', prepend), |
37 | h('section.content', [ |
38 | h('section', [ |
39 | h('h2', i18n('Theme')), |
40 | computed(currentTheme, currentTheme => { |
41 | return themeNames.map(name => { |
42 | const style = currentTheme == name |
43 | ? { 'margin-right': '1rem', 'border-color': 'teal' } |
44 | : { 'margin-right': '1rem' } |
45 | |
46 | return h('button', { |
47 | 'ev-click': () => api.settings.sync.set({ |
48 | patchwork: {theme: name} |
49 | }), |
50 | style |
51 | }, name) |
52 | }) |
53 | }, [ |
54 | themeNames.map(name => h('option', {value: name}, [name])) |
55 | ]) |
56 | ]), |
57 | h('section', [ |
58 | h('h2', i18n('Language')), |
59 | computed(currentLang, currentLang => { |
60 | return langNames.map(lang => { |
61 | const style = currentLang == lang |
62 | ? { 'margin-right': '1rem', 'border-color': 'teal' } |
63 | : { 'margin-right': '1rem' } |
64 | |
65 | return h('button', { |
66 | 'ev-click': () => api.settings.sync.set({ |
67 | patchwork: {lang: lang} |
68 | }), |
69 | style |
70 | }, lang) |
71 | }) |
72 | }) |
73 | ]), |
74 | h('section', [ |
75 | h('h2', i18n('Filters')), |
76 | h('label', [ |
77 | h('input', { |
78 | type: 'checkbox', |
79 | checked: filterFollowing, |
80 | 'ev-change': (ev) => api.settings.sync.set({ |
81 | filters: {following: ev.target.checked} |
82 | }) |
83 | }), i18n(' Hide following messages') |
84 | ]) |
85 | ]) |
86 | ]) |
87 | ]) |
88 | ]) |
89 | }) |
90 | } |
91 |
Built with git-ssb-web