WIP: Bringing PyScript.next PoC to the main project (#1507)

* kill unwrapped_remote (#1490)

* kill unwrapped_remote

* linting

* don't use callKwargs for python plugins

* fix tests and improve types

* Bringing PyScript.next PoC to the main project

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

---------

Co-authored-by: Madhur Tandon <20173739+madhur-tandon@users.noreply.github.com>
Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
This commit is contained in:
Andrea Giammarchi
2023-06-05 21:52:28 +02:00
committed by GitHub
parent 4467898473
commit 339e40063a
101 changed files with 49520 additions and 0 deletions

View File

@@ -0,0 +1,35 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>Plugins</title>
<style>
py-script {
display: none;
}
</style>
<script type="importmap">
{ "imports": { "@pyscript/core": "../../min.js" } }
</script>
<script type="module">
import { registerPlugin } from "@pyscript/core";
registerPlugin("mpy-script", {
type: "micropython", // or just 'mpy'
async onRuntimeReady(element, micropython) {
console.log(micropython);
// Somehow this doesn't work in MicroPython
micropython.io.stdout = (message) => {
console.log("🐍", micropython.type, message);
};
micropython.run(element.textContent);
element.replaceChildren("See console ->");
element.style.display = "block";
},
});
</script>
</head>
<body>
<mpy-script> print('Hello Console!') </mpy-script>
</body>
</html>

View File

@@ -0,0 +1,34 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>Plugins</title>
<style>
py-script {
display: none;
}
</style>
<script type="importmap">
{ "imports": { "@pyscript/core": "../../min.js" } }
</script>
<script type="module">
import { registerPlugin } from "@pyscript/core";
registerPlugin("lua-script", {
type: "wasmoon", // or just 'lua'
async onRuntimeReady(element, wasmoon) {
// Somehow this doesn't work in Wasmoon
wasmoon.io.stdout = (message) => {
console.log("🌑", wasmoon.type, message);
};
wasmoon.run(element.textContent);
element.replaceChildren("See console ->");
element.style.display = "block";
},
});
</script>
</head>
<body>
<lua-script> print('Hello Console!') </lua-script>
</body>
</html>

View File

@@ -0,0 +1,32 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>PyScript</title>
<style>
py-script {
display: none;
}
</style>
<script type="importmap">
{ "imports": { "@pyscript/core": "../../min.js" } }
</script>
<script type="module" src="py-script.js"></script>
</head>
<body>
<py-config>
[[fetch]]
from = "../"
to_folder = "./"
files = ["a.py", "b.py"]
</py-config>
<py-script>
import js
import a, b
print('Hello Console!')
js.console.log(a.x, b.x)
'Hello Web!'
</py-script>
</body>
</html>

View File

@@ -0,0 +1,59 @@
import { registerPlugin } from "@pyscript/core";
// append ASAP CSS to avoid showing content
document.head.appendChild(document.createElement("style")).textContent = `
py-script, py-config {
display: none;
}
`;
// create a unique identifier when/if needed
let id = 0;
const getID = (prefix = "py-script") => `${prefix}-${id++}`;
let bootstrap = true;
const sharedPyodide = new Promise((resolve) => {
const pyConfig = document.querySelector("py-config");
const config = pyConfig?.getAttribute("src") || pyConfig?.textContent;
registerPlugin("py-script", {
config,
type: "pyodide", // or just 'py'
async onRuntimeReady(_, pyodide) {
// bootstrap the shared runtime once
// as each node as plugin gets onRuntimeReady called once
// because no custom-element is strictly needed
if (bootstrap) {
bootstrap = false;
pyodide.io.stdout = (message) => {
console.log("🐍", pyodide.type, message);
};
// do any module / JS injection in here such as
// Element, display, and friends ... then:
resolve(pyodide);
}
},
});
});
/** @type {WeakSet<PyScriptElement>} */
const known = new WeakSet();
class PyScriptElement extends HTMLElement {
constructor() {
if (!super().id) this.id = getID();
}
async connectedCallback() {
if (!known.has(this)) {
known.add(this);
// sharedPyodide contains various helpers including run and runAsync
const { run } = await sharedPyodide;
// do any stuff needed to finalize this element bootstrap
// (i.e. check src attribute and so on)
this.replaceChildren(run(this.textContent) || "");
// reveal the node on the page
this.style.display = "block";
}
}
}
customElements.define("py-script", PyScriptElement);