Files: 2fc72eabdc230a249add2e43b028b0a467a317c2 / app / html / settings / accessibility.js
1500 bytesRaw
1 | const nest = require('depnest') |
2 | const { h, when } = require('mutant') |
3 | |
4 | exports.gives = nest({ |
5 | 'app.html.settings': true |
6 | }) |
7 | |
8 | exports.needs = nest({ |
9 | 'settings.obs.get': 'first' |
10 | }) |
11 | |
12 | exports.create = function (api) { |
13 | return nest({ |
14 | 'app.html.settings': accessibility |
15 | }) |
16 | |
17 | function accessibility () { |
18 | const invert = api.settings.obs.get('patchbay.accessibility.invert') |
19 | const saturation = api.settings.obs.get('patchbay.accessibility.saturation') |
20 | const brightness = api.settings.obs.get('patchbay.accessibility.brightness') |
21 | const contrast = api.settings.obs.get('patchbay.accessibility.contrast') |
22 | |
23 | return { |
24 | title: 'Accessibility', |
25 | body: h('AccessibilityStyles', [ |
26 | h('div', { 'ev-click': () => invert.set(!invert()) }, [ |
27 | h('label', 'Invert colors'), |
28 | h('i.fa', { className: when(invert, 'fa-check-square', 'fa-square-o') }) |
29 | ]), |
30 | h('div', [ |
31 | h('label', 'Saturation'), |
32 | h('input', { type: 'range', min: 0, max: 100, value: saturation, 'ev-input': ev => saturation.set(ev.target.value) }) |
33 | ]), |
34 | h('div', [ |
35 | h('label', 'Brightness'), |
36 | h('input', { type: 'range', min: 0, max: 100, value: brightness, 'ev-input': ev => brightness.set(ev.target.value) }) |
37 | ]), |
38 | h('div', [ |
39 | h('label', 'Contrast'), |
40 | h('input', { type: 'range', min: 0, max: 100, value: contrast, 'ev-input': ev => contrast.set(ev.target.value) }) |
41 | ]) |
42 | ]) |
43 | } |
44 | } |
45 | } |
46 |
Built with git-ssb-web