let x=0; //Translation x-coordinate

let y=0; //Translation y-coordinate

let armLength=0; //Arm length 

let armWidth=18; //Arm width

let feetY=200; //Feet y-coordinate

let legConnectorY=200; //Leg connectors y-coordinate

let legLength=0; //Leg length

let valueR=192; //Light R value

let valueG=253; //Light G value

let valueB=255; //Light B value

let bodyWidth=60; //Robot's smallest body width

let bodyHeight=108; //Robot's smallest body height

let ringY=143; //Smallest ring y-coordinate

let ringHeight=3; //Smallest ring height

let faceWidth=40; //Smallest face width

let faceHeight=20; //Smallest face height

let faceY=125; //Smallest face y-coordinate

let eyeHeight=10; //Smallest eyes height

let eyeY=125; //Smallest eyes y-coordinate

let eyeLX=190; //Smallest left eye x-coordinate

let eyeRX=210; //Smallest right eye x-coordinate

let lightLX=168; //Smallest left light x-coordinate

let lightRX=232; //Smallest right light x-coordinate

let lightY=130; //Smallest lights y-coordinate

let lightWidth=3; //Smallest lights width

let lightHeight=5; //Smallest lights height

let conWidth=2; //Smallest head light connectors width

let conHeight=7; //Smallest head light connectors light

let conRX=230; //Smallest right head light connector x-coordinate

let conLX=170; //Smallest left head light connector x-coordinate

let conY=130; //Smallest head light connectors y-coordinate

let shoulderLX=200; //Smallest left shoulder x-coordinate

let shoulderRX=200; //Smallest right shoulder x-coordinate

let shoulderWidth=0; //Smallest shoulders width

let shoulderHeight=0; //Smallest shoulders height

let w=50; //Shadow width

let intro="Press the up and down arrow to change robot's size";

let pointer="Drag up and down";

​

/*-------------------------------------------------------------------------------------------*/

​

function setup() {

  createCanvas(400, 400);

  noStroke();

  rectMode(CENTER);

}

​

function draw() { 

  background(230, 250, 255);

  /* Background stripes */

  fill(255, 230, 255);

  rect(200,200,30,400);

  rect(100,200,30,400);

  rect(10,200,30,400);

  rect(40,200,30,400);

  rect(300,200,10,400);

  rect(340,200,10,400);

  fill(89, 51, 204);

  ellipse(x+200,y+330,w,10); //Shadow

  /* Text */

  fill(51, 51, 204);

  textStyle(BOLD);

  text(intro,60,380); //Size change instruction

  //Arm length change instruction

  if (bodyWidth>=119) {

    push(); //Start centering text

    fill(89, 51, 204);

    textAlign(CENTER);

    text(pointer, mouseX, mouseY);

    pop(); //Stop centering text

  }

  translate(x,y); //Translation parameters

​

  /*----------------------------------------------------------------------*/

  /* Robot Arms */

  //Arms

  push(); //Start CORNER rectMode

  rectMode(CORNER);

  fill(208, 209, 255); //Light Purple

  rect(shoulderLX-9, 140, armWidth, armLength, 0, 0, 30, 30); //Left Arm 

  rect(shoulderRX-9, 140, armWidth, armLength, 0, 0, 30, 30); //Right  Arm 

  pop(); //Stop CORNER rectMode

  //Shoulders

  fill(200, 231, 255); //Light Blue

  rect(shoulderLX, 140, shoulderWidth, shoulderHeight, 40, 0, 0, 6); //Left Shoulder

  rect(shoulderRX, 140, shoulderWidth, shoulderHeight, 0, 40, 6, 0); //Right Shoulder

  /*----------------------------------------------------------------------*/

  /* Robot Body */

  fill(243, 196, 251); //Light Pink

  rect(200, 160, bodyWidth, bodyHeight, 80);

  /*----------------------------------------------------------------------*/

  /* Robot Head */

  //Face

  fill(222, 170, 255); // Purple

  rect(200, faceY, faceWidth, faceHeight, 30);

  //Eyes

  fill(valueR, valueG, valueB); //Light Aqua - also applied to Body Light Ring & Head Lights

  rect(eyeLX, eyeY, 5, eyeHeight); //Left Eye

  rect(eyeRX, eyeY, 5, eyeHeight); //Right Eye

  //Body Light Ring

  rect(200, ringY, bodyWidth, ringHeight);

  //Head Lights

  rect(lightLX, lightY, lightWidth, lightHeight, 10, 0, 0, 10); //Left Light

  rect(lightRX, lightY, lightWidth, lightHeight, 0, 10, 10, 0); //Right Light

  fill(222, 170, 255); // Purple

  rect(conLX, conY, conWidth, conHeight); //Left Connector

  rect(conRX, conY, conWidth, conHeight); //Right Connector

}

/*----------------------------------------------------------------------*/

​

/* Use keyPressed to make the robot grow */

​

function keyPressed() {

  /* Grow Up */

  if (keyCode === UP_ARROW && bodyWidth<160) {

    bodyWidth = bodyWidth+7.75;

    bodyHeight = bodyHeight+13;

    w = w+7.75;

    ringHeight = ringHeight+0.4;

    faceWidth = faceWidth+5.5;

    faceHeight = faceHeight+3;

    faceY = faceY-3;

    eyeHeight = eyeHeight+1.5;

    eyeY = eyeY-3;

    eyeLX = eyeLX-1;

    eyeRX = eyeRX+1;

    lightWidth = lightWidth+1.5;

    lightHeight = lightHeight+1.25;

    lightLX = lightLX-4.5;

    lightY = lightY-2.25;

    lightRX = lightRX+4.5;

    conWidth = conWidth+0.25;

    conHeight = conHeight+1.75;

    conLX = conLX-4;

    conRX = conRX+4;

    conY = conY-2.25;

    shoulderWidth = shoulderWidth+2;

    shoulderHeight = shoulderHeight+1.5;

    shoulderLX = shoulderLX-7;

    shoulderRX = shoulderRX+7;

    armLength = armLength+2;

  }

  /* Shrink Down */

  if (keyCode === DOWN_ARROW && bodyHeight>108 && armLength<=150) {

    bodyWidth = bodyWidth-7.75;

    bodyHeight = bodyHeight-13;

    w = w-7.75;

    ringHeight = ringHeight-0.4;

    faceWidth = faceWidth-5.5;

    faceHeight = faceHeight-3;

    faceY = faceY+3

    eyeHeight = eyeHeight-1.5

    eyeY = eyeY+3

    eyeLX = eyeLX+1

    eyeRX = eyeRX-1

    lightWidth = lightWidth-1.5;

    lightHeight = lightHeight-1.25;

    lightLX = lightLX+4.5;

    lightY = lightY+2.25;

    lightRX = lightRX-4.5;

    conWidth = conWidth-0.25;

    conHeight = conHeight-1.75;

    conLX = conLX+4;

    conRX = conRX-4;

    conY = conY+2.25;

    shoulderWidth = shoulderWidth-2;

    shoulderHeight = shoulderHeight-1.5;

    shoulderLX = shoulderLX+7;

    shoulderRX = shoulderRX-7;

    armLength = armLength-2;

  }

}

​

/*----------------------------------------------------------------------*/

​

/* Use mouseDragged to make the robot dance */

function mouseDragged() {

  if (bodyWidth>=119) {

    /*Randomize colors to create blinking effect on eyes and lights */

    valueR = random(0,255);

    valueG = random(0,255);

    valueB = random(0,255);

​

    x = mouseY-200; //Move robot's position along the x axis

​

    armLength = mouseY-200; //Move robot's arms up and down

​

    handY = 140+armLength; //Move hands along with the arms

​

    armConnectorY = 140+armLength/2; //Move arm connectors along with the arms

  }

  if (bodyWidth<119) {

    x = mouseY-200; //Move robot's position along the x axis

  }

}