week4

​

// Declare Utils as a variable

var utils = new p5.Utils();

​

let x1= 0;

let y1= 0;

let m1=0;

let m2=50;

let m4=65;

let m3=0;

let m5=0;

let m6= 300;

​

function setup() {

  createCanvas(600,600);

  background(0,0,0);

   utils.enableRuler();

}

​

function draw() {

  //second group

  translate(m1,m2);

  stroke(255,0,0);

  customShape();

  translate(m1,m2+20);

  stroke(0,255,0);

  customShape();

  translate(m1,m2+20);

  stroke(186,85,211);

  customShape();

  translate(m1,m2+20);

  stroke(106,90,205);

  customShape();

  translate(m1,m2+20);

  stroke(135,206,250);

  customShape();

  translate(m1,m2+20);

  stroke(135,206,250);

  customShape();

  translate(m4,m3);

  stroke(106,90,205);

  customShape();

  translate(m4,m3);

  stroke(255,255,255);

  customShape();

  translate(m4,m3);

  stroke(255,0,0);

  customShape();

  translate(m4,m3);

  stroke(255,255,0);

  customShape();

  translate(m4,m3);

  stroke(106,90,205);

  customShape();

  translate(m1,m2-120);

  stroke(106,90,205);

  customShape();

  translate(m1,m2-120);

  stroke(0,255,0);

  customShape();

  translate(m1,m2-120);

  stroke(186,85,211);

  customShape();

    translate(m1,m2-120);

  stroke(186,85,211);

  customShape();

    translate(m1,m2-120);

  stroke(135,206,250);

  customShape();

  translate(m1-65,m2-50);

  stroke(255,255,0);

  customShape();

  translate(m1-65,m2-50);

  stroke(255,255,255);

  customShape();

  translate(m1-65,m2-50);

  stroke(135,206,250);

  customShape();

  translate(m1-65,m2-50);

  stroke(186,85,211);

  customShape();

    translate(m1,m2+20);

  stroke(106,90,205);

  customShape();

    translate(m1,m2+20);

  stroke(106,90,205);

  customShape();

    translate(m1,m2+20);

  stroke(106,90,205);

  customShape();

    translate(m1,m2+20);

  stroke(0,255,0);

  customShape();

  translate(m1+65,m2-50);

  stroke(255,255,0);

  customShape();

  translate(m1+65,m2-50);

  stroke(106,90,205);

  customShape();

  translate(m1+65,m2-50);

  stroke(186,85,211);

  customShape();

translate(m1,m2-120);

  stroke(255,0,0);

  customShape();

  translate(m1,m2-120);

  stroke(106,90,205);

  customShape();

  translate(m1,m2-120);

  stroke(255,255,255);

  customShape();

  translate(m1-65,m2+20);

  stroke(255,255,255);

  customShape();

  translate(m1-65,m2+20);

  stroke(255,0,0);

  customShape();

    translate(m1,m2-120);

  stroke(255,255,0);

  customShape();

    translate(m1,m2-120);

  stroke(255,255,255);

  customShape();

  translate(m1+65,m2+90);

  stroke(255,255,0);

  customShape();

  translate(m1,m2-185);

  stroke(255,255,0);

  customShape();

}

​

function customShape(){

  noFill();

  quad(50+x1, 110+y1, 

       110+x1, 60+y1, 

       110+x1, 100+y1, 

       50+x1, 100+y1);

  quad(60+x1, 70+y1, 

       100+x1, 80+y1, 

       100+x1, 140+y1, 

       70+x1, 120+y1);

  quad(50+x1, 60+y1, 

       110+x1, 70+y1, 

       100+x1, 120+y1, 

       60+x1, 120+y1);

  quad(40+x1, 80+y1, 

       80+x1, 50+y1, 

       110+x1, 120+y1, 

       70+x1, 130+y1);

  quad(50+x1, 80+y1, 

       110+x1, 105+y1, 

       110+x1, 110+y1, 

       50+x1, 130+y1);

}