From a487890d838e47f67108bf1bfdceeba5255aab0a Mon Sep 17 00:00:00 2001 From: Arne Keller Date: Tue, 1 Feb 2022 17:48:16 +0100 Subject: [PATCH] Handle low FPS better --- game.html | 1 + game.js | 12 +++++++----- main.css | 8 ++++++++ 3 files changed, 16 insertions(+), 5 deletions(-) diff --git a/game.html b/game.html index 987850b..fcc70d0 100644 --- a/game.html +++ b/game.html @@ -10,6 +10,7 @@
Score: 0
+
Version 1.1
diff --git a/game.js b/game.js index 1dea91b..3b221f7 100644 --- a/game.js +++ b/game.js @@ -114,7 +114,7 @@ let running = false; const spheres = []; // wall segments const borders = []; -let frameCount = 0; +let time = Date.now() / 1000.0; function logger(text) { console.log(text); @@ -296,7 +296,6 @@ document.getElementById("start").onclick = () => { borders.length = 0; removed = 0; lastSpawned = 0; - frameCount = 0; camera.position.set(0, 10, 25); camera.lookAt(scene.position); running = true; @@ -346,10 +345,13 @@ function onWindowResize() { // main render/update function called once per frame function animate() { + let now = Date.now() / 1000.0; + let delta = now - time; + time = now; + requestAnimationFrame(animate); - uniforms.iTime.value = frameCount / 60.0; - frameCount++; + uniforms.iTime.value += delta; if (running) { @@ -385,7 +387,7 @@ function animate() { if (running) { // advance player position, increase speed, handle movement input - camera.position.z -= 0.5 * speed; + camera.position.z -= 0.5 * speed * delta * 60.0; speed += 0.01; if (!Number.isNaN(leftRightMove)) { camera.position.x += 0.1 * leftRightMove; diff --git a/main.css b/main.css index 772d7b9..a284b69 100644 --- a/main.css +++ b/main.css @@ -41,3 +41,11 @@ button { pointer-events: none; z-index: 1; } + +#version { + position: absolute; + bottom: 10px; + right: 10px; + font-size: small; + z-index: 1; +}