git @ Cat's Eye Technologies ZOWIE / 790915f
Add Javascript to provide example of how to run in a web browser. Chris Pressey 2 years ago
2 changed file(s) with 157 addition(s) and 0 deletion(s). Raw diff Collapse all Expand all
0 examplePrograms = [
1 [
2 "chars.zow",
3 "; Display the Roman alphabet in reverse, in ZOWIE\n; This example source is in the public domain.\n\nMOV R10, 90 ; initially it's \"Z\"\nMOV R1, R1 ; BEGIN TRANSACTION for \"REPEAT\"\nMOV R0, R10 ; output character\nMOV R8, R10 ; decrement character\nMOV R5, 1\nMOV R10, R8\nMOV R8, R10 ; test if character is above \"@\"\nMOV R5, 64\nMOV R3, R8 ; COMMIT AND REPEAT if non-zero\n"
4 ],
5 [
6 "fact.zow",
7 "; Compute a factorial, in ZOWIE\n; This example source is in the public domain.\n\n; Expected output is MODIFIER LETTER TRIANGULAR COLON (Unicode character 720).\n; NOTE: this code is also able to properly compute 0! = 1.\n\nMOV R11, 6 ; let's find 6!\nMOV R10, 1 ; accumulator\n\nMOV R8, R11 ; increase multiplicand\nMOV R4, 1\nMOV R11, R8\n\nMOV R1, R1 ; BEGIN TRANSACTION for \"REPEAT\"\n\nMOV R8, R11 ; decrease multiplicand\nMOV R5, 1\nMOV R11, R8\n\nMOV R1, R1 ; BEGIN TRANSACTION for \"IF\"\n\nMOV R8, R10 ; accumulator\nMOV R6, R11 ; multiplied\nMOV R10, R8\n\nMOV R2, R11 ; COMMIT if multiplicand above zero, or ROLLBACK otherwise\nMOV R3, R11 ; COMMIT AND REPEAT if multiplicand above zero\n\nMOV R0, R10 ; output accumulator (as single Unicode character)\n"
8 ],
9 [
10 "hello.zow",
11 "; Hello, world! in ZOWIE\n; This example source is in the public domain.\n\nMOV R0, 72\nMOV R0, 101\nMOV R0, 108\nMOV R0, 108\nMOV R0, 111\nMOV R0, 44\nMOV R0, 32\nMOV R0, 119\nMOV R0, 111\nMOV R0, 114\nMOV R0, 108\nMOV R0, 100\nMOV R0, 33\nMOV R0, 10\n"
12 ]
13 ];
0 // Example of running the ZOWIE reference interpreter, zowie.py,
1 // under Skulpt, in a web browser. As of this writing, this
2 // can be seen in action here: http://catseye.tc/installation/ZOWIE
3
4 function load_file(url, callback)
5 {
6 var xhr = new XMLHttpRequest();
7 xhr.onload = function(e) {
8 if (xhr.readyState === 4 && xhr.responseText) {
9 if (xhr.status === 200) {
10 callback(xhr.responseText);
11 } else {
12 alert("Error: could not load " + url + ": " + xhr.statusText);
13 }
14 }
15 };
16 xhr.open("get", url, true);
17 xhr.send();
18 }
19
20 PresetManager = function() {
21 this.init = function(cfg) {
22 this.selectElem = cfg.selectElem;
23 if (cfg.setPreset) {
24 this.setPreset = cfg.setPreset;
25 }
26 this.clear();
27 var $this = this;
28 this.selectElem.onchange = function() {
29 $this._select(this.options[this.selectedIndex].value);
30 }
31 return this;
32 };
33
34 this.clear = function() {
35 this.reactTo = {};
36 while (this.selectElem.firstChild) {
37 this.selectElem.removeChild(this.selectElem.firstChild);
38 }
39 this.add('(select one...)', function() {});
40 return this;
41 };
42
43 this.add = function(id, callback) {
44 var opt = document.createElement("option");
45 opt.text = id;
46 opt.value = id;
47 this.selectElem.options.add(opt);
48 var $this = this;
49 this.reactTo[id] = callback || this.setPreset;
50 return this;
51 };
52
53 this.setPreset = function(id) {
54 throw new Error("No default setPreset callback configured");
55 };
56
57 this._select = function(id) {
58 this.reactTo[id](id);
59 if (this.onselect) {
60 this.onselect(id);
61 }
62 };
63
64 this.select = function(id) {
65 var i = 0;
66 var opt = this.selectElem.options[i];
67 while (opt) {
68 if (opt.value === id) {
69 this.selectElem.selectedIndex = i;
70 this._select(id);
71 return this;
72 }
73 i++;
74 opt = this.selectElem.options[i];
75 }
76 // if not found, select the "(select one...)" option
77 this.selectElem.selectedIndex = 0;
78 return this;
79 };
80 };
81
82 function launch(prefix, container, config) {
83 if (typeof container === 'string') {
84 container = document.getElementById(container);
85 }
86 config = config || {};
87
88 document.getElementById('installation').innerHTML =
89 '<div id="control_panel"></div>' +
90 '<button type="button" id="run">Run</button>' +
91 '<span class="control-container">example program: <select id="select_source"></select></span>' +
92 '<pre id="output"></pre>' +
93 '<textarea id="editor" rows="14" cols="60" wrap="off"></textarea>';
94
95 var presetManager = (new PresetManager()).init({
96 selectElem: document.getElementById('select_source')
97 });
98 function makeCallback(sourceText) {
99 return function(id) {
100 document.getElementById('editor').value = sourceText;
101 }
102 }
103 for (var i = 0; i < examplePrograms.length; i++) {
104 presetManager.add(examplePrograms[i][0], makeCallback(examplePrograms[i][1]));
105 }
106 presetManager.select(examplePrograms[0][0]);
107
108 document.getElementById("run").style.enabled = false;
109 var zowie_interpreter;
110
111 load_file("../modules/zowie/src/zowie.py", function(text) {
112 zowie_interpreter = text;
113 document.getElementById("run").style.enabled = true;
114 });
115
116 document.getElementById("run").onclick = function() {
117 var esoprog = document.getElementById("editor").value;
118 var mypre = document.getElementById("output");
119 mypre.innerHTML = '';
120 Sk.canvas = "mycanvas";
121 Sk.pre = "output";
122 Sk.configure({
123 output: function(text) {
124 var mypre = document.getElementById("output");
125 mypre.innerHTML = mypre.innerHTML + text.replace(/\n$/, "");
126 },
127 read: function(x) {
128 if (Sk.builtinFiles === undefined || Sk.builtinFiles["files"][x] === undefined) {
129 throw "File not found: '" + x + "'";
130 }
131 return Sk.builtinFiles["files"][x];
132 }
133 });
134 prog = zowie_interpreter + "\n";
135 prog += 'p = Processor()\n';
136 prog += 'p.load_string("""\n';
137 prog += esoprog;
138 prog += '""")\n';
139 prog += 'p.run()\n';
140 eval(Sk.importMainWithBody("<stdin>", false, prog));
141 };
142 }