49 lines
1.5 KiB
JavaScript
49 lines
1.5 KiB
JavaScript
|
|
import {sqrt2} from './utils.js';
|
|
|
|
export default class DrawSquare {
|
|
constructor(settings) {
|
|
this.squareX = [1, 1, -1, -1];
|
|
this.squareY = [1, -1, -1, 1];
|
|
this.diamondX = [sqrt2, 0, -sqrt2, 0];
|
|
this.diamondY = [0, -sqrt2, 0, sqrt2];
|
|
}
|
|
|
|
filled(context, cell) {
|
|
let x = cell.x;
|
|
let y = cell.y;
|
|
let scale = cell.scale;
|
|
let squareCornerX = cell.pointyTop ? this.diamondX : this.squareX;
|
|
let squareCornerY = cell.pointyTop ? this.diamondY : this.squareY;
|
|
|
|
context.beginPath();
|
|
context.moveTo(x + scale * squareCornerX[0], y + scale * squareCornerY[0]);
|
|
context.lineTo(x + scale * squareCornerX[1], y + scale * squareCornerY[1]);
|
|
context.lineTo(x + scale * squareCornerX[2], y + scale * squareCornerY[2]);
|
|
context.lineTo(x + scale * squareCornerX[3], y + scale * squareCornerY[3]);
|
|
|
|
context.fillStyle = cell.getColor();
|
|
context.fill();
|
|
}
|
|
|
|
outline(context, cell) {
|
|
let x = cell.x;
|
|
let y = cell.y;
|
|
let scale = cell.scale;
|
|
let squareCornerX = cell.pointyTop ? this.diamondX : this.squareX;
|
|
let squareCornerY = cell.pointyTop ? this.diamondY : this.squareY;
|
|
|
|
context.beginPath();
|
|
context.moveTo(x + scale * squareCornerX[0], y + scale * squareCornerY[0]);
|
|
context.lineTo(x + scale * squareCornerX[1], y + scale * squareCornerY[1]);
|
|
context.lineTo(x + scale * squareCornerX[2], y + scale * squareCornerY[2]);
|
|
context.lineTo(x + scale * squareCornerX[3], y + scale * squareCornerY[3]);
|
|
context.closePath();
|
|
|
|
context.lineWidth = cell.width;
|
|
context.strokeStyle = cell.getColor();
|
|
context.stroke();
|
|
}
|
|
}
|
|
|