let img2;

let img3

​

let x=0;

let y=0;

let px=0;

let py=0;

let easing=0.5;

function preload(){

  img1=loadImage("media/woods.jpg");

  img2=loadImage("media/tree.jpg");

  img3=loadImage("media/plants.jpg");

}

​

function setup() {

  createCanvas(1280, 720);

}

​

function draw() {

  background(160,140,220);

  //background pics

  image(img1,220,100,300,500);

  image(img2,490,50,300,400);

  image(img3,600,250,500,275);

​

  fill(160,140,220,100);

  rect(0,0,1280,720);

  //hair

  noStroke();

  fill(90,43,105);

  rect(526,140,227);

  //head and legs

  fill(230,213,195);

  ellipse(640,190,175);

  rect(590,550,25,40);

  rect(665,550,25,40);

  //face

  if (mouseIsPressed){

    fill(0,0);

    triangle(600,180,580,180,580,200);

    triangle(680,180,700,180,700,200);

  } else{

    fill(0);

    triangle(600,180,580,180,580,200);

    triangle(680,180,700,180,700,200);

  }

  fill(255);

  circle(600,200,40);

  circle(680,200,40);

  fill(81,148,133);

  circle(600,200,25);

  circle(680,200,25);

  fill(230,213,195);

  circle(600,235,50);

  circle(680,235,50);

  if (mouseIsPressed){

    fill(0);

    triangle(600,220,580,220,580,200);

    triangle(680,220,700,220,700,200);

    fill(229,179,162);

    circle(600,200,40);

    circle(680,200,40);

  }

  strokeWeight(3);

  stroke(0);

  fill(0,0);

  arc(640,230,50,40,0,3.15);

  //hat

  noStroke();

  fill(0);

  triangle(640,25,540,140,740,140);

  ellipse(640,140,275,50);

  //body

  triangle(640,277.5,502.5,550,777.5,550);

  triangle(559,300,725,300,640,425);

  beginShape();

    vertex(559,300);

    vertex(579,325);

    vertex(547,425);

    vertex(527,400);

  endShape(CLOSE);

  beginShape();

    vertex(725,300);

    vertex(705,325);

    vertex(732,425);

    vertex(752,400);

  endShape(CLOSE);

  //boots

  rect(580,590,45,60);

  rect(655,590,45,60);

  ellipse(580,650,90,40);

  ellipse(700,650,90,40);

  //wand dust thing

  fill(255,100);

  beginShape();

    vertex(300,0);

    vertex(0,0);

    vertex(0,300);

    vertex(440,360);

    vertex(450,350);

  endShape(CLOSE);

  //wand

  fill(125,215,227);

  if (keyIsPressed){

    fill(224,117,217);

  }

  beginShape();

    vertex(590,475);

    vertex(600,465);

    vertex(450,350);

    vertex(440,360);

  endShape(CLOSE);

  rect(550,115,180,15);

  rect(590,359,100,15);

  fill(230,213,195);

  ellipse(530,420,40);

  ellipse(749,420,40);

  //particles

  stroke(117,166,223,150);

  let targetX=mouseX;

  x+=(targetX-x)*easing;

  let targetY=mouseY;

  y+=(targetY-y)*easing;

  let weight=dist(x,y,px,py);

  strokeWeight(20);

  line(x,y,px,py);

  py=y;

  px=x;

}