-
Notifications
You must be signed in to change notification settings - Fork 37
/
hnpoll.html
56 lines (56 loc) · 1.85 KB
/
hnpoll.html
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
<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="initial-scale=1.0, minimum-scale=0.25">
<style>
body {
font-family: sans-serif;
font-size: 1em;
}
.num {
vertical-align: top;
text-align: right;
padding-left: 10px;
}
tfoot {
font-weight: bold;
}
@media (prefers-color-scheme: dark) {
body {
background-color: #121212;
color: #888;
}
}
</style>
<title>HN Poll</title>
</head>
<body>
<div id=hdr></div>
<br>
<div id=app>Loading...</div>
<br>
<div>Other <a href=hnpolls.html target=_blank>polls</a></div>
<div>Source code on <a href=https://github.com/gabrielsroka/gabrielsroka.github.io/blob/master/hnpoll.html target=_blank>GitHub</a></div>
<div>Using the <a href=https://github.com/HackerNews/API target=_blank>Official Hacker News API</a></div>
<script type=module>
// see https://github.com/HackerNews/API and https://nate.org/hacker-news-location-poll
const base = 'https://hacker-news.firebaseio.com/v0/item';
const id = new URLSearchParams(location.search).get('id') || '33707669';
const r = await fetch(`${base}/${id}.json`);
const poll = await r.json();
hdr.innerHTML = poll.title.link('https://news.ycombinator.com/item?id=' + id);
var total = 0;
const parts = await Promise.all(poll.parts.map(async id => {
const r = await fetch(`${base}/${id}.json`);
const part = await r.json();
part.score--; // all parts start with a score of 1, so subtract 1 to see actual score.
if (!part.deleted) total += part.score;
return part;
}));
app.innerHTML = `<table><tbody id=tbody><tfoot><tr><td>Total<td class=num>${total}<td class=num>100%</table>`;
for (const p of parts.filter(p => !p.deleted).sort((a, b) => b.score - a.score || a.text.localeCompare(b.text))) {
tbody.innerHTML += `<tr><td>${p.text}<td class=num>${p.score}<td class=num>${Math.round(p.score / total * 100)}%`;
}
</script>
</body>
</html>