twoPear

let cnv;
let c = 50;
let t;
let waveA = [];

function setup() {
	cnv = createCanvas(400, 600);
	angleMode(DEGREES);
	for (let i = 0; i < c; i++) {
		waveA.push(new waveMe(i));
	}
	noStroke();
	background(200);
	rect(0, 0, 400, 300);
	fill(0, 0, 40);
	rect(0, 300, 400, 300);
}
function draw() {
	translate(width / 2, 168);
	rotate(-90);
	scale(2 / 3, 2 / 3);
	t = 360 * sin(frameCount / 20);
	fill(50 * sin(frameCount / 3), 100, 100 * cos(frameCount / 2), 100);
	for (let i = 0; i < c; i++) {
		waveA[i].move();
		waveA[i].display();
	}
	push();
	translate((-3 * width) / 3, 0);
	scale(-1, 1);
	for (let i = 0; i < c; i++) {
		waveA[i].move();
		waveA[i].display();
	}
	pop();
	if (t == 360) {
		noLoop();
	}
}

class waveMe {
	constructor(n) {
		this.x = 0;
		this.y = 100;
		this.n = n;
	}
	move() {
		this.x = 200 * sin(t);
		this.y =
			(100 + 70 * sin(t) * cos(this.n * t) + 50 * sin((this.n * t) / 2)) * cos(t);
	}
	display() {
		circle(this.x, this.y, 2);
	}
}