xxxxxxxxxx
let rects = [];
let triangles = [];
c = 24;
function setup() {
createCanvas(windowWidth, windowHeight);
frameRate(c);
}
function mousePressed() {
let l = random(10, 50);
let rect = new Rectangle(mouseX, mouseY, l);
let tri = new Triangle(mouseX, mouseY, mouseX + 30, mouseY + 60, mouseX + 60, mouseY + 30);
rects.push(rect);
triangles.push(tri);
}
function draw() {
background(c);
for (let rect of rects) {
rect.move();
rect.show();
}
for (let tri of triangles) {
tri.move();
tri.show();
}
}
class Rectangle {
constructor(x, y, l) {
this.x = x;
this.y = y;
this.l = l;
}
move() {
this.x = this.x + noise(10, 50);
this.y = this.y //+ noise(-5, 5);
}
show() {
stroke(255);
noFill();
rect(this.x, this.y, this.l, this.l);
}
}
class Triangle {
constructor(x1, y1, x2, y2, x3, y3) {
this.x1 = x1;
this.y1 = y1;
this.x2 = x2;
this.y2 = y2;
this.x3 = x3;
this.y3 = y3;
}
move() {
this.x1 = this.x1 + random(-5, 5);
this.y1 = this.y1 + random(-5, 5);
this.x2 = this.x2 + random(-5, 5);
this.y2 = this.y2 + random(-5, 5);
this.x3 = this.x3 + random(-5, 5);
this.y3 = this.y3 + random(-5, 5);
}
show() {
noStroke();
if (mouseX > windowWidth * (3 / 4) || mouseX < windowWidth / 8) {
fill(255, 110, 134, 150);
} else {
noFill();
}
triangle(this.x1, this.y1, this.x2, this.y2, this.x3, this.y3);
}
}