From a6336c5d113a85fb9712fbbdc72e1dab62fa1ed3 Mon Sep 17 00:00:00 2001 From: Dennis Ranke Date: Wed, 3 Nov 2021 09:15:31 +0100 Subject: [PATCH] some styling and uw8.ram -> env.memory --- web/src/base.wasm | Bin 91 -> 94 bytes web/src/index.html | 18 ++++++++++++------ web/src/main.js | 36 ++++++++++++++++++++---------------- web/src/style.css | 22 ++++++++++++++++++++++ web/src/uw8loader.wasm | Bin 382 -> 385 bytes 5 files changed, 54 insertions(+), 22 deletions(-) create mode 100644 web/src/style.css diff --git a/web/src/base.wasm b/web/src/base.wasm index 2182ab7ad5d967a94fc804140b415635231bf78c..191b814c83026598cbab6573d56651d7924d5243 100644 GIT binary patch delta 35 qcma!!lVwOO&Shj^U|?irOkk{MVB%+FPR%Q0%T3MAFRGj< MicroW8 + + - -
- - +
+ +
+ +
+ \ No newline at end of file diff --git a/web/src/main.js b/web/src/main.js index f88dae5..6df65fb 100644 --- a/web/src/main.js +++ b/web/src/main.js @@ -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)); } } diff --git a/web/src/style.css b/web/src/style.css new file mode 100644 index 0000000..dc8f265 --- /dev/null +++ b/web/src/style.css @@ -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; +} diff --git a/web/src/uw8loader.wasm b/web/src/uw8loader.wasm index 9b9ac4f338a6ccd48bbe3892d86f0c7f990b027a..17036820ceada1e8b6b86309e2281c0f190eeab9 100644 GIT binary patch delta 24 fcmeyz)W|$Rm6xB9IW@10EjKkczo>GfzCR-XTdxOl delta 21 ccmZo<{>L;ym5YawxwPDZxhOGrqme%&077mB?f?J)