jketreno/peddlers-of-ketran
1
0
Fork 0
Code Issues 42 Activity

Fix highlight of rolled total

Browse Source 
Signed-off-by: James Ketrenos <james_gitlab@ketrenos.com>
This commit is contained in:
James Ketrenos 2020-04-11 00:27:35 -07:00
parent 0599cf2f99
commit a22c360d90
1 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/Board.js
View File

@ -87,7 +87,7 @@ const Pips = (board) => {
file = 'pip-numbers.png'; file = 'pip-numbers.png';
let pips = [ let pips = [
{ roll: 0, pips: 0, y: 3. / 6., x: 0. / 6. }, { roll: 7, pips: 0, y: 3. / 6., x: 0. / 6. },
{ roll: 5, pips: 4, y: 0. / 6., x: 0. / 6. }, { roll: 5, pips: 4, y: 0. / 6., x: 0. / 6. },
{ roll: 2, pips: 1, y: 0. / 6., x: 1. / 6. }, { roll: 2, pips: 1, y: 0. / 6., x: 1. / 6. },
{ roll: 6, pips: 5, y: 0. / 6., x: 2. / 6. }, { roll: 6, pips: 5, y: 0. / 6., x: 2. / 6. },
@ -525,6 +525,20 @@ class Board extends React.Component {
this.drawPips(ctx); this.drawPips(ctx);
ctx.restore(); ctx.restore();
ctx.fillStyle = "rgba(128, 128, 0, 0.125)";
ctx.strokeStyle = "rgba(255, 255, 0, 0.5)";
const roll = dice[0].pips + dice[1].pips;
if (roll) this.tiles.forEach((tile) => {
if (tile.pip.roll == roll) {
ctx.save();
ctx.beginPath();
ctx.arc(tile.pos.x, tile.pos.y, tileHeight * 0.5, 0, Math.PI * 2);
ctx.fill();
ctx.stroke();
ctx.restore();
}
});
if (this.closest.tile) { if (this.closest.tile) {
ctx.save(); ctx.save();
ctx.translate(this.closest.tile.pos.x, this.closest.tile.pos.y); ctx.translate(this.closest.tile.pos.x, this.closest.tile.pos.y);
@ -680,8 +694,8 @@ class Board extends React.Component {
const image = this.pips.image, pipSize = 0.06; const image = this.pips.image, pipSize = 0.06;
function drawTile(tile, angle, radius) { function drawTile(tile, angle, radius) {
tile.pos.x = Math.sin(angle) * radius; tile.pos.x = Math.sin(-angle) * radius;
tile.pos.y = Math.cos(angle) * radius; tile.pos.y = Math.cos(-angle) * radius;
const image = tile.image; const image = tile.image;
ctx.save(); ctx.save();
ctx.rotate(angle); ctx.rotate(angle);
@ -728,13 +742,7 @@ class Board extends React.Component {
} }
this.tiles[i].pip = pip; this.tiles[i].pip = pip;
drawTile(this.tiles[i], angle, radius - (i % 2) * 0.04); drawTile(this.tiles[i], angle, radius - (i % 2) * 0.04);
if (roll == pip.roll) {
ctx.scale(1.25, 1.25);
}
drawPip(pip, angle, radius - (i % 2) * 0.04, this.tiles[i].jitter); drawPip(pip, angle, radius - (i % 2) * 0.04, this.tiles[i].jitter);
if (roll == pip.roll) {
ctx.scale(0.8, 0.8);
}
} }
/* Middle row */ /* Middle row */
@ -749,13 +757,7 @@ class Board extends React.Component {
} }
this.tiles[i].pip = pip; this.tiles[i].pip = pip;
drawTile(this.tiles[i], angle, radius); drawTile(this.tiles[i], angle, radius);
if (roll == pip.roll) {
ctx.scale(1.25, 1.25);
}
drawPip(pip, angle, radius, this.tiles[i].jitter); drawPip(pip, angle, radius, this.tiles[i].jitter);
if (roll == pip.roll) {
ctx.scale(0.8, 0.8);
}
} }
/* Center */ /* Center */
@ -767,13 +769,7 @@ class Board extends React.Component {
} }
this.tiles[i].pip = pip; this.tiles[i].pip = pip;
drawTile(this.tiles[i], 0, 0); drawTile(this.tiles[i], 0, 0);
if (roll == pip.roll) {
ctx.scale(1.25, 1.25);
}
drawPip(pip, 0, 0, this.tiles[i].jitter); drawPip(pip, 0, 0, this.tiles[i].jitter);
if (roll == pip.roll) {
ctx.scale(0.8, 0.8);
}
} }
drawBorders(ctx) { drawBorders(ctx) {