Drawing Mines (#13)
This commit is contained in:
@@ -1,56 +1,14 @@
|
||||
import {sqrt2} from './utils.js';
|
||||
import {FLAT, POINTY} from './consts.js';
|
||||
|
||||
const DEFAULTS = {
|
||||
flagScale: 0.5,
|
||||
pipScale: 0.15,
|
||||
pipDistance: 0.4,
|
||||
};
|
||||
|
||||
export default class DrawSquare {
|
||||
constructor(settings) {
|
||||
this.settings = Object.assign({}, DEFAULTS, settings);
|
||||
this.settings = Object.assign({}, settings);
|
||||
|
||||
this.squareX = [1, 1, -1, -1];
|
||||
this.squareY = [1, -1, -1, 1];
|
||||
this.diamondX = [sqrt2, 0, -sqrt2, 0, sqrt2 / 2, -sqrt2 / 2];
|
||||
this.diamondY = [0, -sqrt2, 0, sqrt2, -sqrt2 / 2, sqrt2 / 2];
|
||||
|
||||
this.squarePips = {};
|
||||
this.squarePips[FLAT] = [];
|
||||
this.squarePips[POINTY] = [];
|
||||
|
||||
const flatPipVerticesX = [0].concat(this.squareX).concat([this.squareX[1], this.squareX[3], 0, 0]);
|
||||
const flatPipVerticesY = [0].concat(this.squareY).concat([0, 0, this.squareY[1], this.squareY[3]]);
|
||||
|
||||
const getFlatVertex = n => [flatPipVerticesX[n], flatPipVerticesY[n]];
|
||||
|
||||
// start with 0,0 as center
|
||||
this.squarePips[FLAT][1] = [0].map(getFlatVertex);
|
||||
this.squarePips[FLAT][2] = [1, 3].map(getFlatVertex);
|
||||
this.squarePips[FLAT][3] = [0, 1, 3].map(getFlatVertex);
|
||||
this.squarePips[FLAT][4] = [1, 2, 3, 4].map(getFlatVertex);
|
||||
this.squarePips[FLAT][5] = [0, 1, 2, 3, 4].map(getFlatVertex);
|
||||
this.squarePips[FLAT][6] = [1, 2, 3, 4, 5, 6].map(getFlatVertex);
|
||||
this.squarePips[FLAT][7] = [0, 1, 2, 3, 4, 5, 6].map(getFlatVertex);
|
||||
this.squarePips[FLAT][8] = [1, 2, 3, 4, 5, 6, 7, 8].map(getFlatVertex);
|
||||
this.squarePips[FLAT][9] = [0, 1, 2, 3, 4, 5, 6, 7, 8].map(getFlatVertex);
|
||||
|
||||
const pointyPipVerticesX = [0].concat(this.diamondX).concat([this.diamondX[4], this.diamondX[5]]);
|
||||
const pointyPipVerticesY = [0].concat(this.diamondY).concat([this.diamondY[5], this.diamondY[4]]);
|
||||
|
||||
const getPointyVertex = n => [pointyPipVerticesX[n], pointyPipVerticesY[n]];
|
||||
|
||||
// start with 0,0 as center
|
||||
this.squarePips[POINTY][1] = [0].map(getPointyVertex);
|
||||
this.squarePips[POINTY][2] = [1, 3].map(getPointyVertex);
|
||||
this.squarePips[POINTY][3] = [0, 1, 3].map(getPointyVertex);
|
||||
this.squarePips[POINTY][4] = [1, 2, 3, 4].map(getPointyVertex);
|
||||
this.squarePips[POINTY][5] = [0, 1, 2, 3, 4].map(getPointyVertex);
|
||||
this.squarePips[POINTY][6] = [1, 2, 3, 4, 5, 6].map(getPointyVertex);
|
||||
this.squarePips[POINTY][7] = [0, 1, 2, 3, 4, 5, 6].map(getPointyVertex);
|
||||
this.squarePips[POINTY][8] = [1, 2, 3, 4, 5, 6, 7, 8].map(getPointyVertex);
|
||||
this.squarePips[POINTY][9] = [0, 1, 2, 3, 4, 5, 6, 7, 8].map(getPointyVertex);
|
||||
}
|
||||
|
||||
fill(context, scale, x, y, cell) {
|
||||
@@ -84,42 +42,5 @@ export default class DrawSquare {
|
||||
context.strokeStyle = cell.getColor();
|
||||
context.stroke();
|
||||
}
|
||||
|
||||
pip(context, scale, cellX, cellY, vertexX, vertexY, pipRadius, pipDistance) {
|
||||
const x = cellX + (pipDistance * vertexX);
|
||||
const y = cellY + (pipDistance * vertexY);
|
||||
|
||||
context.moveTo(x, y);
|
||||
context.arc(x, y, pipRadius, 0, Math.PI*2, true);
|
||||
}
|
||||
|
||||
pips(context, scale, x, y, cell) {
|
||||
const {orientation, pips} = cell;
|
||||
|
||||
if (this.squarePips[orientation] && this.squarePips[orientation][pips]) {
|
||||
const pipRadius = scale * this.settings.pipScale;
|
||||
const pipDistance = scale * this.settings.pipDistance;
|
||||
|
||||
context.beginPath();
|
||||
|
||||
this.squarePips[orientation][pips]
|
||||
.forEach(([pipX, pipY]) => this.pip(context, scale, x, y, pipX, pipY, pipRadius, pipDistance));
|
||||
|
||||
context.closePath();
|
||||
context.fillStyle = 'rgb(0,0,0)';
|
||||
context.fill();
|
||||
}
|
||||
}
|
||||
|
||||
flag (context, scale, x, y) {
|
||||
context.beginPath();
|
||||
|
||||
context.moveTo(x, y);
|
||||
context.arc(x, y, scale * this.settings.flagScale, 0, Math.PI*2, true);
|
||||
|
||||
context.closePath();
|
||||
context.fillStyle = 'rgb(255,0,0)';
|
||||
context.fill();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user