Skip to content

Commit 2ea9dca

Browse files
committed
Add example, change some stuff in the demo to align with example
1 parent ca30ebc commit 2ea9dca

21 files changed

+2965
-6133
lines changed

wasm/.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,5 @@
11
bin/
22
pkg/
3+
dist/
4+
node_modules/
5+
File renamed without changes.

wasm/demo/.gitignore

Lines changed: 0 additions & 2 deletions
This file was deleted.

wasm/demo/package-lock.json

Lines changed: 0 additions & 6032 deletions
This file was deleted.

wasm/demo/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "app",
33
"version": "1.0.0",
4-
"description": "",
4+
"description": "Bindings to the RustPython library for WebAssembly",
55
"main": "index.js",
66
"dependencies": {
77
"codemirror": "^5.42.0"

wasm/demo/src/bootstrap.js

Lines changed: 0 additions & 10 deletions
This file was deleted.

wasm/demo/src/index.html

Lines changed: 24 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,12 @@
88
<h1>RustPython Demo</h1>
99
<p>
1010
RustPython is a Python interpreter writter in Rust. This demo is
11-
compiled from Rust to WebAssembly so it runs in the browser
11+
compiled from Rust to WebAssembly so it runs in the browser.
1212
</p>
13-
<p>Please input your python code below and click <kbd>Run</kbd>:</p>
1413
<p>
15-
Alternatively, open up your browser's devtools and play with
16-
<code>rp.eval_py('print("a")')</code>
14+
Please input your python code below and click <kbd>Run</kbd>, or you
15+
can up your browser's devtools and play with
16+
<code>rp.pyEval('print("a")')</code>
1717
</p>
1818
<textarea id="code">
1919
n1 = 0
@@ -28,24 +28,37 @@ <h1>RustPython Demo</h1>
2828
n1, n2 = n2, n1 + n2
2929
count += 1
3030

31-
</textarea>
31+
</textarea
32+
>
3233
<button id="run-btn">Run &#9655;</button>
3334
<div id="error"></div>
3435
<h3>Standard Output</h3>
35-
<textarea id="console">Loading...</textarea>
36+
<textarea id="console" readonly>Loading...</textarea>
3637

37-
<p>Here's some info regarding the <code>rp.eval_py()</code> function</p>
38+
<p>Here's some info regarding the <code>rp.pyEval()</code> function</p>
3839
<ul>
3940
<li>
4041
You can return variables from python and get them returned to
4142
JS, with the only requirement being that they're serializable
4243
with <code>json.dumps</code>.
4344
</li>
4445
<li>
45-
You can pass an object as the second argument to the function,
46-
and that will be available in python as the variable
47-
<code>js_vars</code>. Again, only values that can be serialized
48-
with <code>JSON.stringify()</code> will go through.
46+
You can pass an options object as the second argument to the
47+
function:
48+
<ul>
49+
<li>
50+
<code>stdout</code>: either a string with a css selector
51+
to a textarea element or a function that recieves a
52+
string when the <code>print</code> function is called in
53+
python. The default value is <code>console.log</code>.
54+
</li>
55+
<li>
56+
<code>vars</code>: an object that will be available in
57+
python as the variable <code>js_vars</code>. Again, only
58+
values that can be serialized with
59+
<code>JSON.stringify()</code> will go through.
60+
</li>
61+
</ul>
4962
</li>
5063
</ul>
5164

wasm/demo/src/index.js

Lines changed: 9 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,10 @@
1-
import * as rp from '../../lib/pkg';
2-
import CodeMirror from 'codemirror';
3-
import 'codemirror/mode/python/python';
4-
import 'codemirror/addon/comment/comment';
5-
6-
// so people can play around with it
7-
window.rp = rp;
8-
9-
const editor = CodeMirror.fromTextArea(document.getElementById('code'), {
10-
extraKeys: {
11-
'Ctrl-Enter': runCodeFromTextarea,
12-
'Cmd-Enter': runCodeFromTextarea,
13-
'Shift-Tab': 'indentLess',
14-
'Ctrl-/': 'toggleComment',
15-
'Cmd-/': 'toggleComment'
16-
},
17-
lineNumbers: true,
18-
mode: 'text/x-python',
19-
indentUnit: 4,
20-
autofocus: true
1+
import './style.css';
2+
import 'codemirror/lib/codemirror.css';
3+
4+
// A dependency graph that contains any wasm must all be imported
5+
// asynchronously. This `index.js` file does the single async import, so
6+
// that no one else needs to worry about it again.
7+
import('./main.js').catch(e => {
8+
console.error('Error importing `main.js`:', e);
9+
document.getElementById('error').textContent = e;
2110
});
22-
23-
function runCodeFromTextarea() {
24-
const consoleElement = document.getElementById('console');
25-
const errorElement = document.getElementById('error');
26-
27-
// Clean the console and errors
28-
consoleElement.value = '';
29-
errorElement.textContent = '';
30-
31-
const code = editor.getValue();
32-
try {
33-
rp.eval_py(code, {
34-
stdout: '#console'
35-
});
36-
} catch (e) {
37-
errorElement.textContent = e;
38-
console.error(e);
39-
}
40-
}
41-
42-
document
43-
.getElementById('run-btn')
44-
.addEventListener('click', runCodeFromTextarea);
45-
46-
runCodeFromTextarea(); // Run once for demo

wasm/demo/src/main.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import * as rp from '../../lib/pkg';
2+
import CodeMirror from 'codemirror';
3+
import 'codemirror/mode/python/python';
4+
import 'codemirror/addon/comment/comment';
5+
6+
// so people can play around with it
7+
window.rp = rp;
8+
9+
const editor = CodeMirror.fromTextArea(document.getElementById('code'), {
10+
extraKeys: {
11+
'Ctrl-Enter': runCodeFromTextarea,
12+
'Cmd-Enter': runCodeFromTextarea,
13+
'Shift-Tab': 'indentLess',
14+
'Ctrl-/': 'toggleComment',
15+
'Cmd-/': 'toggleComment'
16+
},
17+
lineNumbers: true,
18+
mode: 'text/x-python',
19+
indentUnit: 4,
20+
autofocus: true
21+
});
22+
23+
function runCodeFromTextarea() {
24+
const consoleElement = document.getElementById('console');
25+
const errorElement = document.getElementById('error');
26+
27+
// Clean the console and errors
28+
consoleElement.value = '';
29+
errorElement.textContent = '';
30+
31+
const code = editor.getValue();
32+
try {
33+
const result = rp.pyEval(code, {
34+
stdout: '#console'
35+
});
36+
consoleElement.value += `\n${result}\n`;
37+
} catch (e) {
38+
errorElement.textContent = e;
39+
console.error(e);
40+
}
41+
}
42+
43+
document
44+
.getElementById('run-btn')
45+
.addEventListener('click', runCodeFromTextarea);
46+
47+
runCodeFromTextarea(); // Run once for demo

wasm/demo/webpack.config.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
33
const path = require('path');
44

55
module.exports = {
6-
entry: './src/bootstrap.js',
6+
entry: './src/index.js',
77
output: {
8-
path: path.resolve(__dirname, 'dist'),
9-
filename: 'bootstrap.js'
8+
path: path.join(__dirname, 'dist'),
9+
filename: 'index.js'
1010
},
1111
mode: 'development',
1212
module: {

0 commit comments

Comments
 (0)