js: fix movement jump on tick

1 files changed, 7 insertions, 5 deletions

diff --git a/site/main.mjs b/site/main.mjs
index 877c0bc..958e82d 100644
--- a/site/main.mjs
+++ b/site/main.mjs
@@ -200,6 +200,13 @@ async function loaded() {
             renderTextHighlight(trans);
 
             robo.lastTick = document.timeline.currentTime;
+
+            const canvas = document.querySelector(CANVAS_SELECTOR);
+            const [x, y] = clamp(25, robo.x + robo.speedx, robo.y + robo.speedy, canvas.width, canvas.height);
+            robo.x = x;
+            robo.y = y;
+            renderArena([robo]);
+
             robo.heading = trans.vars.heading;
             robo.speed = trans.vars.speed;
             const [speedx, speedy] = [
@@ -208,11 +215,6 @@ async function loaded() {
             ].map(x => robo.speed * x);
             robo.speedx = speedx;
             robo.speedy = speedy;
-            const canvas = document.querySelector(CANVAS_SELECTOR);
-            const [x, y] = clamp(25, robo.x + speedx, robo.y + speedy, canvas.width, canvas.height);
-            robo.x = x;
-            robo.y = y;
-            renderArena([robo]);
             break;
         default:
             console.error('invalid message from robo worker', e.data);