git ssb

16+

Dominic / patchbay



Tree: 11fc4a4c131af561b454a3251544add67c283036

Files: 11fc4a4c131af561b454a3251544add67c283036 / modules / theme.js

3849 bytesRaw
1var h = require('hyperscript')
2var pull = require('pull-stream')
3var plugs = require('../plugs')
4var cat = require('pull-cat')
5
6var sbot_links2 = plugs.first(exports.sbot_links2 = [])
7var avatar_name = plugs.first(exports.avatar_name = [])
8var blob_url = require('../plugs').first(exports.blob_url = [])
9
10var defaultTheme = {
11 id: '&JFa42U6HtPm9k+s+AmpDIAoTJJI/PzoRC/J/WCfduDY=.sha256',
12 name: 'patchbay-minimal.css'
13}
14
15var next = 'undefined' === typeof setImmediate ? setTimeout : setImmediate
16
17var link = document.head.appendChild(h('link', {rel: 'stylesheet'}))
18var activeTheme
19
20function useTheme(id) {
21 activeTheme = id
22 link.href = id ? blob_url(id) : ''
23 var forms = [].slice.call(document.querySelectorAll('.themes__form'))
24 forms.forEach(updateForm)
25
26 var radios = [].slice.call(document.querySelectorAll('input[type=radio]'))
27 radios.forEach(function (radio) {
28 radio.checked = (radio.value === activeTheme)
29 })
30}
31
32function useSavedTheme() {
33 useTheme(localStorage.themeId || defaultTheme.id)
34}
35
36next(useSavedTheme)
37
38function themes() {
39 return cat([
40 pull.values([
41 {
42 id: '',
43 name: 'none',
44 feed: ''
45 },
46 defaultTheme,
47 ]),
48 pull(
49 sbot_links2({
50 query: [
51 {$filter: {rel: ['mentions', {$prefix: 'patchbay-'}, {$gt: null}]}},
52 {$filter: {dest: {$prefix: '&'}}},
53 {$map: {id: 'dest', feed: 'source', name: ['rel', 1]}}
54 ],
55 live: true,
56 sync: false,
57 }),
58 pull.filter(function (link) {
59 return /\.css$/.test(link.name)
60 })
61 )
62 ])
63}
64
65function onRadioClick(e) {
66 if (this.checked) useTheme(this.value)
67}
68
69function updateForm(form) {
70 var same = localStorage.themeId === activeTheme
71 form.querySelector('.themes__id').value = activeTheme
72 form.querySelector('.themes__reset').disabled = same
73 form.querySelector('.themes__submit').disabled = same
74 return form
75}
76
77function renderTheme(link) {
78 return h('div.theme',
79 h('input', {type: 'radio', name: 'theme',
80 value: link.id, onclick: onRadioClick,
81 checked: link.id === activeTheme
82 }),
83 link.id ? h('a', {href: '#'+link.id}, link.name) : link.name, ' ',
84 link.feed ? h('a', {href: '#'+link.feed}, avatar_name(link.feed)) : ''
85 )
86}
87
88function theme_view() {
89 var themeInput
90 var themesList = h('form.themes__list')
91 var themesByKey = {}
92
93 pull(
94 themes(),
95 pull.unique('id'),
96 pull.drain(function (theme) {
97 // replace old versions of themes in the list
98 var key = theme.feed + theme.name
99 var oldTheme = themesByKey[key]
100 theme.el = renderTheme(theme)
101 themesByKey[key] = theme
102 if (!oldTheme) {
103 themesList.appendChild(theme.el)
104 } else if (oldTheme.id === localStorage.themeId
105 || oldTheme.id === activeTheme) {
106 // show old version because the user is still using it
107 oldTheme.el.appendChild(document.createTextNode(' (old)'))
108 themesList.appendChild(theme.el)
109 } else {
110 themesList.replaceChild(theme.el, oldTheme.el)
111 }
112 }, function (err) {
113 if (err) console.error(err)
114 })
115 )
116
117 return h('div.column.scroll-y', h('div',
118 updateForm(h('form.themes__form', {onsubmit: onsubmit, onreset: onreset},
119 themeInput = h('input.themes__id', {placeholder: 'theme id',
120 value: link.href}), ' ',
121 h('input.themes__reset', {type: 'reset'}), ' ',
122 h('input.themes__submit', {type: 'submit', value: 'Save'}))),
123 themesList
124 ))
125
126 function onsubmit(e) {
127 e.preventDefault()
128 useTheme(localStorage.themeId = themeInput.value)
129 }
130
131 function onreset(e) {
132 e.preventDefault()
133 useSavedTheme()
134 }
135}
136
137exports.menu_items = function () {
138 return h('a', {href:'#/theme'}, '/theme')
139}
140
141exports.screen_view = function (path) {
142 if(path === '/theme') return theme_view()
143}
144

Built with git-ssb-web