git ssb

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', { 
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
      ])
90
    ])
91
92
    function Language (lang) {
93
      const selectLang = () => api.settings.sync.set({ language: lang })
94
      const className = currentLanguage === lang ? '-strong' : '' 
95
96
      return h('Button -language', 
97
        { 
98
          'ev-click': () => selectLang(lang), 
99
          className 
100
        }, 
101
        strings.languages[lang]
102
      )
103
    }
104
105
    function zoomButton (increment, symbol) {
106
      const { getCurrentWebContents } = electron.remote
107
      return h('Button -zoom', 
108
        { 
109
          'ev-click': () => {
110
            var zoomFactor = api.settings.sync.get('ticktack.electron.zoomFactor', 1)
111
            var newZoomFactor = zoomFactor + increment
112
            var zoomFactor = api.settings.sync.set('ticktack.electron.zoomFactor', newZoomFactor)
113
            getCurrentWebContents().setZoomFactor(newZoomFactor)
114
          }
115
        }, 
116
        symbol
117
      )
118
    }
119
  }
120
}
121
122