🚀 demo + spring

packages/draw/drawWorld.ts

@@ -1,9 +1,9 @@
 import { Grid, Color } from "@snk/compute/grid";
 import { drawGrid } from "./drawGrid";
 import { Snake } from "@snk/compute/snake";
-import { drawSnake } from "./drawSnake";
+import { drawSnake, drawSnakeLerp } from "./drawSnake";
 
-type Options = {
+export type Options = {
   colorDots: Record<Color, string>;
   colorEmpty: string;
   colorBorder: string;
@@ -62,3 +62,26 @@ export const drawWorld = (
   // drawCircleStack(ctx, stack, o);
   // ctx.restore();
 };
+
+export const drawLerpWorld = (
+  ctx: CanvasRenderingContext2D,
+  grid: Grid,
+  snake0: Snake,
+  snake1: Snake,
+  stack: Color[],
+  k: number,
+  o: Options
+) => {
+  ctx.save();
+
+  ctx.translate(1 * o.sizeCell, 2 * o.sizeCell);
+  drawGrid(ctx, grid, o);
+  drawSnakeLerp(ctx, snake0, snake1, k, o);
+
+  ctx.translate(0, (grid.height + 2) * o.sizeCell);
+
+  const max = grid.data.reduce((sum, x) => sum + +!!x, stack.length);
+  drawStack(ctx, stack, max, grid.width * o.sizeCell, o);
+
+  ctx.restore();
+};