diff options
Diffstat (limited to 'demo/wasm2wat')
-rw-r--r-- | demo/wasm2wat/demo.js | 109 | ||||
-rw-r--r-- | demo/wasm2wat/examples.js | 55 | ||||
-rw-r--r-- | demo/wasm2wat/index.html | 76 |
3 files changed, 240 insertions, 0 deletions
diff --git a/demo/wasm2wat/demo.js b/demo/wasm2wat/demo.js new file mode 100644 index 00000000..a1b6b442 --- /dev/null +++ b/demo/wasm2wat/demo.js @@ -0,0 +1,109 @@ +/* + * Copyright 2017 WebAssembly Community Group participants + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +var editorEl = document.querySelector('.editor'); +var uploadEl = document.getElementById('upload'); +var selectEl = document.getElementById('select'); +var uploadInputEl = document.getElementById('uploadInput'); +var generateNamesEl = document.getElementById('generateNames'); +var foldExprsEl = document.getElementById('foldExprs'); +var inlineExportEl = document.getElementById('inlineExport'); +var readDebugNamesEl = document.getElementById('readDebugNames'); + +var options = {mode: 'wast', lineNumbers: true}; +var editor = CodeMirror.fromTextArea(editorEl, options); + +var fileBuffer = null; + +function compile(contents) { + if (!contents) { + return; + } + + var readDebugNames = readDebugNamesEl.checked; + var generateNames = generateNamesEl.checked; + var foldExprs = foldExprsEl.checked; + var inlineExport = inlineExportEl.checked; + + wabt.ready.then(function() { + try { + var module = wabt.readWasm(contents, {readDebugNames: readDebugNames}); + if (generateNames) { + module.generateNames(); + module.applyNames(); + } + var result = + module.toText({foldExprs: foldExprs, inlineExport: inlineExport}); + editor.setValue(result); + } catch (e) { + editor.setValue(e.toString()); + } finally { + if (module) module.destroy(); + } + }); +} + +function onUploadClicked(e) { + uploadInput.value = ''; + // See https://developer.mozilla.com/en-US/docs/Web/API/MouseEvent + var event = new MouseEvent('click', { + view: window, + bubbles: true, + cancelable: true, + }); + uploadInput.dispatchEvent(event); +} + +function onUploadedFile(e) { + var file = e.target.files[0]; + var reader = new FileReader(); + reader.onload = function(e) { + fileBuffer = new Uint8Array(e.target.result); + compile(fileBuffer); + }; + reader.readAsArrayBuffer(file); +} + +function recompileIfChanged(el) { + el.addEventListener('change', function() { compile(fileBuffer); }); +} + +function setExample(index) { + var contents = examples[index].contents; + fileBuffer = contents; + compile(contents); +} + +function onSelectChanged(e) { + setExample(this.selectedIndex); +} + +uploadEl.addEventListener('click', onUploadClicked); +uploadInputEl.addEventListener('change', onUploadedFile); +recompileIfChanged(generateNamesEl); +recompileIfChanged(foldExprsEl); +recompileIfChanged(inlineExportEl); +recompileIfChanged(readDebugNamesEl); +selectEl.addEventListener('change', onSelectChanged); + +for (var i = 0; i < examples.length; ++i) { + var example = examples[i]; + var option = document.createElement('option'); + option.textContent = example.name; + selectEl.appendChild(option); +} +selectEl.selectedIndex = 0; +setExample(selectEl.selectedIndex); diff --git a/demo/wasm2wat/examples.js b/demo/wasm2wat/examples.js new file mode 100644 index 00000000..11e2caf3 --- /dev/null +++ b/demo/wasm2wat/examples.js @@ -0,0 +1,55 @@ +/* + * Copyright 2017 WebAssembly Community Group participants + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +var examples = [ + { + name: 'simple', + contents: new Uint8Array([ + 0, 97, 115, 109, 1, 0, 0, 0, 1, 7, 1, 96, 2, 127, 127, + 1, 127, 3, 2, 1, 0, 7, 10, 1, 6, 97, 100, 100, 84, 119, + 111, 0, 0, 10, 9, 1, 7, 0, 32, 0, 32, 1, 106, 11, 0, + 25, 4, 110, 97, 109, 101, 1, 9, 1, 0, 6, 97, 100, 100, 84, + 119, 111, 2, 7, 1, 0, 2, 0, 0, 1, 0 + ]), + }, + + { + name: 'factorial', + contents: new Uint8Array([ + 0, 97, 115, 109, 1, 0, 0, 0, 1, 6, 1, 96, 1, 126, 1, 126, + 3, 2, 1, 0, 7, 7, 1, 3, 102, 97, 99, 0, 0, 10, 25, 1, + 23, 0, 32, 0, 66, 1, 83, 4, 126, 66, 1, 5, 32, 0, 32, 0, + 66, 1, 125, 16, 0, 126, 11, 11, 0, 20, 4, 110, 97, 109, 101, 1, + 6, 1, 0, 3, 102, 97, 99, 2, 5, 1, 0, 1, 0, 0 + ]), + }, + + { + name: 'stuff', + contents: new Uint8Array([ + 0, 97, 115, 109, 1, 0, 0, 0, 1, 13, 3, 96, 1, 125, + 0, 96, 1, 127, 1, 127, 96, 0, 0, 2, 11, 1, 3, 102, + 111, 111, 3, 98, 97, 114, 0, 0, 3, 3, 2, 2, 0, 4, + 5, 1, 112, 1, 0, 1, 5, 4, 1, 1, 1, 1, 7, 9, + 1, 5, 102, 117, 110, 99, 49, 0, 1, 8, 1, 1, 10, 10, + 2, 2, 0, 11, 5, 0, 65, 42, 26, 11, 11, 8, 1, 0, + 65, 0, 11, 2, 104, 105, 0, 44, 4, 110, 97, 109, 101, 1, + 24, 3, 0, 7, 105, 109, 112, 111, 114, 116, 48, 1, 5, 102, + 117, 110, 99, 48, 2, 5, 102, 117, 110, 99, 49, 2, 11, 3, + 0, 1, 0, 0, 1, 0, 2, 1, 0, 0 + ]), + }, +]; diff --git a/demo/wasm2wat/index.html b/demo/wasm2wat/index.html new file mode 100644 index 00000000..d2de0eee --- /dev/null +++ b/demo/wasm2wat/index.html @@ -0,0 +1,76 @@ +<!-- + Copyright 2017 WebAssembly Community Group participants + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes"> + <title>wasm2wat demo</title> + <link href="../third_party/codemirror/codemirror.css" rel="stylesheet"> + <link href="../primer.css" rel="stylesheet"> + <link href="../custom.css" rel="stylesheet"> +</head> +<body> + <div class="container"> + <h1>wasm2wat demo</h1> + <hr> + <p>WebAssembly has a + <a href="http://webassembly.github.io/spec/text/index.html">text format</a> + and a + <a href="http://webassembly.github.io/spec/binary/index.html">binary format</a>. + This demo converts from the binary format to the text format. + </p> + <p> + Upload a WebAssembly binary file, and the text format will be displayed. + </p> + <div> + <label>example:</label> + <select id="select" class="form-select"></select> + <button class="btn" type="button" id="upload">Upload</button> + <input type="file" id="uploadInput" class="hidden"></a> + <div> + <input type="checkbox" id="generateNames" checked> + <label for="generateNames">Generate Names</label> + </div> + + <div> + <input type="checkbox" id="foldExprs" checked> + <label for="foldExprs">Fold Expressions</label> + </div> + + <div> + <input type="checkbox" id="inlineExport" checked> + <label for="inlineExport">Inline Export</label> + </div> + + <div> + <input type="checkbox" id="readDebugNames" checked> + <label for="readDebugNames">Read Debug Names</label> + </div> + </div> + + <textarea class="editor" autofocus autocomplete="off" autocorrect="off" + autocapitalize="off" spellcheck="false" hidden></textarea> + </div> + <script src="../third_party/codemirror/codemirror.js"></script> + <script src="../third_party/codemirror/simple-mode.js"></script> + <script src="../wast-mode.js"></script> + <script src="../libwabt.js"></script> + <script src="examples.js"></script> + <script src="demo.js"></script> +</body> +</html> + |