up or down

n = 8;
function setup() {
  c = 0.95 * min(windowWidth, windowHeight);
  createCanvas(c / 2, c);
  noStroke();
}
function draw() {
  t = frameCount;
  background(200);
  w = c / 15;
  translate(width / 2, height / 2);
  for (let i = 1; i < n; i++) {
    push();
    translate(0, -c / 2 + w / 10 + (i * c) / (n + 1));
    pot();
    pop();
  }
  for (let i = 2; i <= n; i++) {
    push();
    translate(w, -c / 2 + w / 10 + (i * c) / (n + 1));
    scale(1, -1);
    pot();
    pop();
    push();
    translate(-w, -c / 2 + w / 10 + (i * c) / (n + 1));
    scale(1, -1);
    pot();
    pop();
  }
  m = 8;
  for (let i = 0; i < m; i++) {
    circle(
      0,
      -c / 1.5 + ((t + (((4 / 3) * c) / m) * i) % ((4 * c) / 3)),
      w / 2
    );
    circle(w, c / 1.5 - ((t + (((4 / 3) * c) / m) * i) % ((4 * c) / 3)), w / 2);
    circle(
      -w,
      c / 1.5 - ((t + (((4 / 3) * c) / m) * i) % ((4 * c) / 3)),
      w / 2
    );
  }
}
function pot() {
  b = (PI / 9) * sin(t / 100);
  rect(-w / 2, 0, w, w - (w / 2) * sin(b));
  fill(180);
  ellipse(0, 0, w, w / 5 + (w - w / 3) * sin(b));
  fill(255);
  ellipse(0, w - (w / 2) * sin(b), w, w / 5 - (w / 10) * abs(sin(b)));
}