|
|
@@ -1,8 +1,4 @@
|
|
|
-let app = document.getElementById("app");
|
|
|
-app.width = 800;
|
|
|
-app.height = 600;
|
|
|
-let ctx = app.getContext("2d");
|
|
|
-let w = null;
|
|
|
+// TODO: deploy the WASM examples to GitHub pages
|
|
|
|
|
|
function make_environment(...envs) {
|
|
|
return new Proxy(envs, {
|
|
|
@@ -17,17 +13,28 @@ function make_environment(...envs) {
|
|
|
});
|
|
|
}
|
|
|
|
|
|
-// TODO: deploy the WASM examples to GitHub pages
|
|
|
-// TODO: display all the VC examples on a single page
|
|
|
-WebAssembly.instantiateStreaming(fetch('./build/squish.wasm'), {
|
|
|
- "env": make_environment({
|
|
|
- "atan2f": Math.atan2,
|
|
|
- "cosf": Math.cos,
|
|
|
- "sinf": Math.sin,
|
|
|
- "sqrtf": Math.sqrt,
|
|
|
- })
|
|
|
-}).then(w0 => {
|
|
|
- w = w0;
|
|
|
+const libm = {
|
|
|
+ "atan2f": Math.atan2,
|
|
|
+ "cosf": Math.cos,
|
|
|
+ "sinf": Math.sin,
|
|
|
+ "sqrtf": Math.sqrt,
|
|
|
+};
|
|
|
+
|
|
|
+async function startExample(elementId, wasmPath) {
|
|
|
+ const app = document.getElementById(elementId);
|
|
|
+ if (app === null) {
|
|
|
+ console.error(`Could not find element ${elementId}. Skipping example ${wasmPath}...`);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ app.width = 800;
|
|
|
+ app.height = 600;
|
|
|
+ const ctx = app.getContext("2d");
|
|
|
+ const w = await WebAssembly.instantiateStreaming(fetch(wasmPath), {
|
|
|
+ "env": make_environment(libm)
|
|
|
+ });
|
|
|
+
|
|
|
+ w.instance.exports.init();
|
|
|
|
|
|
let prev = null;
|
|
|
function first(timestamp) {
|
|
|
@@ -45,6 +52,9 @@ WebAssembly.instantiateStreaming(fetch('./build/squish.wasm'), {
|
|
|
|
|
|
window.requestAnimationFrame(loop);
|
|
|
}
|
|
|
- w.instance.exports.init();
|
|
|
window.requestAnimationFrame(first);
|
|
|
-})
|
|
|
+}
|
|
|
+
|
|
|
+startExample("app-triangle", "./build/triangle.wasm");
|
|
|
+startExample("app-3d", "./build/3d.wasm");
|
|
|
+startExample("app-squish", "./build/squish.wasm");
|
rexim