class Circle {
    constructor(){
        this.x = random(0, width);
        this.y = random(0, height);
        this.Diameter = random(30, 100);
        this.vx = random(-5, 5);
        this.vy = random(-5, 5);

    }

    update(){
        this.x += this.vx;
        this.y += this.vy;

        //bounce
        if (this.x > width || this.x < 0) {
            this.vx *= -1;
        }
        if (this.y > height || this.y < 0) {
            this.vy *= -1;
        }

    }

    draw(){
        circle(this.x, this.y, this.Diameter);
    }
    
}

let circles = [];

function setup() {
    createCanvas(400, 400);

    //een van dit object
    circles.push(new Circle());

//of 50 van dit object
    for (let iCircle = 0; iCircle < 50; iCircle++) {
        let aCircle = new Circle(10, 20);
        //zet een nieuwe circle in de array
        circles.push(new Circle());
    }

}

function draw() {
    background(220);
    //voor elke circle in de array circles word deze code uitgevoerd
    circles.forEach(aantalcircles => { 
        aantalcircles.update();
        aantalcircles.draw();
    });
}