Files: 402f85029889d7cc332cef170ab52fdc69bf4ae4 / main-window.js
4417 bytesRaw
1 | var Modules = require('./modules') |
2 | var h = require('./lib/h') |
3 | var Value = require('@mmckegg/mutant/value') |
4 | var when = require('@mmckegg/mutant/when') |
5 | var computed = require('@mmckegg/mutant/computed') |
6 | var toCollection = require('@mmckegg/mutant/dict-to-collection') |
7 | var MutantDict = require('@mmckegg/mutant/dict') |
8 | var MutantMap = require('@mmckegg/mutant/map') |
9 | var watch = require('@mmckegg/mutant/watch') |
10 | |
11 | var plugs = require('patchbay/plugs') |
12 | |
13 | module.exports = function (config, ssbClient) { |
14 | var modules = Modules(config, ssbClient) |
15 | |
16 | var screenView = plugs.first(modules.plugs.screen_view) |
17 | |
18 | var searchTimer = null |
19 | var searchBox = h('input.search', { |
20 | type: 'search', |
21 | placeholder: 'word, @key, #channel' |
22 | }) |
23 | |
24 | searchBox.oninput = function () { |
25 | clearTimeout(searchTimer) |
26 | searchTimer = setTimeout(doSearch, 500) |
27 | } |
28 | |
29 | searchBox.onfocus = function () { |
30 | if (searchBox.value) { |
31 | doSearch() |
32 | } |
33 | } |
34 | |
35 | var forwardHistory = [] |
36 | var backHistory = [] |
37 | |
38 | var views = MutantDict({ |
39 | // preload tabs (and subscribe to update notifications) |
40 | '/public': screenView('/public'), |
41 | '/private': screenView('/private'), |
42 | [ssbClient.id]: screenView(ssbClient.id), |
43 | '/notifications': screenView('/notifications') |
44 | }) |
45 | |
46 | var canGoForward = Value(false) |
47 | var canGoBack = Value(false) |
48 | var currentView = Value('/public') |
49 | |
50 | watch(currentView, (view) => { |
51 | window.location.hash = `#${view}` |
52 | }) |
53 | |
54 | window.onhashchange = function (ev) { |
55 | var path = window.location.hash.substring(1) |
56 | if (path) { |
57 | setView(path) |
58 | } |
59 | } |
60 | |
61 | var mainElement = h('div.main', MutantMap(toCollection(views), (item) => { |
62 | return h('div.view', { |
63 | hidden: computed([item.key, currentView], (a, b) => a !== b) |
64 | }, [ item.value ]) |
65 | })) |
66 | |
67 | return h('MainWindow', { |
68 | classList: [ '-' + process.platform ] |
69 | }, [ |
70 | h('div.top', [ |
71 | h('span.history', [ |
72 | h('a', { |
73 | 'ev-click': goBack, |
74 | classList: [ when(canGoBack, '-active') ] |
75 | }, '<'), |
76 | h('a', { |
77 | 'ev-click': goForward, |
78 | classList: [ when(canGoForward, '-active') ] |
79 | }, '>') |
80 | ]), |
81 | h('span.nav', [ |
82 | tab('Public', '/public'), |
83 | tab('Private', '/private') |
84 | ]), |
85 | h('span.appTitle', ['Patchwork']), |
86 | h('span', [ searchBox ]), |
87 | h('span.nav', [ |
88 | tab('Profile', ssbClient.id), |
89 | tab('Mentions', '/notifications') |
90 | ]) |
91 | ]), |
92 | mainElement |
93 | ]) |
94 | |
95 | // scoped |
96 | |
97 | function tab (name, view) { |
98 | var instance = views.get(view) |
99 | return h('a', { |
100 | 'ev-click': function (ev) { |
101 | if (instance.pendingUpdates && instance.pendingUpdates() && instance.reload) { |
102 | instance.reload() |
103 | } |
104 | }, |
105 | href: `#${view}`, |
106 | classList: [ |
107 | when(selected(view), '-selected') |
108 | ] |
109 | }, [ |
110 | name, |
111 | when(instance.pendingUpdates, [ |
112 | ' (', instance.pendingUpdates, ')' |
113 | ]) |
114 | ]) |
115 | } |
116 | |
117 | function goBack () { |
118 | if (backHistory.length) { |
119 | canGoForward.set(true) |
120 | forwardHistory.push(currentView()) |
121 | currentView.set(backHistory.pop()) |
122 | canGoBack.set(backHistory.length > 0) |
123 | } |
124 | } |
125 | |
126 | function goForward () { |
127 | if (forwardHistory.length) { |
128 | backHistory.push(currentView()) |
129 | currentView.set(forwardHistory.pop()) |
130 | canGoForward.set(forwardHistory.length > 0) |
131 | canGoBack.set(true) |
132 | } |
133 | } |
134 | |
135 | function setView (view) { |
136 | if (!views.has(view)) { |
137 | views.put(view, screenView(view)) |
138 | } |
139 | if (view !== currentView()) { |
140 | canGoForward.set(false) |
141 | canGoBack.set(true) |
142 | forwardHistory.length = 0 |
143 | backHistory.push(currentView()) |
144 | currentView.set(view) |
145 | } |
146 | } |
147 | |
148 | function doSearch () { |
149 | var value = searchBox.value.trim() |
150 | if (value.startsWith('/') || value.startsWith('?') || value.startsWith('@') || value.startsWith('#') || value.startsWith('%')) { |
151 | setView(value) |
152 | } else if (value.trim()) { |
153 | setView(`?${value.trim()}`) |
154 | } else { |
155 | setView('/public') |
156 | } |
157 | } |
158 | |
159 | function selected (view) { |
160 | return computed([currentView, view], (currentView, view) => { |
161 | return currentView === view |
162 | }) |
163 | } |
164 | } |
165 | |
166 | function isSame (a, b) { |
167 | if (Array.isArray(a) && Array.isArray(b) && a.length === b.length) { |
168 | for (var i = 0; i < a.length; i++) { |
169 | if (a[i] !== b[i]) { |
170 | return false |
171 | } |
172 | } |
173 | return true |
174 | } else if (a === b) { |
175 | return true |
176 | } |
177 | } |
178 |
Built with git-ssb-web