Public
HTTP (deprecated)
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
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
/** @jsxImportSource npm:react **/
import { blob } from "https://esm.town/v/std/blob";
import { renderToString } from "npm:react-dom/server";
export default async function(req: Request): Promise<Response> {
const spell_list = await blob.list();
const spells: any[] = [];
for (const spell of spell_list) {
const spell_data = await blob.getJSON(spell.key);
const codePoint = String.fromCodePoint(parseInt(spell_data["emoji"].replace("U+", ""), 16));
spells.push({ key: spell.key, url: spell_data["url"], emoji: codePoint });
}
return new Response(
renderToString(
<html>
<head>
<title>mathemagic!</title>
<style>{CSS}</style>
</head>
<body>
<h1>
Choose your spell!
</h1>
<div>
{spells.map(obj => (
<h2 key={obj.key}>
{obj.emoji}
<button>
<a href={obj.url} style={{ textDecoration: "none" }}>
{obj.key}
</a>
</button>
{obj.emoji}
</h2>
))}
</div>
</body>
</html>,
),
{ headers: { "Content-Type": "text/html" } },
);
}
const CSS = `
body {
text-align: center;
font-family: cursive;
margin-top: 50px;
}
button {
font-size:30px;
font-family: cursive;
margin-top: 20px;
}
`;