Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
/*
Assignment 01 Interactive Drawing
POG14998 P02
Lin Xu / 2018.09.11 
Pikachu
*/


//Set up
void setup() {
   size(400, 400);
   frameRate(30);
   rectMode(CORNERS);
   noCursor();
}

//Draw
void draw() {
   //background 
   background(233,41,41);
   noStroke();
   fill(0);
   rect(0,170,400,230);
   fill(235);
   rect(0,225,400,400);
   
   //Draw the base
   noStroke();
   ellipseMode(CORNERS);
   fill(255,230,45);
   arc(85,70,315,190,PI,TWO_PI);
   arc(270,100,330,240,1.5*PI,2.25*PI);
   arc(70,100,130,240,0.75*PI,1.5*PI);
   rect(100,120,300,260);
   //chest
   arc(65,110,250,320,0.5*PI,1.25*PI);
   arc(150,110,335,320,1.75*PI,2.5*PI);
   quad(50,400,350,400,270,200,140,200);
   fill(233,41,41);
   ellipse(80,230,130,280);
   ellipse(270,230,320,280);
   //ears
   fill(255,230,45);
   arc(-10,-240,340,160,0.5*PI,PI);
   arc(-200,-20,150,380,1.5*PI,2*PI);
   arc(60,-240,410,160,0,0.5*PI);
   arc(250,-20,600,380,PI,1.5*PI);
   fill(0);
   triangle(0,0,0,25,40,0);
   triangle(400,0,360,0,400,25);
   //moving parts
   {
      //EYES
      fill(77,39,4);
      ellipseMode(CENTER);
      ellipse(275,185,50,50);
      ellipse(125,185,50,50);
      //pupil move in different speed
      fill(0,0,0,200);
      ellipse(275+(mouseX-275)/50,185+(mouseY-185)/40,30,30);
      ellipse(125+(mouseX-125)/50,185+(mouseY-185)/40,30,30);
      //high light don't move
      fill(255,255,255,170-sin(frameCount/15)*10);
      ellipse(130,175,20+sin(frameCount/15),20+sin(frameCount/15));
      ellipse(270,175,20+sin(frameCount/15),20+sin(frameCount/15));
      
      
      //MOUTH(moving parts)
      fill(0);
      ellipse(200,200+mouseY*0.05,60+sin(frameCount/20)*2,130+sin(frameCount/20)*2);
      //nose
      ellipseMode(CORNERS);
      stroke(0);
      fill(255,230,45);
      arc(130,195,210,245,0.25*PI,0.75*PI);
      arc(190,195,270,245,0.25*PI,0.75*PI);
      noStroke();
      rect(160,100,235,237);      
      fill(0);
      triangle(190,210,210,210,200,220);
      
      //Lolipop
      fill(232,181,178);
      ellipseMode(CENTER);
      ellipse(mouseX,mouseY,40,40);
      fill(226,152,150);
      rect(mouseX+21,mouseY-5,mouseX-21,mouseY+5);
      fill(192,110,110);
      rect(mouseX+2.5,mouseY+20,mouseX-2.5,mouseY+60);
   }
   
}
//When Click Pikachu will make an angry look, and stay on the screen for 20 frame
void mousePressed(){
   //to make it show longer
   frameRate(1);
   
   fill(255,230,45);
   triangle(120,160,160,190,160,160);
   triangle(280,160,240,190,240,160);
   
   strokeWeight(3);
   stroke(255,255,181,230);
   strokeJoin(MITER);
   //lightning effects on the right
   beginShape();
   line(290,250,310,240);
   line(310,240,330,240);
   line(330,240,340,230);
   line(340,230,360,245);
   line(360,245,390,240);
   line(350,238,360,220);
   line(360,220,370,215);
   line(370,215,380,220);
   line(360,220,350,210);
   line(350,210,345,215);
   line(310,230,320,220);
   line(320,220,330,215);
   line(330,215,335,217);
   line(335,250,340,250);
   line(300,250,320,260);
   line(320,260,340,260);
   line(340,260,350,255);
   line(290,260,300,270);
   line(300,270,305,270);
   line(305,270,310,268);
   line(320,265,340,270);
   line(340,270,340,275);
   line(340,275,345,275);
   endShape();
   //lightning effects on the left
   beginShape();
   line(110,240,90,230);
   line(90,230,80,230);
   line(80,230,70,220);
   line(70,220,60,230);
   line(100,250,80,260);
   line(80,260,70,270);
   line(70,270,30,280);
   line(30,280,20,270);
   line(40,250,70,250);
   line(40,250,30,230);
   line(30,230,40,220);
   line(70,270,60,290);
   line(30,230,0,240);
   endShape();
}

void mouseReleased(){
  frameRate(30);
}