Get fading in working

This commit is contained in:
Luke Murphy 2020-01-31 17:44:56 +01:00
parent ceefcce269
commit 85dbd54cab
No known key found for this signature in database
GPG Key ID: 5E2EF5A63E3718CC

View File

@ -150,7 +150,8 @@ class GeneratedShape {
this.points = [];
this.calculatePoints();
this.colour = this.colour();
this.opacity = 0;
this.colour = this.chooseColour();
}
collide(shapes) {
@ -183,15 +184,6 @@ class GeneratedShape {
return false;
}
colour() {
/**
* Choose a colour for the shape.
**/
var colours = ["red", "blue", "green", "black", "white"];
var index = floor(random(0, colours.length));
return colours[index];
}
sound() {
/**
* Play a sound after a collision is detected.
@ -208,40 +200,48 @@ class GeneratedShape {
/**
* Move the shape around the canvas.
**/
// this.x = this.x + this.xSpeed * this.xDirection;
// this.y = this.y + this.ySpeed * this.yDirection;
return;
}
// if (this.x > width - this.w || this.x < this.w) {
// this.xDirection *= -1;
// }
// if (this.y > height - this.h || this.y < this.h) {
// this.yDirection *= -1;
// }
// TODO: make the polygon move ...
// for each vector in this.points, add/subtract/etc.
for (var i = 0; i < this.points.length; i++) {
this.points[i].x = this.points[i].x + this.xSpeed * this.xDirection;
this.points[i].y = this.points[i].y + this.ySpeed * this.yDirection;
if (this.points[i].x > width || this.points[i].x <= 0) {
this.xDirection *= -1;
console.log('this is the max width: ', width);
}
if (this.points[i].y > height || this.points[i].y <= 0) {
this.yDirection *= -1;
console.log('this is the max height: ', height);
}
fadein() {
/**
* Fade intro the shape.
**/
if (this.opacity < 256) {
let currentAlpha = this.colour._getAlpha();
this.colour.setAlpha(currentAlpha + random(0, 3));
} else {
this.opacity = 256;
}
}
chooseColour() {
/**
* Choose a colour for the shape.
**/
let colourChoices = [
color("red"),
color("blue"),
color("green"),
color("black"),
color("white")
];
let index = floor(random(0, colourChoices.length));
let chosenColour = colourChoices[index];
chosenColour.setAlpha(this.opacity);
return chosenColour;
}
display() {
/**
* Show the shape on the canvas.
**/
// TODO: use getSoundInfo function to influence how shape is drawn
if (this.opacity != 256) {
this.fadein();
}
fill(this.colour);
this.createShape();
}