-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.html
52 lines (46 loc) · 1.61 KB
/
index.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
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/normalize.css">
<script src="https://cdn.jsdelivr.net/pyodide/v0.25.1/full/pyodide.js"></script>
</head>
<body>
<script type="text/javascript">
async function main() {
let pyodide = await loadPyodide();
await pyodide.loadPackage("micropip");
const micropip = pyodide.pyimport("micropip");
await micropip.install("pillow");
await pyodide.runPythonAsync(`
# absolutely cursed setup, but whatever
from pyodide.http import pyfetch
import io, base64
base_url = "https://flxb2.github.io/arrival_logograms/"
for i in ["logogram.py", "circularStroke.py", "tendril.py"]:
response = await pyfetch(base_url + i)
with open(i, "wb") as f:
f.write(await response.bytes())
from logogram import logogram
img = logogram((2048,2048), 10, 10, 100, (1,1))
image_io = io.BytesIO()
img.save(image_io, 'PNG')
imgB64 = 'data:image/png;base64,' + base64.b64encode(image_io.getvalue()).decode('UTF-8')
`)
document.getElementById("img").src = pyodide.globals.get('imgB64')
}
main();
</script>
<div class="container">
<div class="row">
<div style="text-align: center;">
<img id="img" style="max-width: 80%; box-sizing: border-box;" />
</div>
</div>
<div class="row">
<div style="text-align: center;">
<button onclick="main()">Generate</button>
</div>
</div>
</body>
</html>