🐒🚨 Checkpoint

./script.js:9517054/19765
./data.js:9517054/7

data.js

@@ -2,7 +2,7 @@ export default {
   parts: [
     // x, y, width, height, type
     [100, 100, 200, 50],
-    [400, 50, 200, 50],
+    [400, 50, 200, 50, "win"],
     [700, 0, 50, 50],
     [900, -50, 50, 50],
     [1100, -100, 50, 100],

script.js

@@ -7,6 +7,7 @@ const ctx = canvas.getContext("2d");
 const render = {
   camera: [0, 0],
   size: [0, 0],
+  anim: [0, 0, 1],
 };
 
 function resize() {
@@ -31,7 +32,22 @@ function draw() {
   // draw background
   color("background");
   ctx.fillRect(0, 0, render.size[0], render.size[1]);
-  dots();
+  color("dots");
+  for (let i = 0; i < 40; i++) {
+    for (let j = 0; j < 30; j++) {
+      const spacing = 60;
+      const depth = 0.5;
+      ctx.beginPath();
+      ctx.arc(
+        i * spacing - (offx % (spacing / depth)) * depth,
+        j * spacing - (offy % (spacing / depth)) * depth,
+        5,
+        0,
+        2 * Math.PI
+      );
+      ctx.fill();
+    }
+  }
 
   // draw platforms
   for (let part of game.parts) {
@@ -47,24 +63,19 @@ function draw() {
   color("player");
   rect(game.player.x, game.player.y, game.player.size, game.player.size);
 
-  function dots() {
-    color("dots");
-
-    for (let i = 0; i < 40; i++) {
-      for (let j = 0; j < 30; j++) {
-        const spacing = 60;
-        const depth = 0.5;
-        ctx.beginPath();
-        ctx.arc(
-          i * spacing - (offx % (spacing / depth)) * depth,
-          j * spacing - (offy % (spacing / depth)) * depth,
-          5,
-          0,
-          2 * Math.PI
-        );
-        ctx.fill();
-      }
-    }
+  // draw animation
+  if (render.anim[2] < 1) {
+    ctx.strokeStyle = game.color.shadow;
+    ctx.lineWidth = 10;
+    ctx.beginPath();
+    ctx.arc(
+      ...point(render.anim[0], render.anim[1]),
+      render.anim[2] * 50,
+      0,
+      2 * Math.PI
+    );
+    ctx.stroke();
+    render.anim[2]+= 0.01;
   }
 }
 
@@ -81,13 +92,17 @@ function update() {
   if (i.right) p.velx += speed;
 
   // update position
-  if (!move("x", p.velx, p.velx < 0 ? -1 : 1)) {
+  if (move("x", p.velx, p.velx < 0 ? -1 : 1)) {
     p.velx = 0;
   }
 
   if (Math.abs(p.vely) > 3) p.canJump = false;
-  if (!move("y", p.vely, p.vely < 0 ? -1 : 1)) {
+  const collided = move("y", p.vely, p.vely < 0 ? -1 : 1);
+  if (collided) {
     if (p.vely >= 0) p.canJump = true;
+    if (collided[4] === "win") {
+      render.anim = [collided[0], collided[1], 0]
+    }
     p.vely = 0;
   }
 
@@ -109,12 +124,13 @@ function update() {
   function move(key, amt, speed) {
     for (let i = 0; i < Math.abs(amt) - 1; i++) {
       p[key] += speed;
-      if (collision()) {
+      const c = collision();
+      if (c) {
         p[key] -= speed;
-        return false;
+        return c;
       }
     }
-    return true;
+    return false;
   }
 
   function collision() {
@@ -125,7 +141,7 @@ function update() {
         p.y + s > part[1] &&
         p.x < part[0] + part[2] &&
         p.y < part[1] + part[3];
-      if (inside) return true;
+      if (inside) return part;
     }
     return false;
   }