diff --git a/src/drawShapes.js b/src/drawShapes.js index 6d9a235..7db5311 100644 --- a/src/drawShapes.js +++ b/src/drawShapes.js @@ -146,6 +146,14 @@ export default class DrawShapes { this.horns = this.pipVertices[HEX][FLAT][6].concat(this.pipVertices[HEX][POINTY][6]); } + background (context, height, width, color) { + context.beginPath(); + context.rect(0, 0, width, height); + context.fillStyle = getColor(color); + context.closePath(); + context.fill(); + } + pip (context, scale, cellX, cellY, vertexX, vertexY, pipRadius, pipDistance) { const x = cellX + (pipDistance * vertexX); const y = cellY + (pipDistance * vertexY); diff --git a/src/main.js b/src/main.js index 826e9f5..93fb122 100644 --- a/src/main.js +++ b/src/main.js @@ -186,8 +186,8 @@ class Demo { Tessellate.Shapes.pips(context, scale, pixelPoint.getX(), pixelPoint.getY(), tile); } - draw({context, scale, tilePoints}) { - this.tessellate.background({ + draw({context, height, width, scale, tilePoints}) { + Tessellate.Shapes.background(context, height, width, { red: 64, green: 32, blue: 128, diff --git a/src/sketch.js b/src/sketch.js index dadb30c..3b99ef5 100644 --- a/src/sketch.js +++ b/src/sketch.js @@ -6,7 +6,6 @@ export default class Sketch { [ 'getContext', - 'background', 'onResize', 'render', ].map(method => this[method] = this[method].bind(this)); @@ -33,14 +32,6 @@ export default class Sketch { return this.context; } - background ({red, green, blue, alpha}) { - this.context.beginPath(); - this.context.rect(0, 0, this.canvas.width, this.canvas.height); - this.context.fillStyle = getColor({red, green, blue, alpha}); - this.context.closePath(); - this.context.fill(); - } - onResize (event) { const width = this.container.offsetWidth; const height = this.container.offsetHeight; diff --git a/src/tessellate.js b/src/tessellate.js index 59cf1c6..3b98202 100644 --- a/src/tessellate.js +++ b/src/tessellate.js @@ -212,18 +212,15 @@ export class Tessellate { return funky.flatten(this.cartographer.boundingBox(upperLeft, upperRight, lowerLeft, lowerRight)); } - background (color) { - this.sketch.background(color); - } - draw (context) { const canvas = context.canvas; - const width = canvas.width; const height = canvas.height; + const width = canvas.width; this.settings.draw({ context, + height, width, scale: this.cartographer.getScale(), tilePoints: this.getTilePoints({