Public
HTTP
jdan-emojiexploder.web.val.run
June 15, 2024
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
/** @jsxImportSource npm:hono@3/jsx */
import { codepoints } from "https://esm.town/v/jdan/codepoints";
import { emojiByCodepoints } from "https://esm.town/v/jdan/emojiByCodepoints";
import { nameOfCodepoint } from "https://esm.town/v/jdan/nameOfUnicode";
import { Hono } from "npm:hono";
const app = new Hono();
app.get("/", async (c) => {
return c.html(
<div>
<h1>Emoji exploder</h1>
<div>Enter an emoji and see what it's composed of</div>
<form action="/emoji" method="get">
<input type="text" name="emoji" /> <input type="submit" />
</form>
<div>Some cool examples</div>
<ul>
<li>
πΆβπ«οΈ β{" "}
<a href="https://jdan-emojiexploder.web.val.run/emoji?emoji=%F0%9F%98%B6%E2%80%8D%F0%9F%8C%AB%EF%B8%8F">
face in clouds
</a>
</li>
<li>
π©πΌβπ€βπ¨πΏ β{" "}
<a href="https://jdan-emojiexploder.web.val.run/emoji?emoji=%F0%9F%91%A9%F0%9F%8F%BC%E2%80%8D%F0%9F%A4%9D%E2%80%8D%F0%9F%91%A8%F0%9F%8F%BF">
Woman and Man Holding Hands: Light Skin Tone, Medium Skin Tone
</a>
</li>
<li>
π΄σ §σ ’σ ·σ ¬σ ³σ Ώ β{" "}
<a href="https://jdan-emojiexploder.web.val.run/emoji?emoji=%F0%9F%8F%B4%F3%A0%81%A7%F3%A0%81%A2%F3%A0%81%B7%F3%A0%81%AC%F3%A0%81%B3%F3%A0%81%BF">
flag: Wales
</a>
</li>
<li>
π©π»ββ€οΈβπβπ©π½ β{" "}
<a href="https://jdan-emojiexploder.web.val.run/emoji?emoji=%F0%9F%91%A9%F0%9F%8F%BB%E2%80%8D%E2%9D%A4%EF%B8%8F%E2%80%8D%F0%9F%92%8B%E2%80%8D%F0%9F%91%A9%F0%9F%8F%BD">
Kiss: Woman, Light Skin Tone, Woman, Medium Skin Tone
</a>
</li>
<li>
βοΈ β{" "}
<a href="https://jdan-emojiexploder.web.val.run/emoji?emoji=%E2%86%94%EF%B8%8F">
left-right arrow
</a>
</li>
<li>
π΅πΈ β{" "}
<a href="https://jdan-emojiexploder.web.val.run/emoji?emoji=%F0%9F%87%B5%F0%9F%87%B8">
flag: Palestinian Territories
</a>
</li>
</ul>
<a href="https://www.val.town/v/jdan/emojiExploder">Fork on Val Town</a>
</div>,
);
});
app.get("/emoji", async (c) => {
const emoji = c.req.query("emoji");
const emojiCodepoints = codepoints(emoji);
const byCodepoints = await emojiByCodepoints;
const parts = await Promise.all(emojiCodepoints.map(async (cp) => {
const name = await nameOfCodepoint(cp);
return (
<li>
{cp} {String.fromCodePoint(parseInt(cp, 16))} {name}
</li>
);
}));
return c.html(
<div>
<form action="/emoji" method="get">
<input type="text" name="emoji" /> <input type="submit" />
</form>
<h1>{emoji}</h1>
<div>
Description: <strong>{byCodepoints[emojiCodepoints.join("-")]?.description}</strong>
</div>
<div>
Codepoints: <strong>{emojiCodepoints.length}</strong>
</div>
<div>{codepoints(emoji).join("-")}</div>
<ol>
{parts}
</ol>
<a href="https://www.val.town/v/jdan/emojiExploder">Fork on Val Town</a>
</div>,
);
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
June 15, 2024
I would send a PR but my version comments out a line of code that works on your version https://www.val.town/v/stevekrouse/emojiExploder#L91
Any tips for me to fix it to make it PR-able? You are correct that my blob storage is load-bearing!
Two ideas that basically amount to the same thing:
Instead of getting it from your blob storage, make it a fetch that gets it from a public source like I do here https://www.val.town/v/stevekrouse/zwjEmoji#L6
If there is no public endpoint, expose an endpoint that let's people get only that route from your blob storage and then use that url to get the data in your function so it's accessible to others