Files: e58c4d2da8898b7d5899788712c73b904e3f7350 / app / page / settings.js
5516 bytesRaw
1 | const nest = require('depnest') |
2 | const { h, computed, when } = require('mutant') |
3 | const electron = require('electron') |
4 | const path = require('path') |
5 | const { version } = require('../../package.json') |
6 | |
7 | exports.gives = nest('app.page.settings') |
8 | |
9 | exports.needs = nest({ |
10 | 'about.html.image': 'first', |
11 | 'about.obs.name': 'first', |
12 | 'about.obs.description': 'first', |
13 | 'history.sync.push': 'first', |
14 | 'history.obs.store': 'first', |
15 | 'keys.sync.id': 'first', |
16 | 'message.html.markdown': 'first', |
17 | 'settings.sync.get': 'first', |
18 | 'settings.sync.set': 'first', |
19 | 'settings.obs.get': 'first', |
20 | 'translations.sync.strings': 'first', |
21 | 'backup.html.exportIdentityButton': 'first', |
22 | 'backup.html.importIdentityButton': 'first' |
23 | |
24 | }) |
25 | |
26 | const LANGUAGES = ['zh', 'en'] |
27 | |
28 | exports.create = (api) => { |
29 | return nest('app.page.settings', settings) |
30 | |
31 | function settings(location) { |
32 | // RESET the app when the settings are changed |
33 | api.settings.obs.get('language')(() => { |
34 | console.log('language changed, resetting view') |
35 | |
36 | // clear history back to start page |
37 | api.history.obs.store().set([ |
38 | { page: 'blogIndex' } |
39 | ]) |
40 | api.history.sync.push({ page: 'settings' }) |
41 | }) |
42 | |
43 | const webSharingMetricsOption = api.settings.obs.get('ticktack.websharemetrics') |
44 | const feed = api.keys.sync.id() |
45 | const strings = api.translations.sync.strings() |
46 | const currentLanguage = api.settings.sync.get('language') |
47 | const exportIdentityButton = api.backup.html.exportIdentityButton() |
48 | const importIdentityButton = api.backup.html.importIdentityButton() |
49 | |
50 | const editProfile = () => api.history.sync.push({ |
51 | page: 'userEdit', |
52 | feed, |
53 | callback: (err, didEdit) => { |
54 | if (err) throw new Error('Error editing profile', err) |
55 | api.history.sync.push({ page: 'settings' }) |
56 | } |
57 | }) |
58 | |
59 | return h('Page -settings', [ |
60 | h('div.content', [ |
61 | h('h1', strings.settingsPage.title), |
62 | h('section -avatar', [ |
63 | h('div.left'), |
64 | h('div.right', api.about.html.image(feed)) |
65 | ]), |
66 | h('section -name', [ |
67 | h('div.left', strings.settingsPage.section.name), |
68 | h('div.right', [ |
69 | api.about.obs.name(feed), |
70 | h('img', { |
71 | src: path.join(__dirname, '../../assets', 'edit.png'), |
72 | 'ev-click': editProfile |
73 | }) |
74 | // h('i.fa.fa-pencil', { 'ev-click': editProfile }) |
75 | ]) |
76 | ]), |
77 | h('section -introduction', [ |
78 | h('div.left', strings.settingsPage.section.introduction), |
79 | h('div.right', computed(api.about.obs.description(feed), d => api.message.html.markdown(d || ''))) |
80 | ]), |
81 | h('section -language', [ |
82 | h('div.left', strings.settingsPage.section.language), |
83 | h('div.right', LANGUAGES.map(Language)) |
84 | ]), |
85 | h('section -zoom', [ |
86 | h('div.left', strings.settingsPage.section.zoom), |
87 | h('div.right', [zoomButton(-0.1, '-'), zoomButton(+0.1, '+')]) |
88 | ]), |
89 | h('section -theme', [ |
90 | h('div.left', strings.settingsPage.section.theme), |
91 | h('div.right', ['light', 'dark'].map(Theme)) |
92 | ]), |
93 | h('section -sharing', [ |
94 | h('div.left', strings.share.settings.caption), |
95 | h('div.right', [].concat( |
96 | webSharingOption('public', strings.share.settings.publicOption), |
97 | webSharingOption('author', strings.share.settings.authorAndYouOption), |
98 | webSharingOption('private', strings.share.settings.justYouOption) |
99 | )) |
100 | ]), |
101 | h('section -version', [ |
102 | h('div.left', strings.settingsPage.section.version), |
103 | h('div.right', version) |
104 | ]), |
105 | h('h1', ""), |
106 | h('section -backup', [ |
107 | h('div.left', 'Backup'), |
108 | h('div.right', [ |
109 | exportIdentityButton, |
110 | importIdentityButton |
111 | ]) |
112 | ]) |
113 | ]) |
114 | ]) |
115 | |
116 | function Language(lang) { |
117 | const selectLang = () => api.settings.sync.set({ language: lang }) |
118 | const className = currentLanguage === lang ? '-strong' : '' |
119 | |
120 | return h('Button -language', |
121 | { |
122 | 'ev-click': () => selectLang(lang), |
123 | className |
124 | }, |
125 | strings.languages[lang] |
126 | ) |
127 | } |
128 | |
129 | function Theme(theme) { |
130 | const currentTheme = api.settings.obs.get('ticktack.theme') |
131 | const className = computed(currentTheme, t => t === theme ? '-strong' : '') |
132 | |
133 | return h('Button -language', |
134 | { |
135 | 'ev-click': () => currentTheme.set(theme), |
136 | className |
137 | }, |
138 | strings.themes[theme] |
139 | ) |
140 | } |
141 | |
142 | function zoomButton(increment, symbol) { |
143 | const { getCurrentWebContents } = electron.remote |
144 | return h('Button -zoom', |
145 | { |
146 | 'ev-click': () => { |
147 | var zoomFactor = api.settings.sync.get('ticktack.electron.zoomFactor', 1) |
148 | var newZoomFactor = zoomFactor + increment |
149 | api.settings.sync.set('ticktack.electron.zoomFactor', newZoomFactor) |
150 | getCurrentWebContents().setZoomFactor(newZoomFactor) |
151 | } |
152 | }, |
153 | symbol |
154 | ) |
155 | } |
156 | |
157 | function webSharingOption(v, label) { |
158 | let myOption = computed(webSharingMetricsOption, opt => opt === v) |
159 | |
160 | const selectWebSharingOption = () => { |
161 | webSharingMetricsOption.set(v) |
162 | } |
163 | |
164 | return h('Button -websharingmetrics', |
165 | { |
166 | 'ev-click': () => selectWebSharingOption(v), |
167 | className: when(myOption, '-strong', '') |
168 | }, |
169 | label |
170 | ) |
171 | } |
172 | } |
173 | } |
174 |
Built with git-ssb-web