let rlegLength;

let llegLength;

let t = 0;

​

function preload() {

  head = loadImage('head.png');

  body = loadImage('body.png');

  rleg = loadImage('legRight.png');

  lleg = loadImage('legLeft.png');

}

​

function setup() {

  createCanvas(400, 600);

}

​

function draw() {

  background(0);

  loadlLeg(115);

  loadrLeg(175);

  loadHead(50, 30);

  loadBody(55, 195);

  blink();

  tear();

  blood();

  fill(255);

  textAlign(CENTER, CENTER);

  textSize(20);

  text('--- Little Demon ---', 200, 30);

  textSize(14);

  text('- Click & Move Your Mouse -', 200, 585);

​

}

​

function loadHead(headX, headY) {

  head.resize(300, 210);

  image(head, headX, headY);

}

​

function loadBody(bodyX, bodyY) {

  body.resize(280, 240);

  image(body, bodyX, bodyY);

}

​

function loadrLeg(rLegX) {

  rlegLength = map(mouseY, 0, 600, 420, 380);

  rleg.resize(120, 160);

  image(rleg, rLegX, rlegLength);

}

​

function loadlLeg(lLegX) {

  llegLength = map(mouseY, 0, 600, 380, 420);

  lleg.resize(120, 160);

  image(lleg, lLegX, llegLength);

}

​

function mousePressed() {

  if (emotion == true) {

    emotion = false;

  } else if (emotion == false) {

    emotion = true;

  }

}

​

function blink() {

  fill(0, t);

  noStroke();

  ellipse(160, 135, 40, 40);

  ellipse(240, 135, 40, 40);

  if (emotion == true) {

    t = 255;

    stroke(255);

    strokeWeight(5);

    arc(160, 135, 30, 20, 0, PI);

    arc(235, 135, 30, 20, 0, PI);

  } else if (emotion == false) {

    t = 0;

  }

}

​

function tear(){

  fill(61, 255, 239, t);

  noStroke();

  ellipse(135, 150, 8, 8);

  ellipse(125, 160, 11, 11);

  ellipse(120, 175, 15, 15);

  ellipse(265, 150, 8, 8);

  ellipse(275, 160, 11, 11);

  ellipse(280, 175, 15, 15);

}

​

function blood(){

  fill(255, 0, 0, t);

  noStroke();

  ellipse(300, 75, 4, 8);

  ellipse(295, 90, 8, 12);

  ellipse(305, 80, 6, 12);

  ellipse(305, 110, 10, 16);

}