1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
|
<!DOCTYPE html>
<html style="height: 100%; overflow: hidden; overflow-x: hidden;">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel='icon' type='image/gif' href='/favicon.gif'>
<title> Reduced System Layer </title>
</head>
<body style="margin: 0; height: 100%; overflow: hidden; overflow-x: hidden;">
<canvas style="margin: 0; width: 100%; height: 100%;" id="frame" oncontextmenu="event.preventDefault()"></canvas>
<script type="text/javascript">
async function run() {
let canvas;
let program;
let memory_view;
let pixels_address;
let context;
let animation_frame;
canvas = document.getElementById("frame");
context = canvas.getContext("2d");
program = await WebAssembly.instantiateStreaming(
fetch("index.wasm"),
{
"wasi_snapshot_preview1" : {
clock_time_get : () => { return Date.now(); },
args_sizes_get : () => { throw new Error("Unexpected args_sizes_get call"); },
args_get : () => { throw new Error("Unexpected args_get call"); },
proc_exit : () => { throw new Error("Unexpected proc_exit call"); },
fd_close : () => { throw new Error("Unexpected fd_close call"); },
fd_write : () => { throw new Error("Unexpected fd_write call"); },
fd_seek : () => { throw new Error("Unexpected fd_seek call"); },
},
"env" : {
p_init : () => {
program.instance.exports.js_init();
memory_view = new Uint8Array(program.instance.exports.memory.buffer);
pixels_address = program.instance.exports.js_pixels();
},
p_render_frame_impl : () => {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
let data = new ImageData(
new Uint8ClampedArray(
memory_view.subarray(
pixels_address,
pixels_address + 4 * canvas.width * canvas.height
)
),
canvas.width,
canvas.height
);
context.putImageData(data, 0, 0);
},
p_cleanup : () => {},
p_handle_events : () => {},
p_wait_events : () => {},
p_sleep_for : (time) => {},
p_time : Date.now,
memset : (dst, val, num) => {
// FIXME PERF
for (let i = 0; i < num; ++i)
dst[i] = val;
},
memcpy : (dst, src, num) => {
// FIXME PERF
for (let i = 0; i < num; ++i)
dst[i] = src[i];
},
},
}
);
program.instance.exports.js_main();
animation_frame = (time) => {
program.instance.exports.js_frame(canvas.width, canvas.height);
window.requestAnimationFrame(animation_frame);
};
window.requestAnimationFrame(animation_frame);
}
run().catch((e) => console.error(e));
</script>
</body>
</html>
|
