-
Notifications
You must be signed in to change notification settings - Fork 8
/
render.js
66 lines (55 loc) · 1.51 KB
/
render.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
const hyperHTML = require('hyperhtml/cjs');
const asyncRenderView = (viewName, wire, model) =>
import(`../../shared/view/${viewName}.js`).then(({default: renderFn}) => renderFn(wire, model));
const view = {
about: (wire, model) => asyncRenderView('about', wire, model),
summary: (wire, model) => asyncRenderView('summary', wire, model),
item: (wire, model) => asyncRenderView('item', wire, model),
comment: (wire, model) => asyncRenderView('comment', wire, model),
user: (wire, model) => asyncRenderView('user', wire, model),
next: (wire, model) => asyncRenderView('next', wire, model)
};
const wire = {
main: hyperHTML.bind(document.querySelector('main')),
user: hyperHTML.wire(),
next: hyperHTML.wire()
};
module.exports = {
main: (model) => wire.main`${model}`,
item: (model) => view.item(
hyperHTML.wire(model),
model
),
comment: (model) => view.comment(
hyperHTML.wire(model),
model
),
about: (model) => view.about(
wire.main,
model
),
summary: (model) => view.summary(
hyperHTML.wire(model),
model
),
// it could've been like the server-side one
// here showing off other patterns/potentials
header: (story) => [].forEach.call(
document.querySelectorAll('header a'),
a => {
a.classList[
~a.getAttribute('href')
.indexOf(`/${story}`) ?
'add' : 'remove'
]('selected');
}
),
user: (model) => view.user(
wire.user,
model
),
next: (model) => view.next(
wire.next,
model
)
};