createCanvas(890, 290);

}

function mousePressed() {

  save("htet_Sequence of Translational Motion.jpg");

}

function draw() {

  background("rgb(80,80,80)");

  noStroke();

  fill("rgb(250, 229, 211)");

  square(50, 50, 190);

  fill("black");

  rect(70, 220, 80, 10);

  fill("red");

  rect(70, 150, 80, 60);

​

  fill("rgb(250, 229, 211)");

  square(250, 50, 190);

  push();

  translate(width / 2.8, height / 2.1);

  rotate(PI / 8.0);

  fill("red");

  rect(-26, -16, 80, 50);

  fill("black");

  rect(-26, 45, 80, 15);

  pop();

​

  fill("rgb(250, 229, 211)");

  square(450, 50, 190);

  push();

  translate(width / 1.6, height / 2.4);

  rotate(PI / 3);

  fill("black");

  rect(-26, -6, 80, 40);

  fill("red");

  rect(-26, 45, 80, 30);

  pop();

​

  fill("rgb(250, 229, 211)");

  square(650, 50, 190);

  fill("red");

  rect(697.5, 97.5, 40, 80);

  fill("black");

  rect(747.5, 97.5, 40, 80);

}

function mousePressed() {

  console.log(mouseX, mouseY);

}

​

​