mainHue = random(0, 360);
let startSizeX = random(30,150);
let startSizeY = random(30,150);
let startMoveTime = (4000);
let newRect = new MoveRect(startX, startY, startSizeX, startSizeY, startMoveTime);
for(let i=0; i<myRects.length; i++)
return new Promise(resolve => setTimeout(resolve, ms));
constructor(_x, _y, _sizeX, _sizeY, _moveTime) {
this.toX = random(70, 600);
this.toY = random(70, 800);
this.moveTime = _moveTime;
this.baseHue = mainHue + random(30, -30);
let t = this.timeCounter / this.moveTime;
let animatedT = easeInBack(t);
let nowX = lerp(this.fromX, this.toX, animatedT);
let nowY = lerp(this.fromY, this.toY, animatedT);
rect(nowX, nowY, this.sizeX, this.sizeY);
let strokeHue = this.baseHue;
stroke(strokeHue, strokeSat, strokeBri);
this.timeCounter = this.timeCounter + deltaTime;
if (this.timeCounter >this.moveTime) {
this.toX = random(70, 600);
this.toY = random(70, 800);
return c3 * x * x * x - c1 * x * x;
function easeOutBack(x) {
return 1 + c3 * Math.pow(x - 1, 3) + c1 * Math.pow(x - 1, 2);
function easeInOutBack(x) {
? (Math.pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2)) / 2
: (Math.pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2;