jprdonnelly/pyscript
1
0
Fork 0
mirror of https://github.com/pyscript/pyscript.git synced 2026-02-12 22:00:56 -05:00
Code Issues Projects Releases Wiki Activity

use lazy imports and import xterm.js only if a py-terminal is actually found

Browse Source
This commit is contained in:
Antonio Cuni
2023-10-05 16:44:42 +02:00
parent b60327f022
commit e1bf5100ef
2 changed files with 24 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
pyscript.core/src/plugins/py-terminal.js
View File

@@ -1,17 +1,26 @@
// PyScript py-terminal plugin
import { hooks } from "../core.js";
// XXX TODO:
// 1. these imports should be lazy?
// 2. would be nice to automatically add xterm.css on demand
import { Terminal } from "https://cdn.jsdelivr.net/npm/xterm@5.3.0/+esm";
import { Readline } from "https://cdn.jsdelivr.net/npm/xterm-readline@1.1.1/+esm";
const makePyTerminal = () => {
const makePyTerminal = async () => {
const element = document.querySelector("py-terminal");
if (element === null) {
// no py-terminal found, nothing to do
return false;
}
document
.getElementsByTagName("head")[0]
.insertAdjacentHTML(
"beforeend",
'<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@5.3.0/css/xterm.min.css">',
);
const { Terminal } = await import(
/* webpackIgnore: true */ "https://cdn.jsdelivr.net/npm/xterm@5.3.0/+esm"
);
const { Readline } = await import(
/* webpackIgnore: true */ "https://cdn.jsdelivr.net/npm/xterm-readline@1.1.1/+esm"
);
const term = new Terminal({
theme: {
background: "#191A19",
@@ -27,26 +36,24 @@ const makePyTerminal = () => {
term.open(element);
term.focus();
async function readline(prompt) {
//console.log("readline", prompt);
async function pyterminal_readline(prompt) {
const line = await rl.read(prompt);
return line;
}
async function write(line) {
//console.log("write", line);
async function pyterminal_write(line) {
rl.write(line);
}
console.log("PyTerminal made?");
return { term, readline, write };
return { term, pyterminal_readline, pyterminal_write };
};
// this is ONLY for non-workers, correct?
// TODO: how to make it working for workers?
hooks.onInterpreterReady.add(function override(pyScript) {
hooks.onInterpreterReady.add(async function override(pyScript) {
console.log("hello onInterpreterReady");
const t = makePyTerminal();
const t = await makePyTerminal();
if (!t) {
console.log("<py-terminal> not found, nothing to do");
return;
@@ -64,16 +71,15 @@ hooks.onInterpreterReady.add(function override(pyScript) {
pyodide.setStderr({ raw: myStdout });
});
hooks.onWorkerReady.add(function (_, xworker) {
hooks.onWorkerReady.add(async function (_, xworker) {
console.log("hello onWorkerReady");
const t = makePyTerminal();
const t = await makePyTerminal();
if (!t) {
console.log("<py-terminal> not found, nothing to do");
return;
}
xworker.sync.pyterminal_readline = t.readline;
xworker.sync.pyterminal_write = t.write;
xworker.sync.pyterminal_readline = t.pyterminal_readline;
xworker.sync.pyterminal_write = t.pyterminal_write;
});
hooks.codeBeforeRunWorker.add(`

2
pyscript.core/test/pyterminal.html
View File

@@ -10,8 +10,6 @@
<link rel="stylesheet" href="../dist/core.css">
<script type="module" src="../dist/core.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@5.2.1/css/xterm.min.css">
</head>
<body>
<script type="py" worker>