diff --git a/web-demo/iframe-helper.js b/web-demo/iframe-helper.js new file mode 100644 index 0000000..f4b7918 --- /dev/null +++ b/web-demo/iframe-helper.js @@ -0,0 +1,13 @@ +if (window.frameElement) { + const body = document.body; + const observer = new ResizeObserver(() => { + window.parent.postMessage({ + cmd: "resize", + data: { + width: body.scrollWidth, + height: body.scrollHeight, + }, + }); + }); + observer.observe(body); +} diff --git a/web-demo/index.html b/web-demo/index.html index b7a08c7..8c1c34a 100644 --- a/web-demo/index.html +++ b/web-demo/index.html @@ -4,44 +4,31 @@ - Strafe Client - - - + + - - + diff --git a/web-demo/player.js b/web-demo/player.js new file mode 100644 index 0000000..d0a48c2 --- /dev/null +++ b/web-demo/player.js @@ -0,0 +1,36 @@ +import init, { + setup, + Graphics, + Bot, + PlaybackHead, +} from "./pkg/strafesnet_roblox_bot_player_wasm_module.js"; + +await init(); // load the wasm module + +const botBuf = await fetch("bhop_marble_7cf33a64-7120-4514-b9fa-4fe29d9523d.qbot").then((r) => r.arrayBuffer()); +const mapBuf = await fetch("bhop_marble_5692093612.snfm").then((r) => r.arrayBuffer()); + +const canvas = document.querySelector('canvas'); + +const context = await setup(canvas); +const graphics = new Graphics(context, new Uint8Array(mapBuf)); +const bot = new Bot(new Uint8Array(botBuf)); +const playback = new PlaybackHead(0); + +const startTime = performance.now(); + +function animate(now) { + const elapsedMs = now - startTime; + const elapsedSec = elapsedMs / 1000; // wasm expects seconds + + // Advance the playback head to the current time + playback.advance_time(bot, elapsedSec); + + // Render the frame that the bot is at that time + graphics.render(bot, playback, elapsedSec); + + // Keep the loop going + requestAnimationFrame(animate); +} + +requestAnimationFrame(animate); diff --git a/web-demo/player.ts b/web-demo/player.ts deleted file mode 100644 index e69de29..0000000