sketch.js

let marus = new Array();
let myX = 0;
let myY = 500;
let myW = 50;
let myH = 10;
let tamas = new Array(0);
let tamaBango = 0;

function setup() {
  createCanvas(600, 600); //ウィンドウサイズの指定
  background(0, 0, 0); //背景色を指定して1回だけ塗る。
  for (let i = 0; i < 10; i = i + 1) {
    for (let j = 0; j < 5; j = j + 1) {
      let maru = new Maru();
      maru.x = i * 50;
      maru.y = j * 50;
      marus.push(maru); //変数の部屋を増やしてmaruを入れる
    }
  }
  for (let i = 0; i < 20; i = i + 1) {
    let tama = new Tama();
    tamas.push(tama);
  }
}

function draw() {
  background(0, 0, 0); //背景色を指定して1回だけ塗る。
  for (let i = 0; i < marus.length; i = i + 1) {
    if (marus[i].ikiteru == true) {
      noStroke();
      fill(150, 0, 255);
      circle(marus[i].x, marus[i].y, 20);
      for (let j = 0; j < tamas.length; j = j + 1) {
        let kyori = dist(marus[i].x, marus[i].y, tamas[j].x, tamas[j].y);
        if (kyori < 10) {
          marus[i].ikiteru = false;
        }
      }
    }
  }
  noStroke();
  fill(255, 255, 0);
  rect(myX - myW / 2, myY, myW, myH);
  myX = mouseX;

  for (let i = 0; i < tamas.length; i = i + 1) {
    noStroke();
    fill(0, 255, 0);
    circle(tamas[i].x, tamas[i].y, 5);

    tamas[i].y = tamas[i].y - 5;
  }
}

function mousePressed() {
  //マウスのボタンが押し下げられた時の処理
  tamas[tamaBango].x = mouseX;
  tamas[tamaBango].y = myY;
  tamaBango += 1;
  if (tamaBango >= tamas.length) {
    tamaBango = 0;
  }
}

function mouseReleased() {
  //マウスのボタンが離された時の処理
}

function keyPressed() {
  if (key == "s") {
    saveCanvas();
  }
}

class Maru {
  constructor() {
    this.x = 0; //クラスに変数を持たせる
    this.y = 0;
    this.ikiteru = true;
  }
}

class Tama {
  constructor() {
    this.x = 0; //クラスに変数を持たせる
    this.y = 0;
  }
}