Skip to content

Commit 5dc05f5

Browse files
WebReflectionWebReflection
committed
Added MicroPython example
1 parent 7dca579 commit 5dc05f5

File tree

2 files changed

+125
-0
lines changed

2 files changed

+125
-0
lines changed

‎test/micropython.html

+69
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>MicroPython Terminal</title>
7+
<script src="../mini-coi.js"></script>
8+
<script type="module" src="https://cdn.jsdelivr.net/npm/@pyscript/core@0.4.23/dist/core.js"></script>
9+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@pyscript/core@0.4.23/dist/core.css">
10+
<style>
11+
html, body {
12+
box-sizing: border-box;
13+
margin: 0;
14+
padding: 0;
15+
}
16+
.xterm {
17+
padding: 0;
18+
width: 100vw;
19+
height: 100vh;
20+
width: 100dvw;
21+
height: 100dvh;
22+
}
23+
#paste {
24+
position: fixed;
25+
top: 8px;
26+
right: 24px;
27+
width: 32px;
28+
height: 32px;
29+
}
30+
</style>
31+
<script type="module">
32+
let type = location.search.slice(1);
33+
if (type !== 'py') type = 'mpy';
34+
document.body.innerHTML = `
35+
<script type="${type}" worker terminal>
36+
import code
37+
code.interact()
38+
<\x2fscript>
39+
<button id="paste" title="paste code in prompt">📝</button>
40+
`;
41+
42+
const inputLines = (terminal, readline, code) => {
43+
let queue = Promise.resolve();
44+
for (const line of code.split(/(?:\r|\n|\r\n)/)) {
45+
queue = queue.then(async () => {
46+
terminal.paste(`${line}\n`);
47+
do { await new Promise(resolve => setTimeout(resolve, 0)); }
48+
while (!readline.instance.activeRead?.resolve);
49+
readline.instance.activeRead.resolve(line);
50+
});
51+
}
52+
return queue;
53+
};
54+
55+
paste.onclick = async event => {
56+
paste.disabled = true;
57+
event.preventDefault();
58+
const { terminal } = document.querySelector('script[terminal]');
59+
const readline = terminal._addonManager._addons.at(-1);
60+
try {
61+
await inputLines(terminal, readline, prompt('code'));
62+
}
63+
finally {
64+
paste.disabled = false;
65+
}
66+
};
67+
</script>
68+
</head>
69+
</html>

‎test/pyterminal/index.html

+56
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>PyScript Terminal</title>
7+
<script src="../../mini-coi.js"></script>
8+
<script type="module" src="https://cdn.jsdelivr.net/npm/@pyscript/core@0.4.23/dist/core.js"></script>
9+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@pyscript/core@0.4.23/dist/core.css">
10+
<style>
11+
html, body {
12+
box-sizing: border-box;
13+
margin: 0;
14+
padding: 0;
15+
}
16+
.xterm {
17+
padding: 0;
18+
width: 100vw;
19+
height: 100vh;
20+
width: 100dvw;
21+
height: 100dvh;
22+
}
23+
#paste {
24+
position: fixed;
25+
top: 8px;
26+
right: 24px;
27+
width: 32px;
28+
height: 32px;
29+
}
30+
</style>
31+
<script type="module">
32+
let type = location.search.slice(1);
33+
if (type !== 'py') type = 'mpy';
34+
document.body.innerHTML = `
35+
<script type="${type}" id="cool" worker terminal>
36+
import code
37+
code.interact()
38+
<\x2fscript>
39+
<button id="paste" title="paste code in prompt">📝</button>
40+
`;
41+
42+
paste.onclick = async event => {
43+
event.preventDefault();
44+
event.stopImmediatePropagation();
45+
paste.disabled = true;
46+
const pyTerminal = document.querySelector('#cool');
47+
try {
48+
await pyTerminal.process(prompt('code'));
49+
}
50+
finally {
51+
paste.disabled = false;
52+
}
53+
};
54+
</script>
55+
</head>
56+
</html>

0 commit comments

Comments
 (0)