​

function setup() {

  createCanvas(400, 400);

  dogY = height/2 +180;  

}

​

let dogY;

let jumpHeight = 100;

let isJumping = false;

// let outfitIndex=0

​

function draw() {

  background(25,25,112);

  fill(30,144,255)

  rect(10,10,380,380)

  fill(0,191,255)

  rect(20,20,360,360)

  fill(135,206,250)

  rect(30,30,340,340)

  fill(240,248,255)

  rect(40,40,320,320)

  fill(255,250,240)

  // rect(10,10,380,380)

  fill(0);

  //print x&y coordinates for ease   

  textSize(15);

  text("MouseX: " + mouseX, 20, 20);

  text("MouseY: " + mouseY, 20, 40);

​

  //face

  fill(255, 206, 186)

​

  //hair behind neck

  fill(65,25,0)

  stroke(65,25,0)

  quad(164,215,194,240,190,280,150,280)

  quad(236,215,207,240,210,280,270,280)

  //neck

  fill(255, 206, 186)

  noStroke()

  rect(width/2-10, height/2+12, 23, 41);

  ellipse(width/2, height/2,70,85);

  //hair

  fill(65,25,0)

  stroke(65,25,0)

  beginShape();

  bezier(width/2,height/2-50,width/2-50,height/2-50,width/2-65,height/2+10,width/2 - 70,height/2+80)

  bezier(width/2,height/2-50,width/2+50,height/2-50,width/2+65,height/2+10,width/2 +70,height/2+80)

  quad(width/2-60,height/2+12,width/2-34,height/2 +12,width/2-26,height/2+80,width/2-70,height/2+80)

  quad(width/2+60,height/2+12,width/2+34,height/2 +12,width/2+26,height/2+80,width/2+70,height/2+80)

  triangle(width/2,height/2-50,width/2+5,height/2-40,width/2-5,height/2-40)

  //body

  noStroke()

  fill(255, 206, 186)

  ellipse(width/2+5,height/2+140,120,180)

  //dress

  let outfit=[[229,204,255],[255,240,245],[240,255,240],[255,20,147],[148,0,211],[64,224,208]]

  //fill(outfit[random([0,1,2,3,4,5])])

  fill(147,112,219) 

  stroke(138,43,226)

  strokeWeight(2)

  beginShape()

  vertex(width/2 - 25, height/2 +75);

  vertex(width/2 + 35, height/2+75);

  vertex(width/2 + 75, height/2+200);

  vertex(width/2 -60, height/2+200);

  vertex(width/2 - 25, height/2 +75)

  rect(175,263,3,15);

  rect(232,263,3,15);

  endShape();

​

  //earrings

  strokeWeight(2)

  stroke(0)

  fill(255)

  ellipse(width/2-33,height/2+15,5,5)

  ellipse(width/2-33,height/2+20,5,5)

  ellipse(width/2-33,height/2+25,5,5)

  ellipse(width/2+33,height/2+15,5,5)

  ellipse(width/2+33,height/2+20,5,5)

  ellipse(width/2+33,height/2+25,5,5)

  //eyes

  noFill()

  stroke(0)

  curve(width/2 - 20,height/2+10,width/2 - 20,height/2-10,width/2-10,height/2 -10,width/2 -10,height/2 +10)

  curve(width/2 + 20,height/2+10,width/2 + 20,height/2-10,width/2 +10,height/2 -10,width/2 +10,height/2 +10)

  stroke(0)

  fill(0)

  ellipse(185,195,7,7)

  ellipse(215,195,7,7)

  fill(255)

  ellipse(186,194,4,4)

  ellipse(216,194,4,4)

  //mouth

  noFill()

  stroke(219,112,147)

  curve(width/2-10,height/2-15,width/2-10,height/2 +25,width/2+10,height/2+25,width/2+10,height/2-15)

  if (pmouseX >= mouseX) {dogMovingBack = true;} 

  else {dogMovingBack = false;}

  if(dogMovingBack){curve(width/2-10,height/2-30,width/2-10,height/2 +25,width/2+10,height/2+25,width/2+10,height/2-30)}

  else{curve(width/2-10,height/2-15,width/2-10,height/2 +25,width/2+10,height/2+25,width/2+10,height/2-15)}

​

  //hair strand

  noFill()

  stroke(65,25,0)

  bezier(width/2, height/2-42, width/2-13,height/2-28,width/2-16,height/2+2, width/2-13,height/2+5)

  //dog

  // noStroke()

  fill(196, 164, 132)

  ellipse(width/2+70 +mouseX/10,dogY-50,15,15)

  ellipse(width/2+98 +mouseX/10,dogY-50,15,15)

  //body

  fill(255)

  ellipse(width/2+85+mouseX/10,dogY,45,52)

  ellipse(width/2+85+mouseX/10,dogY-35,40,40)

  //mouth

  fill(255,0,0)

  ellipse(width/2+85+mouseX/10,dogY-12,10,16)

  fill(196, 164, 132)

  ellipse(width/2+80+mouseX/10,dogY-18,12,12);

  ellipse(width/2+90+mouseX/10,dogY-18,12,12)

  //feet

  ellipse(280+mouseX/10,dogY+20,12,10)

  ellipse(291+mouseX/10,dogY+20,12,10)

  fill(0)//nose

  ellipse(width/2+85+mouseX/10,dogY-22,10,10)

  //eyes

  ellipse(278+mouseX/10,dogY-40,5,5)

  ellipse(292+mouseX/10,dogY-40,5,5)

  fill(255)

  ellipse(279+mouseX/10,dogY-40,3,3)

  ellipse(291+mouseX/10,dogY-40,3,3)

  //tail

  noFill()

  bezier(307+mouseX/10,dogY+3,310+mouseX/10,dogY+8,327+mouseX/10,dogY-2,316+mouseX/10,dogY-5-mouseY/20)

  //dog jumping

  if (isJumping) 

  {

    dogY-=5; // Moves up

    if (dogY <= height-100){isJumping=false;}

  } 

  else if (dogY < height/2+180){dogY+=5;} //anywhere above the ground, gravity when not jumping

​

  // Prevent the dog from going below the ground

  dogY = constrain(dogY, 0, height/2+180);

  //lights

  noFill()

  stroke(0)

  strokeWeight(2)

  ellipse(70,0,135,120)

  ellipse(138+67.5,0,135,120)

  ellipse(273+64,0,123,120)

​

  let colors = [[255, 215, 0], [218, 165, 32],[184,134,11],[255,165,0],[238,232,170],[255,69,0],[250,128,114],[220,20,60],[165,42,42],[255,255,0]];

  let colorIndex = int(frameCount / 10) % colors.length;

  fill(colors[colorIndex]);

  ellipse(71,62,20,20)

  ellipse(210,62,20,20)

  ellipse(343,62,20,20)

  ellipse(18,40,20,20)

  ellipse(122,40,20,20)

  ellipse(160,40,20,20)

  ellipse(261,36,20,20)

  ellipse(296,47,20,20)

  ellipse(384,42,20,20)

​

}

function mousePressed()

{

  if (!isJumping) {isJumping = true;}//if up arrow key is pressed and not already jumping

}

​

​

​