1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
import { RenderedGrid } from "./renderGrid";
import colors from "open-color";
export default function drawGrid(
ctx: CanvasRenderingContext2D,
grid: RenderedGrid,
) {
ctx.clearRect(0, 0, grid.rect.width, grid.rect.height);
ctx.fillStyle = colors.gray[8];
ctx.fillRect(0, 0, grid.rect.width, grid.rect.height);
ctx.strokeStyle = colors.gray[7];
grid.renderedRows.forEach((row, renderedRowIndex) => {
const isLastRow = renderedRowIndex === grid.renderedRows.length - 1;
row.renderedCells.forEach((cell, cellIndex) => {
const { topLeft, width, height } = cell.rect;
const isLastCell = cellIndex === row.renderedCells.length - 1;
ctx.strokeRect(
topLeft.x + 0.5,
topLeft.y + 0.5,
isLastCell ? width - 1 : width,
isLastRow ? height - 1 : height,
);
});
});
}
|
