| lib/depject/page/html/render/settings.jsView |
|---|
| 1 | | -const { h } = require('mutant') |
| 1 … | +const { computed, h, map, Value, watch } = require('mutant') |
| 2 | 2 … | const nest = require('depnest') |
| 3 | 3 … | const packageInfo = require('../../../../../package.json') |
| 4 … | +const ExpanderHook = require('../../../../expander-hook') |
| 4 | 5 … | |
| 5 | 6 … | const themeNames = Object.keys(require('../../../../../styles')) |
| 7 … | +const electron = require('electron') |
| 6 | 8 … | |
| 7 | 9 … | exports.needs = nest({ |
| 8 | 10 … | 'settings.obs.get': 'first', |
| 9 | 11 … | 'intl.sync.locales': 'first', |
| 12 | 14 … | }) |
| 13 | 15 … | |
| 14 | 16 … | exports.gives = nest('page.html.render') |
| 15 | 17 … | |
| 18 … | +let availableDictionaries = Value([]) |
| 19 … | + |
| 20 … | +electron.ipcRenderer.on('setAvailableDictionaries', (ev, langs) => { |
| 21 … | + availableDictionaries.set(langs) |
| 22 … | +}) |
| 23 … | + |
| 16 | 24 … | exports.create = function (api) { |
| 17 | 25 … | return nest('page.html.render', function channel (path) { |
| 18 | 26 … | if (path !== '/settings') return |
| 19 | 27 … | const i18n = api.intl.sync.i18n |
| 30 | 38 … | ] |
| 31 | 39 … | |
| 32 | 40 … | const theme = api.settings.obs.get('patchwork.theme', 'light') |
| 33 | 41 … | const lang = api.settings.obs.get('patchwork.lang', '') |
| 42 … | + const spellcheckLangs = api.settings.obs.get('patchwork.spellcheckLangs', ['en-GB']) |
| 43 … | + const enableSpellCheck = api.settings.obs.get('patchwork.enableSpellCheck', true) |
| 44 … | + const spellcheckParams = computed([spellcheckLangs, enableSpellCheck], (langs, enabled) => ({ langs, enabled })) |
| 45 … | + watch(spellcheckParams, (params) => { |
| 46 … | + electron.ipcRenderer.invoke('setSpellcheckLangs', params) |
| 47 … | + }) |
| 34 | 48 … | const fontSize = api.settings.obs.get('patchwork.fontSize', '') |
| 35 | 49 … | const fontFamily = api.settings.obs.get('patchwork.fontFamily', '') |
| 36 | 50 … | const includeParticipating = api.settings.obs.get('patchwork.includeParticipating', false) |
| 37 | 51 … | const autoDeleteBlocked = api.settings.obs.get('patchwork.autoDeleteBlocked', false) |
| 65 | 79 … | ]) |
| 66 | 80 … | ]), |
| 67 | 81 … | |
| 68 | 82 … | h('section', [ |
| 69 | | - h('h2', i18n('Language')), |
| 83 … | + h('h2', i18n('Interface Language')), |
| 70 | 84 … | h('select', { |
| 71 | 85 … | style: { 'font-size': '120%' }, |
| 72 | 86 … | value: lang, |
| 73 | 87 … | 'ev-change': (ev) => lang.set(ev.target.value) |
| 79 | 93 … | ]) |
| 80 | 94 … | ]), |
| 81 | 95 … | |
| 82 | 96 … | h('section', [ |
| 97 … | + h('h2', i18n('Spellchecking')), |
| 98 … | + h('div', [ |
| 99 … | + checkbox(enableSpellCheck, { |
| 100 … | + label: i18n('Enable Spellchecking') |
| 101 … | + }) |
| 102 … | + ]), |
| 103 … | + h('h3', i18n('Languages to check for (select multiple)')), |
| 104 … | + h('select', { |
| 105 … | + disabled: computed(enableSpellCheck, (b) => !b), |
| 106 … | + multiple: true, |
| 107 … | + size: 10, |
| 108 … | + style: { 'font-size': '120%' }, |
| 109 … | + hooks: [SpellcheckChangeHook(spellcheckLangs)] |
| 110 … | + }, [ |
| 111 … | + map(availableDictionaries, (code) => h('option', { |
| 112 … | + value: code, |
| 113 … | + selected: spellcheckLangs().indexOf(code) !== -1, |
| 114 … | + }, [ |
| 115 … | + '[', code, '] ', getLocaleName(code) |
| 116 … | + ])) |
| 117 … | + ]) |
| 118 … | + ]), |
| 119 … | + |
| 120 … | + h('section', [ |
| 83 | 121 … | h('h2', i18n('Font Size')), |
| 84 | 122 … | h('select', { |
| 85 | 123 … | style: { 'font-size': '120%' }, |
| 86 | 124 … | value: fontSize, |
| 98 | 136 … | value: fontFamily, |
| 99 | 137 … | 'ev-change': (ev) => fontFamily.set(ev.target.value) |
| 100 | 138 … | }, [ |
| 101 | 139 … | h('option', { value: '' }, i18n('Default')), |
| 102 | | - fontFamilies.map(family => h('option', { value: family }, family)) |
| 140 … | + fontFamilies.map(family => h('option', { value: family, }, family)) |
| 103 | 141 … | ]) |
| 104 | 142 … | ]), |
| 105 | 143 … | h('h2', i18n('Notification Options')), |
| 106 | 144 … | |
| 158 | 196 … | 'ev-change': (ev) => param.set(ev.target.checked) |
| 159 | 197 … | }), ' ', label |
| 160 | 198 … | ]) |
| 161 | 199 … | } |
| 200 … | + |
| 201 … | +function SpellcheckChangeHook (spellcheckLangs) { |
| 202 … | + return function (element) { |
| 203 … | + element.addEventListener('change', (ev) => { |
| 204 … | + const newLangs = [] |
| 205 … | + for (const c of ev.target.children) { |
| 206 … | + if (c.selected) { |
| 207 … | + newLangs.push(c.value) |
| 208 … | + } |
| 209 … | + } |
| 210 … | + spellcheckLangs.set(newLangs) |
| 211 … | + }) |
| 212 … | + } |
| 213 … | +} |