moved 'background' to drawShapes for the time being
This commit is contained in:
@@ -146,6 +146,14 @@ export default class DrawShapes {
|
|||||||
this.horns = this.pipVertices[HEX][FLAT][6].concat(this.pipVertices[HEX][POINTY][6]);
|
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) {
|
pip (context, scale, cellX, cellY, vertexX, vertexY, pipRadius, pipDistance) {
|
||||||
const x = cellX + (pipDistance * vertexX);
|
const x = cellX + (pipDistance * vertexX);
|
||||||
const y = cellY + (pipDistance * vertexY);
|
const y = cellY + (pipDistance * vertexY);
|
||||||
|
|||||||
@@ -186,8 +186,8 @@ class Demo {
|
|||||||
Tessellate.Shapes.pips(context, scale, pixelPoint.getX(), pixelPoint.getY(), tile);
|
Tessellate.Shapes.pips(context, scale, pixelPoint.getX(), pixelPoint.getY(), tile);
|
||||||
}
|
}
|
||||||
|
|
||||||
draw({context, scale, tilePoints}) {
|
draw({context, height, width, scale, tilePoints}) {
|
||||||
this.tessellate.background({
|
Tessellate.Shapes.background(context, height, width, {
|
||||||
red: 64,
|
red: 64,
|
||||||
green: 32,
|
green: 32,
|
||||||
blue: 128,
|
blue: 128,
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ export default class Sketch {
|
|||||||
|
|
||||||
[
|
[
|
||||||
'getContext',
|
'getContext',
|
||||||
'background',
|
|
||||||
'onResize',
|
'onResize',
|
||||||
'render',
|
'render',
|
||||||
].map(method => this[method] = this[method].bind(this));
|
].map(method => this[method] = this[method].bind(this));
|
||||||
@@ -33,14 +32,6 @@ export default class Sketch {
|
|||||||
return this.context;
|
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) {
|
onResize (event) {
|
||||||
const width = this.container.offsetWidth;
|
const width = this.container.offsetWidth;
|
||||||
const height = this.container.offsetHeight;
|
const height = this.container.offsetHeight;
|
||||||
|
|||||||
@@ -212,18 +212,15 @@ export class Tessellate {
|
|||||||
return funky.flatten(this.cartographer.boundingBox(upperLeft, upperRight, lowerLeft, lowerRight));
|
return funky.flatten(this.cartographer.boundingBox(upperLeft, upperRight, lowerLeft, lowerRight));
|
||||||
}
|
}
|
||||||
|
|
||||||
background (color) {
|
|
||||||
this.sketch.background(color);
|
|
||||||
}
|
|
||||||
|
|
||||||
draw (context) {
|
draw (context) {
|
||||||
const canvas = context.canvas;
|
const canvas = context.canvas;
|
||||||
const width = canvas.width;
|
|
||||||
const height = canvas.height;
|
const height = canvas.height;
|
||||||
|
const width = canvas.width;
|
||||||
|
|
||||||
this.settings.draw({
|
this.settings.draw({
|
||||||
context,
|
context,
|
||||||
|
|
||||||
|
height, width,
|
||||||
scale: this.cartographer.getScale(),
|
scale: this.cartographer.getScale(),
|
||||||
|
|
||||||
tilePoints: this.getTilePoints({
|
tilePoints: this.getTilePoints({
|
||||||
|
|||||||
Reference in New Issue
Block a user