git ssb

16+

Dominic / patchbay



Tree: b8b3160361f94ba38bb14788f0aee273b4d1bc99

Files: b8b3160361f94ba38bb14788f0aee273b4d1bc99 / modules_extra / theme.js

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

Built with git-ssb-web