mirror of
https://github.com/exoticorn/microw8.git
synced 2026-01-20 11:16:42 +01:00
some styling and uw8.ram -> env.memory
This commit is contained in:
Binary file not shown.
@@ -3,13 +3,19 @@
|
||||
<head>
|
||||
<meta charset="utf8" />
|
||||
<title>MicroW8</title>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@500&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
@import "style.css";
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="screen" width="320" height="256"></canvas>
|
||||
<div id="centered">
|
||||
<canvas id="screen" width="640" height="512"></canvas>
|
||||
<div id="message"></div>
|
||||
<input id="cart" type="file" accept=".wasm,.uw8,application/wasm">
|
||||
</div>
|
||||
</body>
|
||||
<script type="module">
|
||||
import "./main.js";
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -16,6 +16,14 @@ function setMessage(size, error) {
|
||||
document.getElementById('message').innerHTML = html;
|
||||
}
|
||||
|
||||
let framebufferCanvas = document.createElement("canvas");
|
||||
framebufferCanvas.width = 320;
|
||||
framebufferCanvas.height = 256;
|
||||
let framebufferCanvasCtx = framebufferCanvas.getContext("2d");
|
||||
let imageData = framebufferCanvasCtx.createImageData(320, 256);
|
||||
let canvasCtx = document.getElementById('screen').getContext('2d');
|
||||
canvasCtx.imageSmoothingEnabled = false;
|
||||
|
||||
let cancelFunction;
|
||||
|
||||
async function runModule(data) {
|
||||
@@ -41,19 +49,18 @@ async function runModule(data) {
|
||||
}
|
||||
newURL += '#' + btoa(dataString);
|
||||
}
|
||||
if(newURL != window.location.href) {
|
||||
history.replaceState(null, null, newURL);
|
||||
if(newURL != window.location.pathname + window.location.hash) {
|
||||
history.pushState(null, null, newURL);
|
||||
}
|
||||
|
||||
try {
|
||||
|
||||
let loaderImport = {
|
||||
uw8: {
|
||||
ram: new WebAssembly.Memory({ initial: 8 })
|
||||
env: {
|
||||
memory: new WebAssembly.Memory({ initial: 8 })
|
||||
}
|
||||
};
|
||||
let loadMem = loaderImport.uw8.ram.buffer;
|
||||
let loadMem = loaderImport.env.memory.buffer;
|
||||
let loader = await loadWasm(loaderUrl, loaderImport);
|
||||
|
||||
let baseModule = await (await fetch(baseUrl)).arrayBuffer();
|
||||
@@ -70,27 +77,20 @@ async function runModule(data) {
|
||||
}
|
||||
|
||||
let importObject = {
|
||||
uw8: {
|
||||
ram: new WebAssembly.Memory({ initial: 8, maximum: 8 }),
|
||||
env: {
|
||||
memory: new WebAssembly.Memory({ initial: 8, maximum: 8 }),
|
||||
}
|
||||
};
|
||||
|
||||
let instance = new WebAssembly.Instance(await WebAssembly.compile(data), importObject);
|
||||
|
||||
let canvasCtx = document.getElementById('screen').getContext('2d');
|
||||
let imageData = canvasCtx.createImageData(320, 256);
|
||||
|
||||
let buffer = imageData.data;
|
||||
for(let i = 0; i < 320*256; ++i) {
|
||||
buffer[i * 4 + 3] = 255;
|
||||
}
|
||||
|
||||
let startTime = Date.now();
|
||||
|
||||
let keepRunning = true;
|
||||
cancelFunction = () => keepRunning = false;
|
||||
|
||||
|
||||
function mainloop() {
|
||||
if(!keepRunning) {
|
||||
return;
|
||||
@@ -99,13 +99,15 @@ async function runModule(data) {
|
||||
try {
|
||||
instance.exports.tic(Date.now() - startTime);
|
||||
|
||||
let framebuffer = new Uint8Array(importObject.uw8.ram.buffer.slice(120, 120 + 320*256));
|
||||
let framebuffer = new Uint8Array(importObject.env.memory.buffer.slice(120, 120 + 320*256));
|
||||
for(let i = 0; i < 320*256; ++i) {
|
||||
buffer[i * 4] = framebuffer[i];
|
||||
buffer[i * 4 + 1] = framebuffer[i];
|
||||
buffer[i * 4 + 2] = framebuffer[i];
|
||||
buffer[i * 4 + 3] = 255;
|
||||
}
|
||||
canvasCtx.putImageData(imageData, 0, 0);
|
||||
framebufferCanvasCtx.putImageData(imageData, 0, 0);
|
||||
canvasCtx.drawImage(framebufferCanvas, 0, 0, 640, 512);
|
||||
|
||||
window.requestAnimationFrame(mainloop);
|
||||
} catch(err) {
|
||||
@@ -127,6 +129,8 @@ function runModuleFromHash() {
|
||||
let base64Data = window.location.hash.slice(1);
|
||||
if(base64Data.length > 0) {
|
||||
runModuleFromURL('data:;base64,' + base64Data);
|
||||
} else {
|
||||
runModule(new ArrayBuffer(0));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
22
web/src/style.css
Normal file
22
web/src/style.css
Normal file
@@ -0,0 +1,22 @@
|
||||
html {
|
||||
font-family: 'Josefin Sans', sans-serif;
|
||||
background-color: #202024;
|
||||
color: #808070;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
canvas {
|
||||
margin: 8px;
|
||||
box-shadow: 5px 5px 20px black;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: red;
|
||||
}
|
||||
Binary file not shown.
Reference in New Issue
Block a user