let x1 = 254;

let y1 = 195;

let x2 = 221;

let y2 = 157;

let x3 = 287;

let y3 = 157;

let x4 = 320;

let y4 = 183;

let x5 = 320;

let y5 = 196;

let x6 = 320;

let y6 = 208;

let x7 = 188;

let y7 = 184;

let x8 = 188;

let y8 = 196;

let x9 = 188;

let y9 = 209;

let x10, y10;

let directionX1 = 1;

let directionX2 = 1;

let directionX3 = 1;

let directionX4 = 1;

let directionX5 = 1;

let directionX6 = 1;

let directionX7 = 1;

let directionX8 = 1;

let directionX9 = 1;

let directionY1 = 1;

let directionY2 = 1;

let directionY3 = 1;

let directionY4 = 1;

let directionY5 = 1;

let directionY6 = 1;

let directionY7 = 1;

let directionY8 = 1;

let directionY9 = 1;

let isFullscreen = false;

​

function setup() {

  createCanvas(600, 600);

  background(0);

}

​

function draw() {

  flyingCrab();

  bubbles();

}

​

function flyingCrab() {

  a = random(200);

  b = random(200);

  c = random(200);

  d = 255;

  fill(a, b, c, d);

  noStroke();

  ellipse(x1, y1, 101, 51);

  ellipse(x2, y2, 14);

  ellipse(x3, y3, 14);

  ellipse(x4, y4, 46, 11);

  ellipse(x5, y5, 39, 11);

  ellipse(x6, y6, 46, 11);

​

  ellipse(x7, y7, 46, 11);

  ellipse(x8, y8, 39, 11);

  ellipse(x9, y9, 46, 11);

​

  x1 = x1 + directionX1;

  x2 = x2 + directionX2;

  x3 = x3 + directionX3;

  x4 = x4 + directionX4;

  x5 = x5 + directionX5;

  x6 = x6 + directionX6;

  x7 = x7 + directionX7;

  x8 = x8 + directionX8;

  x9 = x9 + directionX9;

  y1 = y1 + directionY1;

  y2 = y2 + directionY2;

  y3 = y3 + directionY3;

  y4 = y4 + directionY4;

  y5 = y5 + directionY5;

  y6 = y6 + directionY6;

  y7 = y7 + directionY7;

  y8 = y8 + directionY8;

  y9 = y9 + directionY9;

  if (x1 > width || x1 < 0) {

    directionX1 = -directionX1;

  }

  if (x2 > width || x2 < 0) {

    directionX2 = -directionX2;

  }

  if (x3 > width || x3 < 0) {

    directionX3 = -directionX3;

  }

  if (x4 > width || x4 < 0) {

    directionX4 = -directionX4;

  }

  if (x5 > width || x5 < 0) {

    directionX5 = -directionX5;

  }

  if (x6 > width || x6 < 0) {

    directionX6 = -directionX6;

  }

  if (x7 > width || x7 < 0) {

    directionX7 = -directionX7;

  }

  if (x8 > width || x8 < 0) {

    directionX8 = -directionX8;

  }

  if (x9 > width || x9 < 0) {

    directionX9 = -directionX9;

  }

  if (y1 > (height * 3) / 4 || y1 < height / 4) {

    directionY1 = -directionY1;

  }

  if (y2 > (height * 3) / 4 || y2 < height / 4) {

    directionY2 = -directionY2;

  }

  if (y3 > (height * 3) / 4 || y3 < height / 4) {

    directionY3 = -directionY3;

  }

  if (y4 > (height * 3) / 4 || y4 < height / 4) {

    directionY4 = -directionY4;

  }

  if (y5 > (height * 3) / 4 || y5 < height / 4) {

    directionY5 = -directionY5;

  }

  if (y6 > (height * 3) / 4 || y6 < height / 4) {

    directionY6 = -directionY6;

  }

  if (y7 > (height * 3) / 4 || y7 < height / 4) {

    directionY7 = -directionY7;

  }

  if (y8 > (height * 3) / 4 || y8 < height / 4) {

    directionY8 = -directionY8;

  }

  if (y9 > (height * 3) / 4 || y9 < height / 4) {

    directionY9 = -directionY9;

  }

}

​

function bubbles() {

  x10 = random(width);

  y10 = random(height);

  e = random(5, 20);

  fill(a, b, c, 100);

  for (i = 0; i < 15; i += 3) {

    ellipse(x10 + i, y10 + i, e);

  }

}

​

// full screen

function mousePressed() {

  if (mouseX < 100 && mouseY < 100) {

    if (isFullscreen == false) 

      isFullscreen = true;

      fullscreen(true);

    } else {

      isFullscreen = false;

      fullscreen(false);

    }

      //简易版isFullscreen=!isFullscreen;

                                     //fullscreen(isFullscreen);                               

  }

​

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

}

​