gavin/Tessellate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

put an outline around the pips

Browse Source
This commit is contained in:
Gavin McDonald
2018-09-13 21:55:04 -04:00
parent 49cea85115
commit 4b5621b074
1 changed files with 31 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/drawShapes.js
View File

@@ -10,6 +10,7 @@ const DEFAULTS = {
red: 255,
blue: 255,
green: 255,
alpha: 0.8,
},
horns: {
@@ -34,13 +35,24 @@ const DEFAULTS = {
},
pip: {
scale: 0.15,
distance: 0.4,
color: {
red: 0,
blue: 0,
green: 0,
border: {
scale: 0.17,
color: {
red: 255,
blue: 255,
green: 255,
alpha: 0.8,
},
},
body: {
scale: 0.15,
color: {
red: 0,
blue: 0,
green: 0,
},
},
distance: 0.4,
},
sides: 6,
@@ -168,16 +180,26 @@ export default class DrawShapes {
if (this.pipVertices[tileStyle]
&& this.pipVertices[tileStyle][orientation]
&& this.pipVertices[tileStyle][orientation][pips]) {
const pipRadius = scale * pip.scale;
const pipBodyRadius = scale * pip.body.scale;
const pipBorderRadius = scale * pip.border.scale;
const pipDistance = scale * pip.distance;
context.beginPath();
this.pipVertices[tileStyle][orientation][pips]
.forEach(([pipX, pipY]) => this.pip(context, scale, x,y, pipX, pipY, pipRadius, pipDistance));
.forEach(([pipX, pipY]) => this.pip(context, scale, x,y, pipX, pipY, pipBorderRadius, pipDistance));
context.closePath();
context.fillStyle = getColor(pip.color);
context.fillStyle = getColor(pip.border.color);
context.fill();
context.beginPath();
this.pipVertices[tileStyle][orientation][pips]
.forEach(([pipX, pipY]) => this.pip(context, scale, x,y, pipX, pipY, pipBodyRadius, pipDistance));
context.closePath();
context.fillStyle = getColor(pip.body.color);
context.fill();
}
}