alihan/pyscript-python-html
1
0
Fork 0
mirror of https://github.com/pyscript/pyscript.git synced 2022-05-01 19:47:48 +03:00
Code Issues Projects Releases Wiki Activity

clean code draft

Browse Source
This commit is contained in:
Fabio Pliger
2022-02-23 11:53:55 -06:00
parent 1589838d63
commit 7f4053bc42
2 changed files with 32 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
pyscriptjs/index.html
View File

@@ -3,7 +3,6 @@
<head> <head>
<!-- <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css"> --> <!-- <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css"> -->
<script src="https://cdn.jsdelivr.net/pyodide/v0.19.0/full/pyodide.js"></script> <script src="https://cdn.jsdelivr.net/pyodide/v0.19.0/full/pyodide.js"></script>
<script src="pyscript.js"></script>
<link rel="stylesheet" media="all" href="pyscript1.css"> <link rel="stylesheet" media="all" href="pyscript1.css">
<link rel="stylesheet" <link rel="stylesheet"

58
pyscriptjs/src/index.ts
View File

@@ -1,5 +1,15 @@
let message: string = 'Hello World'; import {EditorState} from "@codemirror/state";
console.log(message); import {EditorView, keymap} from "@codemirror/view";
import {defaultKeymap} from "@codemirror/commands";
import {loadInterpreter} from "./interpreter";
// import {EditorState, EditorView, basicSetup} from "@codemirror/basic-setup"
// import {javascript} from "@codemirror/lang-javascript"
let startState = EditorState.create({
doc: "Hello World",
extensions: [keymap.of(defaultKeymap)]
})
class PyScript extends HTMLElement { class PyScript extends HTMLElement {
shadow: ShadowRoot; shadow: ShadowRoot;
@@ -35,7 +45,7 @@ class PyScript extends HTMLElement {
} }
} }
customElements.define('py-script', PyScript); let xPyScript = customElements.define('py-script', PyScript);
function create_menu (){ function create_menu (){
@@ -57,15 +67,20 @@ class PyScript extends HTMLElement {
document.body.appendChild(div); document.body.appendChild(div);
document.querySelectorAll('py-script').forEach((elem: PyScript, i) => { document.querySelectorAll('py-script').forEach((elem: PyScript, i) => {
var code = elem.innerHTML; let code = elem.innerHTML;
elem.innerHTML = ""; elem.innerHTML = "";
elem.code = code; elem.code = code;
elem.cm = CodeMirror(elem, { let view = new EditorView({
lineNumbers: true, state: startState,
tabSize: 2, parent: elem
value: code, })
mode: 'python'
}); // elem.cm = CodeMirror(elem, {
// lineNumbers: true,
// tabSize: 2,
// value: code,
// mode: 'python'
// });
elem.btnRun = document.createElement('button'); elem.btnRun = document.createElement('button');
elem.btnRun.innerHTML = "run"; elem.btnRun.innerHTML = "run";
@@ -108,23 +123,14 @@ class PyScript extends HTMLElement {
window.onload= create_menu; window.onload= create_menu;
async function main() { // async function main() {
let pyodide = await loadPyodide({ // let pyodide = await loadPyodide({ /* @ts-ignore */
indexURL: "https://cdn.jsdelivr.net/pyodide/v0.19.0/full/", // indexURL: "https://cdn.jsdelivr.net/pyodide/v0.19.0/full/",
}); // }); /* @ts-ignore */
return pyodide; // return pyodide;
} // }
let pyodideReadyPromise = main(); let pyodideReadyPromise = loadInterpreter();
async function evaluatePython() {
let pyodide = await pyodideReadyPromise;
try {
let output = pyodide.runPython(code.value);
addToOutput(output);
} catch (err) {
addToOutput(err);
}
}