git ssb

16+

Dominic / patchbay



Tree: c1a1dc7a8dc3f88bd242e418cb5715798385f4e4

Files: c1a1dc7a8dc3f88bd242e418cb5715798385f4e4 / app / sync / initialise / styles.js

1736 bytesRaw
1const nest = require('depnest')
2const compileCss = require('micro-css')
3const { h, computed } = require('mutant')
4const get = require('lodash/get')
5
6exports.gives = nest('app.sync.initialise')
7
8exports.needs = nest({
9 'styles.css': 'reduce',
10 'settings.obs.get': 'first'
11})
12
13exports.create = function (api) {
14 return nest('app.sync.initialise', styles)
15
16 function styles () {
17 const css = values(api.styles.css()).join('\n')
18 const custom = api.settings.obs.get('patchbay.customStyles')
19 const accessibility = api.settings.obs.get('patchbay.accessibility')
20
21 document.head.appendChild(
22 h('style', { innerHTML: css })
23 )
24
25 document.head.appendChild(
26 h('style', { innerHTML: computed(custom, compileCss) })
27 )
28 document.head.appendChild(
29 h('style', {
30 innerHTML: computed(accessibility, a11y => {
31 return compileCss(accessibilityMcss(a11y))
32 })
33 })
34 )
35 }
36}
37
38// ////////////////////////////
39// The parts that feed into this are in app/html/settings/accessibility.js
40
41function accessibilityMcss (settings) {
42 const invert = get(settings, 'invert')
43 const saturation = get(settings, 'saturation', 100)
44 const brightness = get(settings, 'brightness', 100)
45 const contrast = get(settings, 'contrast', 100)
46
47 const css = `
48body {
49 filter: ${invert ? 'invert()' : ''} saturate(${saturation}%) brightness(${brightness}%) contrast(${contrast}%)
50
51 (img) {
52 filter: ${invert ? 'invert()' : ''}
53 }
54 (video) {
55 filter: ${invert ? 'invert()' : ''}
56 }
57 (button) {
58 filter: ${invert ? 'invert()' : ''}
59 }
60}
61`
62 return css
63}
64// ////////////////////////////
65
66function values (object) {
67 const keys = Object.keys(object)
68 return keys.map(k => object[k])
69}
70

Built with git-ssb-web