Files: 26eb63b836af90470db4e83dd22d952a85c08061 / app / page / settings.js
3586 bytesRaw
1 | const nest = require('depnest') |
2 | const { h, computed } = require('mutant') |
3 | const electron = require('electron') |
4 | const path = require('path') |
5 | |
6 | exports.gives = nest('app.page.settings') |
7 | |
8 | exports.needs = nest({ |
9 | 'about.html.image': 'first', |
10 | 'about.obs.name': 'first', |
11 | 'about.obs.description': 'first', |
12 | 'history.sync.push': 'first', |
13 | 'history.obs.store': 'first', |
14 | 'keys.sync.id': 'first', |
15 | 'message.html.markdown': 'first', |
16 | 'settings.sync.get': 'first', |
17 | 'settings.sync.set': 'first', |
18 | 'settings.obs.get': 'first', |
19 | 'translations.sync.strings': 'first', |
20 | }) |
21 | |
22 | const LANGUAGES = ['zh', 'en'] |
23 | |
24 | // TODO - this needs moving somewhere upstream |
25 | // const DEFAULT_SETTINGS = { |
26 | // onboarded: false, |
27 | // language: 'zh' |
28 | // } |
29 | |
30 | exports.create = (api) => { |
31 | return nest('app.page.settings', settings) |
32 | |
33 | function settings (location) { |
34 | |
35 | // RESET the app when the settings are changed |
36 | api.settings.obs.get('language')(() => { |
37 | console.log('language changed, resetting view') |
38 | |
39 | // clear history back to start page |
40 | api.history.obs.store().set([ |
41 | { page: 'blogIndex' } |
42 | ]) |
43 | api.history.sync.push({page: 'settings'}) |
44 | }) |
45 | |
46 | const feed = api.keys.sync.id() |
47 | const strings = api.translations.sync.strings() |
48 | const currentLanguage = api.settings.sync.get('language') |
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', { src: path.join(__dirname, '../../assets', 'edit.png') }) |
71 | // h('i.fa.fa-pencil', { 'ev-click': editProfile }) |
72 | ]), |
73 | ]), |
74 | h('section -introduction', [ |
75 | h('div.left', strings.settingsPage.section.introduction), |
76 | h('div.right', computed(api.about.obs.description(feed), d => api.message.html.markdown(d || ''))) |
77 | ]), |
78 | h('section -language', [ |
79 | h('div.left', strings.settingsPage.section.language), |
80 | h('div.right', LANGUAGES.map(Language)) |
81 | ]), |
82 | h('section -zoom', [ |
83 | h('div.left', strings.settingsPage.section.zoom), |
84 | h('div.right', [ zoomButton(-0.1, '-'), zoomButton(+0.1, '+') ]) |
85 | ]), |
86 | ]) |
87 | ]) |
88 | |
89 | function Language (lang) { |
90 | const selectLang = () => api.settings.sync.set({ language: lang }) |
91 | const className = currentLanguage === lang ? '-strong' : '' |
92 | |
93 | return h('Button -language', |
94 | { |
95 | 'ev-click': () => selectLang(lang), |
96 | className |
97 | }, |
98 | strings.languages[lang] |
99 | ) |
100 | } |
101 | |
102 | function zoomButton (increment, symbol) { |
103 | const { getCurrentWebContents } = electron.remote |
104 | return h('Button -language', |
105 | { |
106 | 'ev-click': () => { |
107 | var zoomFactor = api.settings.sync.get('ticktack.electron.zoomFactor', 1) |
108 | var newZoomFactor = zoomFactor + increment |
109 | var zoomFactor = api.settings.sync.set('ticktack.electron.zoomFactor', newZoomFactor) |
110 | getCurrentWebContents().setZoomFactor(newZoomFactor) |
111 | } |
112 | }, |
113 | symbol |
114 | ) |
115 | } |
116 | } |
117 | } |
118 | |
119 |
Built with git-ssb-web