mirror of
https://github.com/pyscript/pyscript.git
synced 2022-05-01 19:47:48 +03:00
remove first js try
This commit is contained in:
Fabio Pliger
@@ -1,39 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<!-- <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>
|
|
||||||
<link rel="stylesheet" media="all" href="pyscript1.css">
|
|
||||||
|
|
||||||
<link rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/codemirror.min.css">
|
|
||||||
</link>
|
|
||||||
|
|
||||||
<script type="text/javascript"
|
|
||||||
src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/codemirror.min.js">
|
|
||||||
</script>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<div class="header">
|
|
||||||
|
|
||||||
<nav>
|
|
||||||
<h1>PyScript</h1>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#" class="active">Edit Mode</a></li>
|
|
||||||
<!-- <li><a href="#">About</a></li>
|
|
||||||
<li><a href="#">Services</a></li>
|
|
||||||
<li><a href="#">Portfolio</a></li>
|
|
||||||
<li><a href="#">Team</a></li>
|
|
||||||
<li><a href="#">Contact</a></li> -->
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<main>
|
|
||||||
<py-script>
|
|
||||||
sum([1, 2, 3, 4, 5])
|
|
||||||
</py-script>
|
|
||||||
</main>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
8981
pyscriptjs/package-lock.json
generated
8981
pyscriptjs/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,45 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "pyscriptjs",
|
|
||||||
"version": "0.0.1",
|
|
||||||
"description": "My webpack project",
|
|
||||||
"scripts": {
|
|
||||||
"test": "test",
|
|
||||||
"build": "webpack --mode=production --node-env=production",
|
|
||||||
"build:dev": "webpack --mode=development",
|
|
||||||
"build:prod": "webpack --mode=production --node-env=production",
|
|
||||||
"watch": "webpack --watch",
|
|
||||||
"serve": "webpack serve"
|
|
||||||
},
|
|
||||||
"repository": {
|
|
||||||
"type": "git",
|
|
||||||
"url": "git+https://github.com/anaconda/pyscript.git"
|
|
||||||
},
|
|
||||||
"keywords": [
|
|
||||||
"python"
|
|
||||||
],
|
|
||||||
"author": "Anaconda",
|
|
||||||
"license": "MIT",
|
|
||||||
"bugs": {
|
|
||||||
"url": "https://github.com/anaconda/pyscript/issues"
|
|
||||||
},
|
|
||||||
"homepage": "https://github.com/anaconda/pyscript#readme",
|
|
||||||
"devDependencies": {
|
|
||||||
"@webpack-cli/generators": "^2.4.2",
|
|
||||||
"html-webpack-plugin": "^5.5.0",
|
|
||||||
"prettier": "^2.5.1",
|
|
||||||
"ts-loader": "^9.2.6",
|
|
||||||
"typescript": "^4.5.5",
|
|
||||||
"webpack": "^5.69.1",
|
|
||||||
"webpack-cli": "^4.9.2",
|
|
||||||
"webpack-dev-server": "^4.7.4",
|
|
||||||
"workbox-webpack-plugin": "^6.4.2"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"@codemirror/basic-setup": "^0.19.1",
|
|
||||||
"@codemirror/lang-javascript": "^0.19.7",
|
|
||||||
"@codemirror/lang-python": "^0.19.4",
|
|
||||||
"@codemirror/theme-one-dark": "^0.19.1",
|
|
||||||
"@webcomponents/custom-elements": "^1.5.0",
|
|
||||||
"codemirror": "^5.65.2"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,151 +0,0 @@
|
|||||||
// import { EditorState } from "@codemirror/state";
|
|
||||||
import {EditorState, EditorView , basicSetup} from "@codemirror/basic-setup"
|
|
||||||
// import {gutter, GutterMarker} from "@codemirror/gutter"
|
|
||||||
|
|
||||||
import { python } from "@codemirror/lang-python"
|
|
||||||
import { keymap } from "@codemirror/view";
|
|
||||||
import { defaultKeymap } from "@codemirror/commands";
|
|
||||||
import { oneDarkTheme } from "@codemirror/theme-one-dark";
|
|
||||||
// @codemirror/lang-python
|
|
||||||
|
|
||||||
import { loadInterpreter } from "./interpreter";
|
|
||||||
// import {EditorState, EditorView, basicSetup} from "@codemirror/basic-setup"
|
|
||||||
// import {javascript} from "@codemirror/lang-javascript"
|
|
||||||
|
|
||||||
|
|
||||||
class PyScript extends HTMLElement {
|
|
||||||
shadow: ShadowRoot;
|
|
||||||
wrapper: HTMLElement;
|
|
||||||
editor: EditorView;
|
|
||||||
editorNode: HTMLElement;
|
|
||||||
code: string;
|
|
||||||
cm: any;
|
|
||||||
btnEdit: HTMLElement;
|
|
||||||
btnRun: HTMLElement;
|
|
||||||
editorOut: HTMLTextAreaElement;
|
|
||||||
editorState: EditorState;
|
|
||||||
|
|
||||||
constructor() {
|
|
||||||
super();
|
|
||||||
|
|
||||||
// attach shadow so we can preserve the element original innerHtml content
|
|
||||||
this.shadow = this.attachShadow({ mode: 'open'});
|
|
||||||
|
|
||||||
this.wrapper = document.createElement('slot');
|
|
||||||
|
|
||||||
// add an extra div where we can attach the codemirror editor
|
|
||||||
this.editorNode = document.createElement('div');
|
|
||||||
|
|
||||||
this.shadow.appendChild(this.wrapper);
|
|
||||||
this.shadow.appendChild(this.editorNode);
|
|
||||||
this.code = this.wrapper.innerHTML;
|
|
||||||
}
|
|
||||||
connectedCallback() {
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
render(){
|
|
||||||
// debugger;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
let xPyScript = customElements.define('py-script', PyScript);
|
|
||||||
|
|
||||||
|
|
||||||
function create_menu (){
|
|
||||||
let leftBar = document.createElement("div");
|
|
||||||
|
|
||||||
// example: https://codepen.io/Markshall/pen/wQyWqq
|
|
||||||
leftBar.innerHTML = `
|
|
||||||
<div class="adminActions">
|
|
||||||
<input type="checkbox" name="adminToggle" class="adminToggle" />
|
|
||||||
<a class="adminButton" href="#!"><i class="fa fa-cog">+</i></a>
|
|
||||||
<div class="adminButtons">
|
|
||||||
<a href="#" title="Add Company"><i class="fa fa-building">Script</i></a>
|
|
||||||
<a href="#" title="Edit Company"><i class="fa fa-pen">Panel</i></a>
|
|
||||||
<a href="#" title="Add User"><i class="fa fa-user-plus">Button</i></a>
|
|
||||||
<a href="#" title="Edit User"><i class="fa fa-user-edit">TextArea</i></a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
document.body.appendChild(leftBar);
|
|
||||||
|
|
||||||
|
|
||||||
document.querySelectorAll('py-script').forEach((elem: PyScript, i) => {
|
|
||||||
let code = elem.innerHTML;
|
|
||||||
elem.innerHTML = "";
|
|
||||||
elem.code = code;
|
|
||||||
|
|
||||||
let startState = EditorState.create({
|
|
||||||
doc: code,
|
|
||||||
extensions: [
|
|
||||||
keymap.of(defaultKeymap),
|
|
||||||
oneDarkTheme,
|
|
||||||
// python()
|
|
||||||
]
|
|
||||||
})
|
|
||||||
|
|
||||||
let view = new EditorView({
|
|
||||||
state: startState,
|
|
||||||
|
|
||||||
parent: elem
|
|
||||||
})
|
|
||||||
|
|
||||||
// elem.cm = CodeMirror(elem, {
|
|
||||||
// lineNumbers: true,
|
|
||||||
// tabSize: 2,
|
|
||||||
// value: code,
|
|
||||||
// mode: 'python'
|
|
||||||
// });
|
|
||||||
elem.editor = view;
|
|
||||||
elem.btnRun = document.createElement('button');
|
|
||||||
elem.btnRun.innerHTML = "run";
|
|
||||||
elem.btnRun.classList.add("run");
|
|
||||||
|
|
||||||
elem.appendChild(elem.btnRun);
|
|
||||||
|
|
||||||
elem.btnEdit = document.createElement('button');
|
|
||||||
elem.btnEdit.innerHTML = "edit";
|
|
||||||
elem.btnEdit.classList.add("edit");
|
|
||||||
elem.appendChild(elem.btnEdit);
|
|
||||||
|
|
||||||
var eDiv = document.createElement('div');
|
|
||||||
|
|
||||||
elem.editorOut = document.createElement('textarea');
|
|
||||||
elem.editorOut.classList.add("output");
|
|
||||||
elem.editorOut.disabled = true;
|
|
||||||
eDiv.appendChild(elem.editorOut);
|
|
||||||
elem.appendChild(eDiv);
|
|
||||||
|
|
||||||
function addToOutput(s: string) {
|
|
||||||
elem.editorOut.value += ">>>" + s + "\n";
|
|
||||||
}
|
|
||||||
elem.btnRun.onclick = evaluatePython;
|
|
||||||
|
|
||||||
async function evaluatePython() {
|
|
||||||
let pyodide = await pyodideReadyPromise;
|
|
||||||
try {
|
|
||||||
let output = pyodide.runPython(elem.editor.state.doc.toString());
|
|
||||||
addToOutput(output);
|
|
||||||
} catch (err) {
|
|
||||||
addToOutput(err);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
window.onload= create_menu;
|
|
||||||
|
|
||||||
// async function main() {
|
|
||||||
// let pyodide = await loadPyodide({ /* @ts-ignore */
|
|
||||||
// indexURL: "https://cdn.jsdelivr.net/pyodide/v0.19.0/full/",
|
|
||||||
// }); /* @ts-ignore */
|
|
||||||
|
|
||||||
// return pyodide;
|
|
||||||
// }
|
|
||||||
let pyodideReadyPromise = loadInterpreter();
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
// @ts-nocheck
|
|
||||||
// @ts-ignore
|
|
||||||
|
|
||||||
let loadInterpreter = async function(): any {
|
|
||||||
/* @ts-ignore */
|
|
||||||
let pyodide = await loadPyodide({
|
|
||||||
indexURL: "https://cdn.jsdelivr.net/pyodide/v0.19.0/full/",
|
|
||||||
});
|
|
||||||
/* @ts-ignore */
|
|
||||||
return pyodide;
|
|
||||||
}
|
|
||||||
|
|
||||||
export {loadInterpreter}
|
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
"allowSyntheticDefaultImports": true,
|
|
||||||
"moduleResolution": "node",
|
|
||||||
"noImplicitAny": true,
|
|
||||||
"module": "es2020",
|
|
||||||
"target": "es5",
|
|
||||||
"allowJs": true,
|
|
||||||
"sourceMap": true,
|
|
||||||
"outDir": "build",
|
|
||||||
},
|
|
||||||
"files": ["src/index.ts"]
|
|
||||||
}
|
|
||||||
@@ -1,59 +0,0 @@
|
|||||||
// Generated using webpack-cli https://github.com/webpack/webpack-cli
|
|
||||||
|
|
||||||
const path = require("path");
|
|
||||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
|
||||||
const WorkboxWebpackPlugin = require("workbox-webpack-plugin");
|
|
||||||
|
|
||||||
const isProduction = process.env.NODE_ENV == "production";
|
|
||||||
|
|
||||||
const config = {
|
|
||||||
entry: [
|
|
||||||
"@webcomponents/custom-elements/src/native-shim",
|
|
||||||
"./src/index.ts"
|
|
||||||
],
|
|
||||||
output: {
|
|
||||||
path: path.resolve(__dirname, "build"),
|
|
||||||
},
|
|
||||||
devServer: {
|
|
||||||
open: true,
|
|
||||||
host: "localhost",
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
new HtmlWebpackPlugin({
|
|
||||||
template: "index.html",
|
|
||||||
}),
|
|
||||||
|
|
||||||
// Add your plugins here
|
|
||||||
// Learn more about plugins from https://webpack.js.org/configuration/plugins/
|
|
||||||
],
|
|
||||||
module: {
|
|
||||||
rules: [
|
|
||||||
{
|
|
||||||
test: /\.(ts|tsx)$/i,
|
|
||||||
loader: "ts-loader",
|
|
||||||
exclude: ["/node_modules/"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i,
|
|
||||||
type: "asset",
|
|
||||||
},
|
|
||||||
|
|
||||||
// Add your rules for custom modules here
|
|
||||||
// Learn more about loaders from https://webpack.js.org/loaders/
|
|
||||||
],
|
|
||||||
},
|
|
||||||
resolve: {
|
|
||||||
extensions: [".tsx", ".ts", ".js"],
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
module.exports = () => {
|
|
||||||
if (isProduction) {
|
|
||||||
config.mode = "production";
|
|
||||||
|
|
||||||
config.plugins.push(new WorkboxWebpackPlugin.GenerateSW());
|
|
||||||
} else {
|
|
||||||
config.mode = "development";
|
|
||||||
}
|
|
||||||
return config;
|
|
||||||
};
|
|
||||||
Reference in New Issue
Block a user