let speedX = 2;

let speedY = -5;

let gravity = .1;

let x = null;

let y = null;

​

let lastFrameCount = 0;

let capture = null;

​

function setup() {

  createCanvas(400, 400);

  x = width / 4;

  y = height / 2;

  // p5Gif.capture().recordUntil({

  //        frame: 10

  // }, function() {

  //     this.download("myGif.gif");

  // });

  capture = p5Gif.capture();

​

}

​

function draw() {

  background(220);

  ellipse(x, y, r, r);

  speedY += gravity;

  x += speedX;

  y += speedY;

  if (x >= width) {x = width - r - 1; speedX *= -1;}

  else if (x <= 0) {x = 0 + r + 1; speedX *= -1;}

  if (y >= height) {y = height - 1; speedY *= -1;}

  else if (y <= 0) {y = 0 + r + 1; speedY *= -1;}

  if (capture && capture.frames.length < 10) {

    if (frameCount - lastFrameCount > 20) {

      capture.addFrame();

      lastFrameCount = frameCount;

    }

  } else {

    if (capture) {

      capture.download("myGif.gif");

      capture = null;

    }

  }

}