220121a

let color_pat = ["#ffffff", "#f090d0", "#408040"];

​

let Engine = Matter.Engine;

let World = Matter.World;

let Bodies = Matter.Bodies;

​

let engine;

let world;

let dangos = [];

​

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, 15, { isStatic: true }),

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

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

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

    ]);

  bg = "#ffffff";

}

​

function draw() { 

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

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

      dangos.push(new Dango(random(width*0.1, width-width*0.1), random(height/16, height/8), random(10, 50)));

    }

  }

  background(bg);

  Engine.update(engine);

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

    dangos[i].show();

  }

}

​

function Dango(x, y, r) {

  var options = {

    friction: 0.3,

    restitution: 0.8,

    angle: random(TAU)

  };

  this.body = Bodies.rectangle(x, y, r, r*3.8, options);

  this.r = r;

  World.add(world, this.body);

​

  this.colors = rand_color();

  this.show = function() {

    let pos = this.body.position;

    let angle = this.body.angle;

    push();

    translate(pos.x, pos.y);

    rotate(angle);

    draw_dango(this.r, this.colors);

    pop();

  };

}

​

function rand_color(){

 let colors = shuffle( color_pat );

  return colors;

}

​

function draw_dango(size, color_pat){

 stroke("#000000");

 strokeWeight(size/18);

 push();

 line(0, -size*1.8, 0, size*2);

​

 push();

 translate(0, 0);

 dango(size, color_pat[0]);

 pop();

​

 push();

 translate(0, -size);

 dango(size, color_pat[1]);

 pop();

​

 push();

 translate(0, size);

 dango(size, color_pat[2]);

 pop();

​

 pop();

}

​

function dango(size, fcolor){

  push();

  translate(0, 0)

  fill(fcolor);

  ellipse(0, 0, size);

  face(size);

  pop();

}

​

function face(size){

  push();

  fill("#000000");

  ellipse(size/8*2, -size/10, size/14);

  ellipse(-size/8, -size/10, size/14);

  fill(0,0);

  arc(size/8, size/20, size/10*1.25, size/10, -PI/2*1.25, PI/2*1.25);

  arc(size/8*0.6, size/16*3.5, size/4, size/10, 0, PI);

  pop();

}