class Road {
	constructor(x, width, laneCount = 5) {
		this.x = x;
		this.width = width;
		this.laneCount = laneCount;

		this.left = x - width / 2;
		this.right = x + width / 2;

		const infinity = 1000000;
		this.top = -infinity;
		this.bottom = infinity;

		const topLeft = { x: this.left, y: this.top };
		const topRight = { x: this.right, y: this.top };
		const bottomLeft = { x: this.left, y: this.bottom };
		const bottomRight = { x: this.right, y: this.bottom };
		this.borders = [
			[topLeft, bottomLeft],
			[topRight, bottomRight],
		];
	}

	getLaneCenter(laneIndex) {
		const laneWidth = this.width / this.laneCount;
		return (
			this.left +
			laneWidth / 2 +
			Math.min(laneIndex, this.laneCount - 1) * laneWidth
		);
	}

	draw(ctx) {
		ctx.lineWidth = 5;
		ctx.strokeStyle = "white";

		for (let i = 1; i <= this.laneCount - 1; i++) {
			const x = lerp(
				this.left,
				this.right,
				i / this.laneCount
			);

			ctx.setLineDash([20, 20]);
			ctx.beginPath();
			ctx.moveTo(x, this.top);
			ctx.lineTo(x, this.bottom);
			ctx.stroke();
		}

		ctx.setLineDash([]);
		this.borders.forEach((border) => {
			ctx.beginPath();
			ctx.moveTo(border[0].x, border[0].y);
			ctx.lineTo(border[1].x, border[1].y);
			ctx.stroke();
		});
	}
}