git ssb

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