60 lines
1.3 KiB
JavaScript
60 lines
1.3 KiB
JavaScript
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();
|
|
});
|
|
}
|
|
}
|