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
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
|
'use strict'
function call(method, params) {
return m.request({
method: "POST",
url: `/api/${method}`,
body: params,
})
}
let BrowseModel = {
path: undefined,
subdirectories: [],
entries: [],
async reload(path) {
this.path = path
this.subdirectories = []
this.entries = []
let resp = await call('browse', {path: path})
this.subdirectories = resp.subdirectories
this.entries = resp.entries
},
}
let Browse = {
// Reload the model immediately, to improve responsibility.
// But we don't need to: https://mithril.js.org/route.html#preloading-data
// Also see: https://mithril.js.org/route.html#route-cancellation--blocking
oninit(vnode) {
let path = vnode.attrs.key || "/"
BrowseModel.reload(path)
},
view(vnode) {
return m('.container', {}, [
m('.header', {}, "Browse"),
m('h1', "Root"),
m('ul', BrowseModel.subdirectories.map(sd => {
const name = sd.split('/').pop()
return m('li', m(m.route.Link, {
href: `/browse/:key`,
params: {key: `${BrowseModel.path}/${sd}`},
}, name))
})),
m('.browser', {}, BrowseModel.entries.map(e => {
return m(m.route.Link, {href: `/view/${e.sha1}`},
m('img', {src: `/thumb/${e.sha1}`,
width: e.thumbW, height: e.thumbH, title: e.name}))
})),
])
},
}
let ViewModel = {
sha1: undefined,
paths: [],
tags: {},
async reload(sha1) {
this.sha1 = sha1
this.paths = []
this.tags = {}
let resp = await call('info', {sha1: sha1})
this.paths = resp.paths
this.tags = resp.tags
},
}
let View = {
oninit(vnode) {
let sha1 = vnode.attrs.key || ""
ViewModel.reload(sha1)
},
view(vnode) {
// TODO: Show more information.
return m('.container', {}, [
m('.header', {}, "View"),
m('ul', ViewModel.paths.map(sd => m('li', sd))),
ViewModel.sha1 !== undefined
? m('img', {src: `/image/${ViewModel.sha1}`})
: "No image.",
])
},
}
window.addEventListener('load', () => {
m.route(document.body, "/browse/", {
// The path doesn't need to be escaped, perhaps change that (":key...").
"/browse/": Browse,
"/browse/:key": Browse,
"/view/:key": View,
"/similar/:sha1": undefined,
"/tags": undefined,
"/tags/:space": undefined,
"/tags/:space/:tag": undefined,
})
})
|
