carpentry/client/js/game/Board.js

import { Point } from "../libraries/spatial/Point.js";
import { Global } from "../libraries/Global.js";

export class Board {
    constructor(state, x = 0, y = 0) {
        this.position = new Point(x, y);
        this.state = state;
    }

    update(delta) {
    }

    draw(ctx) {
        ctx.save()
        ctx.translate(this.position.x, this.position.y)

        ctx.strokeStyle = "magenta"

        let boardWidth = this.state.tileWidth * 11;
        let boardPadding = (Global.screenBounds.width - boardWidth) / 2

        for(let i = 0; i < 100; i++) {
            ctx.beginPath()
            ctx.rect(i % 10 * this.state.tileWidth + boardPadding + (this.state.tileWidth / 2), Math.floor(i / 10) * this.state.tileWidth + (this.state.tileWidth / 2), this.state.tileWidth, this.state.tileWidth)
            ctx.closePath();
            ctx.stroke();
        }

        ctx.restore();
    }
}