git @ Cat's Eye Technologies Wanda / develop-2019-1
Add a demo of running wanda.lua under Fengari in a web page. Chris Pressey 6 years ago
4 changed file(s) with 149 addition(s) and 0 deletion(s). Raw diff Collapse all Expand all
0 wanda.lua demo
1 ==============
2
3 This directory contains a demonstration of running `wanda.lua` in a
4 web browser, under [Fengari][].
5
6 In order to for this demonstration to work locally, you'll need
7 to run a local webserver from the *root* directory of this
8 repository. For example, if you have Python installed,
9
10 python -m SimpleHTTPServer
11
12 Then open
13
14 http://127.0.0.1:8000/demo/wanda.html
15
16 in your web browser. If you don't have Python, other options
17 (and more information on running web installations locally)
18 can be found here: [how to run things locally][].
19
20 [Fengari]: https://fengari.io/
21 [how to run things locally]: https://github.com/mrdoob/three.js/wiki/How-to-run-things-locally#run-local-server
0 /*
1 * fengari-web.js and wanda.lua must be loaded before this source.
2 * After loading this source, call launch() to create and start the interpreter.
3 */
4
5 function launch(config) {
6 config.container.innerHTML = `
7 <textarea id="editor" rows="10" cols="80"></textarea>
8 <div id="control-panel"></div>
9 <button onclick="run()">Run</button>
10 <pre id="output"></pre>
11 `;
12
13 function makeSelect(container, labelText, optionsArray, fun) {
14 var label = document.createElement('label');
15 label.innerHTML = labelText;
16 container.appendChild(label);
17 var select = document.createElement("select");
18 for (var i = 0; i < optionsArray.length; i++) {
19 var op = document.createElement("option");
20 op.value = optionsArray[i].value;
21 op.text = optionsArray[i].text;
22 select.options.add(op);
23 }
24 select.onchange = function(e) {
25 fun(optionsArray[select.selectedIndex]);
26 };
27 select.selectedIndex = 0;
28 label.appendChild(select);
29 return select;
30 };
31
32 function selectOptionByText(selectElem, text) {
33 var optElem;
34 for (var i = 0; optElem = selectElem.options[i]; i++) {
35 if (optElem.text === text) {
36 selectElem.selectedIndex = i;
37 selectElem.dispatchEvent(new Event('change'));
38 return;
39 }
40 }
41 }
42
43 var controlPanel = document.getElementById('control-panel');
44 var optionsArray = [];
45 for (var i = 0; i < examplePrograms.length; i++) {
46 optionsArray.push({
47 value: examplePrograms[i][1],
48 text: examplePrograms[i][0]
49 });
50 }
51
52 var select = makeSelect(controlPanel, "example program:", optionsArray, function(option) {
53 document.getElementById('editor').value = option.value;
54 });
55 selectOptionByText(select, "fact.wanda");
56 }
57
58 function runWandaProg(progText) {
59 // loads the progText into the Lua variable `wandaProg`, then runs a short Lua script
60
61 fengari.interop.push(fengari.L, progText);
62 fengari.lua.lua_setglobal(fengari.L, "wandaProg");
63
64 var luaProg = `
65 local program = parse_program(wandaProg)
66 local result = run_wanda(program, {})
67 return fmt(result)
68 `;
69
70 return fengari.load(luaProg)();
71 }
72
73 function run() {
74 var result = runWandaProg(document.getElementById("editor").value);
75 document.getElementById("output").innerHTML = result;
76 }
0 <!DOCTYPE html>
1 <head>
2 <meta charset="utf-8">
3 <title>wanda.lua (running under Fengari)</title>
4 <style>
5 #installation-container { }
6 </style>
7 </head>
8 <body>
9
10 <h1>Wanda</h1>
11
12 <p>(wanda.lua running under Fengari)</p>
13
14 <div id="installation-container">
15 <div id="installation">
16 </div>
17 </div>
18
19 <script src="https://catseye.tc/contrib/fengari-web-v0.1.4/fengari-web.js"></script>
20 <script src="../../../eg/index.js"></script>
21 <script src="wanda-fengari-launcher.js"></script>
22 <script type="application/lua" src="../src/wanda.lua" async></script>
23 <script>
24 launch({ container: document.getElementById('installation') });
25 </script>
26
27 </body>
0 examplePrograms = [
1 [
2 "add.wanda",
3 "$ 4 5 +\n"
4 ],
5 [
6 "fact.wanda",
7 "$\n: 0 $ fact -> $ 1 ;\n: $ fact -> $ dup 1 - fact * ;\n5 fact\n"
8 ],
9 [
10 "mod5.wanda",
11 "$\n: $ mod5 -> $ 5 - dup sgn cont5 ;\n: 1 $ cont5 -> $ mod5 ;\n: 0 $ cont5 -> $ pop 0 ;\n: -1 $ cont5 -> $ 5 + ;\n27 mod5 30 mod5 31 mod5\n"
12 ],
13 [
14 "perim.wanda",
15 "$\n: $ perim -> $ + 2 * ;\n4 10 perim\n"
16 ],
17 [
18 "sink.wanda",
19 ") 1 2 3 4 5 $ 99 sink\n"
20 ]
21 ];