hook up logging to wasm, example uses new zig-js package

This commit is contained in:
Mitchell Hashimoto
2022-12-04 13:16:54 -08:00
parent 437f1772f1
commit c48d8cd151
9 changed files with 4547 additions and 48 deletions

4
example/.gitignore vendored Normal file
View File

@@ -0,0 +1,4 @@
.parcel-cache/
dist/
node_modules/
example.wasm*

49
example/app.ts Normal file
View File

@@ -0,0 +1,49 @@
import { ZigJS } from 'zig-js';
const zjs = new ZigJS();
const importObject = {
module: {},
env: {
log: (ptr: number, len: number) => {
const view = new DataView(zjs.memory.buffer, ptr, Number(len));
const str = new TextDecoder('utf-8').decode(view);
console.log(str);
},
},
...zjs.importObject(),
};
const url = new URL('ghostty-wasm.wasm', import.meta.url);
fetch(url.href).then(response =>
response.arrayBuffer()
).then(bytes =>
WebAssembly.instantiate(bytes, importObject)
).then(results => {
const {
memory,
malloc,
free,
face_new,
face_free,
} = results.instance.exports;
// Give us access to the zjs value for debugging.
globalThis.zjs = zjs;
console.log(zjs);
// Initialize our zig-js memory
zjs.memory = memory;
// Create some memory for our string
const font = new TextEncoder().encode("monospace");
const font_ptr = malloc(font.byteLength);
try {
new Uint8Array(memory.buffer, font_ptr).set(font);
// Call whatever example you want:
const face = face_new(font_ptr, font.byteLength);
face_free(face);
} finally {
free(font_ptr);
}
});

View File

@@ -1,36 +1,11 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WASM Example</title>
</head>
<body>
<script>
const importObject = {
module: {},
env: {
// memory: new WebAssembly.Memory({ initial: 256 }),
}
};
fetch('ghostty-wasm.wasm').then(response =>
response.arrayBuffer()
).then(bytes =>
WebAssembly.instantiate(bytes, importObject)
).then(results => {
const {
atlas_new,
atlas_free,
atlas_reserve,
free,
memory,
} = results.instance.exports;
const atlas = atlas_new(512, 0);
const reg = atlas_reserve(atlas, 10, 10);
free(reg);
atlas_free(atlas);
});
</script>
</body>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Ghostty Example</title>
<script type="module" src="app.ts"></script>
</head>
<body>
Open your console, we are just debugging here.
</body>
</html>

4436
example/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

22
example/package.json Normal file
View File

@@ -0,0 +1,22 @@
{
"name": "ghostty example",
"version": "0.1.0",
"description": "Example showing ghostty and wasm.",
"source": "index.html",
"browserslist": "> 0.5%, last 2 versions, not dead",
"scripts": {
"start": "parcel",
"build": "parcel build",
"check": "tsc --noEmit"
},
"author": "Mitchell Hashimoto",
"license": "MIT",
"devDependencies": {
"@parcel/transformer-inline-string": "^2.8.0",
"parcel": "^2.8.0",
"typescript": "^4.9.3"
},
"dependencies": {
"zig-js": "file:../vendor/zig-js/js"
}
}