220114a

​

let Engine = Matter.Engine;

let World = Matter.World;

let Bodies = Matter.Bodies;

​

let engine;

let world;

let circles = [];

​

function setup() {

  createCanvas(w=720, w);

​

  fps = 60;

  frameRate(fps);

  engine = Engine.create();

  world = engine.world;

  World.add(world, [

        // walls

        Bodies.rectangle(width/2, 0, width, 5, { isStatic: true }),

        Bodies.rectangle(width/2, height, width, 5, { isStatic: true }),

        Bodies.rectangle(width, height/2, 5, height, { isStatic: true }),

        Bodies.rectangle(0, height/2, 5, height, { isStatic: true })

    ]);

  bg = rand_color();

}

​

function draw() { 

  if(frameCount<fps*15 && frameCount%fps==0){

    for(let i=0;i<10;i++){

      circles.push(new Circle(random(width), random(height/8), random(5, 30)));

    }

  }

  background(bg);

  Engine.update(engine);

  for (let i = 0; i < circles.length; i++) {

    circles[i].show();

  }

}

​

​

function Circle(x, y, r) {

  var options = {

    friction: 0.75,

    restitution: 0.95

  };

  this.body = Bodies.circle(x, y, r, options);

  this.r = r;

  World.add(world, this.body);

​

  this.color = rand_color();

  this.show = function() {

    let pos = this.body.position;

    let angle = this.body.angle;

    push();

    translate(pos.x, pos.y);

    rotate(angle);

    rectMode(CENTER);

    strokeWeight(1);

    stroke(0);

    fill(this.color);

    ellipse(0, 0, this.r * 2);

    pop();

  };

}

​

function rand_color(){

  return color(random(["#227c9d", "#17c3b2", "#ffcb77", "#fef9ef", "#fe6d73"]));

}

​

//save PNG

function keyPressed() {

  save("img_" + month() + day() + hour() + minute() + second() + ".png");

}