So, what if I wanted to dynamically change each individual rgba argument of color(), can I say this.col.r = 200; , or some equivalent?
let btn;
function setup() {
createCanvas(400, 400);
btn = new Btn(color(50, 127, 219, 255));
}
function draw() {
clear();
btn.run();
}
class Btn {
constructor(_col) {
this.col = _col;
this.pos = createVector(width >> 1, height >> 1);
this.r = 33;
}
display() {
if (this.hover()) {
fill(this.col, this.col.a); // this is ignoring alpha
if (this.col.a < 255) {
this.col.a += 0.3;
}
} else {
noFill();
strokeWeight(3);
stroke(this.col);
this.col.a = 0;
}
ellipse(this.pos.x, this.pos.y, this.r);
return this;
}
hover() {
let d = dist(mouseX, mouseY, this.pos.x, this.pos.y);
if (d <= this.r >> 1) {
return true;
} else {
return false;
}
}
run() {
return this.display().hover();
}
}