앞서나가는 사냥꾼님의 이글루입니다

kshpbo830.egloos.com

포토로그



Week 3_Wreck-it Ralph 2019_2 Interactive Art





I made a scene of Wreck-it Ralph to a interactive animation for this assignment. If you click formal dressed Vanellope, she turned into informal dress and move right. And when key is pressed, you can change the color of title.


PImage background;
PImage cha1;
PImage cha2;
PImage title1;
PImage title2;

float posX=-20;

void setup() {
  size(700, 500);
  background = loadImage("week3_background.png");
  cha1 = loadImage("week3_cha1.png");
  cha2 = loadImage("week3_cha2.png");
  title1 = loadImage("week3_title1.png");
  title2 = loadImage("week3_title2.png");
}

void draw() {
  image(background, 0, 0);
  image(title1, 0, 0);


  image(cha1, 0, 0);
  if (mouseX>150 && mouseX<280 && mouseY>190 && mouseY<400) {
    image(background, 0, 0);
    image(title1, 0, 0);
    pushMatrix();
    scale(1.1);
    translate(-21, -21);
    image(cha1, 0, 0);
    popMatrix();
    if (mousePressed) {
      image(background, 0, 0);
      image(title1, 0, 0);
      if (posX < 0) {
        posX += 4;
        image(cha2, posX, 0);
      } else {
        posX = 0;
        image(cha2, posX, 0);
      }
    } else {
      posX = -20;
    }
  }
  if (keyPressed == true) {
    image(title2, 0, 0);
  }
}

Week 3_Spider-man:into the Spider-Verse 2019_2 Interactive Art




I animated what i draw last week, a scene from <spider-man:into the Spider-Verse>.
I made close buildings move fast, and far buildings move slow to show depth of background.


float skyY = -10;
float buildingY_1 = 0;
float buildingY_2 = -30;
float buildingY_3 = -30;
float buildingY_4 = -40;
float buildingY_5 = -70;
float spidermanY = -20;
//---------------------
//1---2---3---4---5
//<-far------close->
//---------------------


void setup() {
  size(960, 540);
  strokeCap(SQUARE);
}

void draw() {
  background(60, 69, 138);
  if (millis()%7000>0 && millis()%7000<500) {
    skyY = -10;
    buildingY_1 = 0;
    buildingY_2 = -30;
    buildingY_3 = -30;
    buildingY_4 = -40;
    buildingY_5 = -70;
    spidermanY = -20;
  } else {
    skyY+=0.01;
    buildingY_1+=0.02;
    buildingY_2+=0.03;
    buildingY_3+=0.04;
    buildingY_4+=0.07;
    buildingY_5+=0.19;
    spidermanY-=0.05;
  }

  //-----background, sky-----
  pushMatrix();
  translate(0, skyY);
  noStroke();
  fill(79, 89, 161);
  quad(0, -0, 0, 480, 960, 430, 960, 0);
  fill(93, 102, 169);
  quad(0, 0, 0, 280, 960, 350, 960, 0);
  popMatrix();
  //---------------

  //-----buildings-----
  pushMatrix();
  translate(0, buildingY_1);
  fill(75, 82, 147);
  rect(322, -200, 300, 290);
  rect(440, -200, 30, 300);
  popMatrix();

  //---------------------------------------------------

  pushMatrix();
  translate(0, buildingY_2);
  fill(59, 70, 135);
  rect(167, 0, 90, 190);
  rect(180, 0, 50, 230);
  rect(348, 0, 30, 200);
  rect(460, 0, 35, 158);
  rect(487, 0, 28, 110);
  rect(511, 0, 13, 175);
  rect(555, 0, 31, 195);
  rect(639, 0, 60, 174);
  rect(750, 0, 60, 250);

  fill(33, 45, 118);
  quad(341, 0, 344, 44, 395, 45, 395, 0); 
  quad(387, 0, 388, 174, 430, 176, 432, 0);
  rect(436, 0, 14, 47);
  rect(501, 0, 30, 80);
  rect(531, 0, 30, 170);

  noFill();
  stroke(255, 142, 135); //coral
  strokeWeight(4);
  line(430, 39, 430, 97);
  strokeWeight(6);
  line(623, 107, 640, 108);

  stroke(167, 106, 217); //violet
  strokeWeight(4);
  line(384, 115, 402, 116);
  strokeWeight(2);
  line(478, 94, 483, 94);
  line(498, 68, 509, 68);
  line(507, 62, 514, 62);
  line(513, 56, 527, 56);

  stroke(213, 203, 139); //dark yellow
  line(395, 33, 410, 33);
  line(404, 38, 412, 38);
  strokeWeight(3);
  line(465, 18, 473, 18);
  line(550, 108, 560, 108);
  line(547, 113, 560, 113);
  noStroke();
  popMatrix();

  //---------------------------------------------------

  pushMatrix();
  translate(0, buildingY_3);
  fill(29, 30, 75);
  quad(336, 0, 340, 235, 350, 229, 350, 0);

  quad(676, 0, 664, 334, 704, 358, 716, 0);

  quad(592, 0, 592, 33, 617, 19, 617, 0);
  quad(599, 0, 593, 208, 605, 210, 611, 0);
  quad(611, 0, 605, 210, 648, 212, 656, 0);

  fill(22, 24, 63);
  quad(215, 0, 220, 145, 325.5, 149, 326, 0);
  quad(254, 0, 254, 234, 340, 235, 336, 0);

  quad(716, 0, 704, 358, 745, 357, 760, 0);

  fill(14, 21, 66);
  quad(790, 0, 774, 300, 810, 312, 830, 0);
  quad(789, 300, 786.5, 348, 819, 362, 824, 300);
  quad(797, 340, 795, 380, 823, 395, 827, 345);

  fill(12, 16, 54);
  quad(830, 0, 810, 312, 884, 312, 920, 0);
  quad(824, 300, 819, 362, 865, 360, 870, 300);
  quad(827, 345, 823, 395, 852.5, 390, 856, 345);
  quad(821, 345, 815, 460, 826, 463, 831, 345);
  stroke(14, 21, 66);
  strokeWeight(3);
  line(826, 345, 817, 530);

  fill(255);
  quad(596, 168, 595, 201, 600, 202, 601, 168);

  fill(235, 214, 251);
  quad(620, 167, 619, 203, 636, 203, 637, 167);


  noFill();
  stroke(232, 141, 255); //pink
  strokeWeight(1);
  line(337, 50, 339, 220);

  stroke(2, 228, 231); //cyan
  strokeWeight(1);
  beginShape();
  vertex(316, 76);
  vertex(316, 100);
  vertex(305, 100);
  vertex(305, 148);
  vertex(250, 146);
  endShape();
  line(711, 111, 703, 321);

  line(822, 135, 814, 313);
  line(814, 313, 823, 313);
  line(823, 313, 820, 365);
  line(820, 365, 824, 365);
  line(824, 365, 823, 380);


  strokeWeight(3.5);
  line(281, 208, 272, 218);
  line(289, 208, 280, 218);
  line(297, 208, 288, 218);
  line(305, 208, 296, 218);
  line(313, 208, 304, 218);
  line(321, 208, 312, 218);
  line(329, 208, 320, 218);

  line(836, 369.5, 846, 369);
  line(840, 375.5, 846, 375);
  line(827, 420, 827, 425);
  line(827, 428, 825, 460);
  strokeWeight(1.5);
  line(823, 461, 820, 530);

  stroke(167, 106, 217); //violet
  strokeWeight(1.5); 
  line(671, 134, 664, 335);
  line(664, 335, 704, 360);

  stroke(254, 238, 129); //yellow
  strokeWeight(2);
  line(351, 8, 351, 202);
  noStroke();
  popMatrix();

  //------------------------------------------

  pushMatrix();
  translate(0, buildingY_4);
  fill(22, 24, 63);
  quad(649, 0, 646, 112, 655, 110, 659, 0);
  quad(648, 110, 648, 126, 656, 124, 657, 107);
  quad(656, 124, 648, 126, 675, 127, 682, 125);
  fill(21, 21, 32);
  quad(659, 0, 655, 110, 686, 111, 692, 0);
  quad(657, 107, 656, 124, 682, 125, 683, 110);


  fill(12, 16, 54);
  quad(80, 0, 80, 310, 198, 270, 187, 0);
  quad(80, 300, 80, 380, 168, 340, 163, 250);
  quad(90, 330, 95, 430, 143, 400, 140, 340);
  quad(20, 330, 30, 435, 95, 430, 90, 330);

  fill(2, 5, 40);
  beginShape();
  vertex(703, 0);
  vertex(700, 95);
  vertex(718, 97);
  vertex(717, 118);
  vertex(734, 119);
  vertex(733, 137);
  vertex(787, 139);
  vertex(806, 133);
  vertex(810, 106);
  vertex(828, 105);
  vertex(831, 79);
  vertex(863, 65);
  vertex(868, 0);
  endShape();

  beginShape();
  vertex(0, 0);
  vertex(0, 69);
  vertex(240, 67);
  vertex(242, 36);
  vertex(285, 36);
  vertex(285, 0);
  endShape();

  fill(255);
  quad(691, 46, 689, 98, 694, 96, 696, 44);

  fill(235, 214, 251);
  quad(698, 35, 697, 81, 706, 76, 707, 31);

  noFill();
  stroke(232, 141, 255); //pink
  strokeWeight(1.5);
  line(109, 365, 111, 420);
  line(195, 215, 197, 270);
  line(197, 270, 110, 300);

  line(153, 324, 168, 317);
  line(168, 317, 169, 340);

  line(804, 0, 802, 54);

  strokeWeight(3);
  line(90, 430, 90, 436);
  line(95, 430, 95, 433);

  stroke(167, 106, 217); //violet
  strokeWeight(2);
  line(239, 40, 239, 60);

  stroke(189, 225, 255); //lightblue
  strokeWeight(4.5);
  line(204, 39, 239, 60);

  stroke(254, 238, 129); //yellow
  strokeWeight(2);
  line(104, 195, 110, 194.7);
  line(130, 192, 150, 190);

  noStroke();
  popMatrix();

  //------------------------------------------

  pushMatrix();
  translate(0, buildingY_5);

  fill(7, 8, 28); 
  quad(0, 0, 0, 600, 100, 400, 80, 0);

  quad(900, 0, 885, 145, 960, 150, 960, 0);
  quad(895, 140, 880, 300, 960, 320, 960, 150);
  quad(892, 280, 883.5, 370, 960, 395, 960, 270);
  quad(899, 360, 892, 438, 960, 470, 960, 350);
  quad(920, 350, 910, 520, 960, 560, 960, 350);

  noFill();
  stroke(254, 238, 129); //yellow
  strokeWeight(2);
  line(80, 0, 91, 250);
  line(0, 600, 100, 400);
  line(100, 400, 95, 300);
  line(890, 0, 883, 145);
  line(883, 145, 893, 150);
  line(893, 150, 883, 300);
  line(883, 300, 900, 305);
  line(892, 438, 930, 460);
  line(912, 450, 910, 520);
  noStroke();
  popMatrix();


  //---------------------------------------

  pushMatrix(); //spiderman
  translate(0, spidermanY);
  fill(0);
  beginShape();
  vertex(475, 304);
  vertex(472, 308);
  vertex(472, 312);
  vertex(476, 315);
  vertex(473, 317);
  vertex(471, 327);
  vertex(471, 332);
  vertex(472, 336);
  vertex(471, 339);
  vertex(474, 343);
  vertex(471, 321);
  vertex(473, 354);
  vertex(470, 357);
  vertex(465, 366);
  vertex(460, 367);
  vertex(460, 379);
  vertex(463, 379);
  vertex(467, 368);
  vertex(467, 370);
  vertex(473, 361);
  vertex(473, 374);
  vertex(471, 378);
  vertex(478, 384);
  vertex(477, 375);
  vertex(476, 374);
  vertex(478, 359);
  vertex(486, 343);
  vertex(486, 334);
  vertex(493, 338);
  vertex(494, 344);
  vertex(496, 344);
  vertex(494, 337);
  vertex(492, 333);
  vertex(487, 326);
  vertex(486, 318);
  vertex(484, 314);
  vertex(483, 308);
  vertex(480, 304);
  endShape();

  fill(60, 0, 5); //hood
  beginShape();
  vertex(475, 304);
  vertex(472, 308);
  vertex(472, 312);
  vertex(476, 315);
  vertex(479, 314);
  vertex(484, 314);
  vertex(483, 308);
  vertex(480, 304);
  endShape();

  stroke(255); //highlight
  strokeWeight(1);
  noFill();
  beginShape();
  vertex(476, 303);
  vertex(480, 304);
  vertex(483, 308);
  endShape();

  beginShape();
  vertex(484, 314);
  vertex(486, 318);
  vertex(487, 326);
  vertex(492, 333);
  endShape();

  beginShape();
  vertex(472, 322);
  vertex(471, 327);
  vertex(471, 332);
  vertex(472, 336);
  vertex(471, 339);
  endShape();

  beginShape();
  vertex(470, 357);
  vertex(468, 361);
  vertex(465, 366);
  vertex(460, 367);
  endShape();

  line(477, 379, 478, 382);
  popMatrix();
}

Week 2_Spider-man:into the Spider-Verse 2019_2 Interactive Art





I decided to pick a scene in <Spider-Man: into the Spider-Verse>. This movie is famous for its dynamic and fantastic art works, so I tried to imitate color and structure. Especially, this scene is the most important part in this movie, with the main character(spider-man) is actually falling, but looks like he is rising by turning camera upside down. 


Here is my code.



//-----setting-----

size(960, 540);

background(60, 69, 138);

strokeCap(SQUARE);

noStroke();

//---------------


//-----background, sky-----

fill(79, 89, 161);

quad(0, 0, 0, 480, 960, 430, 960, 0);


fill(93, 102, 169);

quad(0, 0, 0, 280, 960, 350, 960, 0);

//---------------


//-----buildings-----

fill(75, 82, 147);

rect(322, 0, 300, 90);

rect(440, 0, 30, 100);



fill(59, 70, 135);

rect(167, 0, 90, 190);

rect(180, 0, 50, 230);

rect(348, 0, 30, 200);

rect(460, 0, 35, 158);

rect(487, 0, 28, 110);

rect(511, 0, 13, 175);

rect(555, 0, 31, 195);

rect(639, 0, 60, 174);

rect(750, 0, 60, 250);



fill(33, 45, 118);

quad(341, 0, 344, 44, 395, 45, 395, 0); 

quad(387, 0, 388, 174, 430, 176, 432, 0);

rect(436, 0, 14, 47);

rect(501, 0, 30, 80);

rect(531, 0, 30, 170);



fill(29, 30, 75);

quad(336, 0, 340, 235, 350, 229, 350, 0);


quad(676, 0, 664, 334, 704, 358, 716, 0);


quad(592, 0, 592, 33, 617, 19, 617, 0);

quad(599, 0, 593, 208, 605, 210, 611, 0);

quad(611, 0, 605, 210, 648, 212, 656, 0);



fill(22, 24, 63);

quad(215, 0, 220, 145, 325.5, 149, 326, 0);

quad(254, 0, 254, 234, 340, 235, 336, 0);


quad(716, 0, 704, 358, 745, 357, 760, 0);


quad(649, 0, 646, 112, 655, 110, 659, 0);

quad(648, 110, 648, 126, 656, 124, 657, 107);

quad(656, 124, 648, 126, 675, 127, 682, 125);



fill(21, 21, 32);

quad(659, 0, 655, 110, 686, 111, 692, 0);

quad(657, 107, 656, 124, 682, 125, 683, 110);



fill(14, 21, 66);

quad(790, 0, 774, 300, 810, 312, 830, 0);

quad(789, 300, 786.5, 348, 819, 362, 824, 300);

quad(797, 340, 795, 380, 823, 395, 827, 345);


fill(12, 16, 54);

quad(80, 0, 80, 310, 198, 270, 187, 0);

quad(80, 300, 80, 380, 168, 340, 163, 250);

quad(90, 330, 95, 430, 143, 400, 140, 340);

quad(20, 330, 30, 435, 95, 430, 90, 330);


quad(830, 0, 810, 312, 884, 312, 920, 0);

quad(824, 300, 819, 362, 865, 360, 870, 300);

quad(827, 345, 823, 395, 852.5, 390, 856, 345);

quad(821, 345, 815, 460, 826, 463, 831, 345);

stroke(14, 21, 66);

strokeWeight(3);

line(826, 345, 817, 530);

noStroke();



fill(2, 5, 40);

beginShape();

vertex(703, 0);

vertex(700, 95);

vertex(718, 97);

vertex(717, 118);

vertex(734, 119);

vertex(733, 137);

vertex(787, 139);

vertex(806, 133);

vertex(810, 106);

vertex(828, 105);

vertex(831, 79);

vertex(863, 65);

vertex(868, 0);

endShape();


beginShape();

vertex(0, 0);

vertex(0, 69);

vertex(240, 67);

vertex(242, 36);

vertex(285, 36);

vertex(285, 0);

endShape();



fill(7, 8, 28); 

quad(0, 0, 0, 600, 100, 400, 80, 0);


quad(900, 0, 885, 145, 960, 150, 960, 0);

quad(895, 140, 880, 300, 960, 320, 960, 150);

quad(892, 280, 883.5, 370, 960, 395, 960, 270);

quad(899, 360, 892, 438, 960, 470, 960, 350);

quad(920, 350, 910, 520, 960, 560, 960, 350);


//-----light-----

noFill();

stroke(232, 141, 255); //pink

strokeWeight(1.5);

line(109, 365, 111, 420);

line(195, 215, 197, 270);

line(197, 270, 110, 300);


line(153, 324, 168, 317);

line(168, 317, 169, 340);


line(804, 0, 802, 54);

strokeWeight(1);

line(337, 50, 339, 220);

strokeWeight(3);

line(90, 430, 90, 436);

line(95, 430, 95, 433);


stroke(2, 228, 231); //cyan

strokeWeight(1);

beginShape();

vertex(316, 76);

vertex(316, 100);

vertex(305, 100);

vertex(305, 148);

vertex(250, 146);

endShape();

line(711, 111, 703, 321);

line(822,135, 814,313);

line(814,313, 823,313);

line(823,313, 820,365);

line(820,365, 824,365);

line(824,365, 823,380);


strokeWeight(3.5);

line(281, 208, 272, 218);

line(289, 208, 280, 218);

line(297, 208, 288, 218);

line(305, 208, 296, 218);

line(313, 208, 304, 218);

line(321, 208, 312, 218);

line(329, 208, 320, 218);

line(836, 369.5, 846, 369);

line(840, 375.5, 846, 375);

line(827, 420, 827, 425);

line(827, 428, 825, 460);

strokeWeight(1.5);

line(823, 461, 820, 530);


stroke(167,106,217); //violet

strokeWeight(4);

line(384,115, 402,116);

strokeWeight(2);

line(478,94, 483,94);

line(498,68, 509,68);

line(507,62, 514,62);

line(513,56, 527,56);

line(239,40, 239,60);

strokeWeight(1.5); 

line(671, 134, 664, 335);

line(664, 335, 704, 360);



stroke(189, 225, 255); //lightblue

strokeWeight(4.5);

line(204, 39, 239, 60);



stroke(255,142,135); //coral

strokeWeight(4);

line(430,39, 430,97);

strokeWeight(6);

line(623,107, 640,108);



stroke(254,238,129); //yellow

strokeWeight(2);

line(351,8, 351,202);


line(104,195, 110,194.7);

line(130,192, 150,190);

line(80,0, 91,250);

line(0,600, 100,400);

line(100,400, 95,300);

line(890,0, 883,145);

line(883,145, 893,150);

line(893,150, 883,300);

line(883,300, 900,305);

line(892,438, 930,460);

line(912,450, 910,520);


stroke(213,203,139); //dark yellow

line(395,33, 410,33);

line(404,38, 412,38);

strokeWeight(3);

line(465,18, 473,18);

line(550,108,560,108);

line(547,113, 560,113);



noStroke();

fill(255);

quad(596, 168, 595, 201, 600, 202, 601, 168);

quad(691, 46, 689, 98, 694, 96, 696, 44);


fill(235, 214, 251);

quad(620, 167, 619, 203, 636, 203, 637, 167);

quad(698, 35, 697, 81, 706, 76, 707, 31);


//---------------------------------------


pushMatrix();   //spiderman

translate(0, 7);

fill(0); 

beginShape();

vertex(475, 304);

vertex(472, 308);

vertex(472, 312);

vertex(476, 315);

vertex(473, 317);

vertex(471, 327);

vertex(471, 332);

vertex(472, 336);

vertex(471, 339);

vertex(474, 343);

vertex(471, 321);

vertex(473, 354);

vertex(470, 357);

vertex(465, 366);

vertex(460, 367);

vertex(460, 379);

vertex(463, 379);

vertex(467, 368);

vertex(467, 370);

vertex(473, 361);

vertex(473, 374);

vertex(471, 378);

vertex(478, 384);

vertex(477, 375);

vertex(476, 374);

vertex(478, 359);

vertex(486, 343);

vertex(486, 334);

vertex(493, 338);

vertex(494, 344);

vertex(496, 344);

vertex(494, 337);

vertex(492, 333);

vertex(487, 326);

vertex(486, 318);

vertex(484, 314);

vertex(483, 308);

vertex(480, 304);

endShape();


fill(60, 0, 5); //hood

beginShape();

vertex(475, 304);

vertex(472, 308);

vertex(472, 312);

vertex(476, 315);

vertex(479, 314);

vertex(484, 314);

vertex(483, 308);

vertex(480, 304);

endShape();


stroke(255); //highlight

strokeWeight(1);

noFill();

beginShape();

vertex(476, 303);

vertex(480, 304);

vertex(483, 308);

endShape();


beginShape();

vertex(484, 314);

vertex(486, 318);

vertex(487, 326);

vertex(492, 333);

endShape();


beginShape();

vertex(472,322);

vertex(471,327);

vertex(471,332);

vertex(472,336);

vertex(471,339);

endShape();


beginShape();

vertex(470,357);

vertex(468,361);

vertex(465,366);

vertex(460,367);

endShape();


line(477,379, 478,382);

popMatrix();


2019_1 Interactive Video Week 16_FINAL 2019_1 Interactive Video












This is a kind of sorting game. The player has to sort objects with arrow key according to the recipe. 
There are three stages, and they have each rule and recipe. 
The player send ingredients included in the recipe to the bowl with left key, and inedible things to the trash can with right key. Also, from stage 2, new rule will be added. If the object is edible, but unnecessary, the player should send it to box with down arrow key.

There is a time limit, so player should hurry to do tasks. If the player exceeds the time, or have three mistakes, game will be over. When the player gets a certain score in time, player wins.


code:

PImage background;
PImage clock;
PImage lifeImg;
PImage O;
PImage X;
PImage ui;
PImage ui2;
PImage ready;
PImage start;
PImage stageClear;
PImage gameOver;
PImage menu_background;
PImage title;
PImage stage1_icon;
PImage stage2_icon;
PImage stage3_icon;
PImage againbutton;
PImage againbutton_pushed;
PImage background_stage1;
PImage result;
PImage result_clear;
PImage result_fail;
PImage selectbutton;
PImage selectbutton_pushed;
PImage startbutton;
PImage startbutton_pushed;
PImage howtoplay1;
PImage howtoplay2;
PImage nextbutton;
PImage nextbutton_pushed;
PImage recipe;
PImage menuback;
PImage menuback_pushed;
PImage backbutton;
PImage backbutton_pushed;

PImage[] objectList = new PImage[26];

int[] stage1_bowlList = {0, 1, 6, 7, 8, 9};
int[] stage1_rotList = {4, 5, 12, 13, 16, 17};

int[] stage2_bowlList = {0, 1, 6, 7, 8, 9, 10, 11};
int[] stage2_rotList = {4, 5, 12, 13, 14, 15, 16, 17};
int[] stage2_boxList = {2, 3, 18, 19, 20, 21, 22, 23};

int[] stage3_bowlList = {0, 6, 7, 8, 24, 19, 11};
int[] stage3_rotList = {4, 5, 12, 13, 14, 15, 16, 17, 25};
int[] stage3_boxList = {1, 2, 3, 9, 10, 18, 20, 21, 22, 23};

int left = 30;
int score = 0;
int life = 3; 
int time = 0; 

int answer;
int bowlObject;
int rotObject;
int boxObject;

int bowlNum = 5; 
int rotNum = 5;
int boxNum = 5;

float stage = 0;
float mode = 0;
/* 
 mode 0: title
 mode 1: menu
 mode 2.1: level 1
 mode 2.2: level 2
 mode 2.3: level 3
 mode 3.1 : result-clear
 mode 3.2 : result-fail
 */

float clockRotate = 0; 
float objectY = 0;
float objectX = 640;
float shadow = 300;
float readyY = -3000;
float startY = -3000;
float gameOverY = -3000;
float stageClearY = -3000;
float timeEnd = 0;

float check = 0; // 0:none, 1:correct, 2:incorrect

boolean game = false;
boolean howtoplay = true;
boolean showRecipe = false;
boolean gameEnd = false;

PFont font1;

void setup() {
  imageMode(CENTER);
  size(1280, 720);
  background = loadImage("background.png");
  clock = loadImage("clock.png");
  lifeImg = loadImage("life.png");
  ui = loadImage("ui.png");
  ui2 = loadImage("ui2.png");
  O = loadImage("O.png");
  X = loadImage("X.png");
  ready = loadImage("ready.png");
  start = loadImage("start.png");
  gameOver = loadImage("gameover.png");
  stageClear = loadImage("stageclear.png");
  menu_background = loadImage("menu.png");
  title = loadImage("title.png");
  stage1_icon = loadImage("stage1.png");
  stage2_icon = loadImage("stage2.png");
  stage3_icon = loadImage("stage3.png");
  againbutton = loadImage("againbutton.png");
  againbutton_pushed = loadImage("againbutton_pushed.png");
  background_stage1 = loadImage("background_stage1.png");
  result = loadImage("result.png");
  result_clear = loadImage("result_clear.png");
  result_fail = loadImage("result_fail.png");
  selectbutton = loadImage("selectbutton.png");
  selectbutton_pushed = loadImage("selectbutton_pushed.png");
  startbutton = loadImage("startbutton.png");
  startbutton_pushed = loadImage("startbutton_pushed.png");
  howtoplay1 = loadImage("howtoplay1.png");
  howtoplay2 = loadImage("howtoplay2.png");
  nextbutton = loadImage("nextbutton.png");
  nextbutton_pushed = loadImage("nextbutton_pushed.png");
  recipe = loadImage("recipe.png");
  menuback = loadImage("menuback.png");
  menuback_pushed = loadImage("menuback_pushed.png");
  backbutton = loadImage("backbutton.png");
  backbutton_pushed = loadImage("backbutton_pushed.png");

  for (int i=0; i<26; i++) {
    String objectlist = (i) + ".png";
    objectList[i] = loadImage(objectlist);
  }

  font1 = loadFont("NanumSquareOTFR-48.vlw");
  textFont(font1, 48);

  answer = int(random(2)); //choose answer 0bowl 1rot 2box
  bowlObject = int(random(bowlNum)); //choose object
  rotObject = int(random(rotNum));
  boxObject = int(random(boxNum));
}

void draw() {
  imageMode(CENTER);

  //-------title-------------------------
  if (mode == 0) {
    image(title, width/2, height/2);

    fill(255);
    image(startbutton, width/1.32, height/1.27);

    if (mousePressed) {
      if (mouseX>width/1.64 && mouseX<width/1.1 && mouseY>height/1.41 && mouseY<height/1.16) {
        image(startbutton_pushed, width/1.32, height/1.27);
      }
    }
  }

  //------------------------menu-------------------
  if (mode == 1) { //menu
    image(menu_background, width/2, height/2);

    image(stage1_icon, width/4.5, height/2.05);
    image(stage2_icon, width/2, height/2);
    image(stage3_icon, width/1.28, height/2);

    if (mouseY>height/3 && mouseY<height/1.5) {
      if (mouseX>width/7 && mouseX<width/3.3) { //stage 1 icon
        pushMatrix(); //mouseover effect
        translate(width/4.5, height/2.05);
        scale(1.2);
        image(stage1_icon, 0, 0);
        popMatrix();
        if (mousePressed) {
          image(menu_background, width/2, height/2);
          image(stage2_icon, width/2, height/2);
          image(stage3_icon, width/1.28, height/2);

          pushMatrix(); //mouse click effect
          translate(width/4.5, height/2.05);
          scale(0.95);
          image(stage1_icon, 0, 0);
          popMatrix();
        }
      } else if (mouseX>width/2.4 && mouseX<width/1.7) { //stage 2 icon
        pushMatrix(); //mouseover effect
        translate(width/2, height/2);
        scale(1.2);
        image(stage2_icon, 0, 0);
        popMatrix();
        if (mousePressed) {
          image(menu_background, width/2, height/2);
          image(stage1_icon, width/4.5, height/2.05);
          image(stage3_icon, width/1.28, height/2);

          pushMatrix(); //mouse click effect
          translate(width/2, height/2);
          scale(0.95);
          image(stage2_icon, 0, 0);
          popMatrix();
        }
      } else if (mouseX>width/1.45 && mouseX<width/1.15) { //stage 3 icon
        pushMatrix(); //mouseover effect
        translate(width/1.28, height/2);
        scale(1.2);
        image(stage3_icon, 0, 0);
        popMatrix();
        if (mousePressed) {
          image(menu_background, width/2, height/2);
          image(stage1_icon, width/4.5, height/2.05);
          image(stage2_icon, width/2, height/2);

          pushMatrix(); //mouse click effect
          translate(width/1.28, height/2);
          scale(0.95);
          image(stage3_icon, 0, 0);
          popMatrix();
        }
      }
    }
    image(menuback, width/1.04, height/14); //button: back to title
    if (mousePressed) {
      if (mouseX>width/1.075 && mouseX<width/1.007 && mouseY>height/50 && mouseY<height/8) {
        image(menuback_pushed, width/1.04, height/14);
      }
    }
  }

  //---------------game----------------

  if (mode == 2.1) {
    stage = 2.1;
    left = 25;
    bowlNum = 6;
    rotNum = 6;
    draw_stage1();
  }

  if (mode == 2.2) {
    stage = 2.2;
    left = 25;
    bowlNum = 8; 
    rotNum = 8;
    boxNum = 8;
    draw_stage2();
  }
  if (mode == 2.3) {
    stage = 2.3;
    left = 30;
    bowlNum = 7; 
    rotNum = 9;
    boxNum = 10;
    draw_stage3();
  }

  //------------result-----------------------

  if (mode>3 && mode<4) {
    if (mode<2.3) {
      howtoplay = true;
      showRecipe = false;
    } else if (mode>2.2) {
      showRecipe = true;
    }
    clockRotate = 0; 
    objectY = 0;
    objectX = 640;
    shadow = 300;
    readyY = -3000;
    startY = -3000;
    gameOverY = -3000;
    stageClearY = -3000;

    image(result, width/2, height/2);
    image(againbutton, width/1.325, height/1.28);
    image(selectbutton, width/1.325, height/1.28);
    if (mousePressed) {
      if (mouseY>height/1.39 && mouseY<height/1.19) {
        if (mouseX>width/1.65 && mouseX<width/1.34) {
          image(againbutton_pushed, width/1.325, height/1.28);
        } else if (mouseX>width/1.31 && mouseX<width/1.11) {
          image(selectbutton_pushed, width/1.325, height/1.28);
        }
      }
    }
    if (mode == 3.1) {
      image(result_clear, width/1.325, height/2.4);
    } else if (mode == 3.2) {
      image(result_fail, width/1.32, height/2.4);
    }
  }
}

void keyReleased() {
  if (mode>2 && mode<3 && game == true) {
    if (mode == 2.1) {
      if (check == 1) { //correct answer
        answer = int(random(2)); //only bowl or trash can
        bowlObject = int(random(bowlNum)); 
        rotObject = int(random(rotNum));
        objectY = 0;
        score += 1;
        check = 0;
        objectX = width/2;
        shadow = 300;
      } else if (check == 2) { //worng answer
        answer = int(random(2)); //only bowl or trash can
        bowlObject = int(random(bowlNum)); 
        rotObject = int(random(rotNum));
        objectY = 0;
        life -= 1;
        check = 0;
        objectX = width/2;
        shadow = 300;
      }
    }
    if (check == 1) { //correct answer
      answer = int(random(3));
      bowlObject = int(random(bowlNum)); 
      rotObject = int(random(rotNum));
      boxObject = int(random(boxNum));
      objectY = 0;
      score += 1;
      check = 0;
      objectX = width/2;
      shadow = 300;
    } else if (check == 2) { //worng answer
      answer = int(random(3));
      bowlObject = int(random(bowlNum)); 
      rotObject = int(random(rotNum));
      boxObject = int(random(boxNum));
      objectY = 0;
      life -= 1;
      check = 0;
      objectX = width/2;
      shadow = 300;
    }
  }

  if (score == left) {
    timeEnd = millis();
  }

  if (life == 0 || millis()-time>34000) {
    timeEnd = millis();
  }
}

void mouseReleased() {
  if (mode == 0 && mouseX>width/1.64 && mouseX<width/1.1 && mouseY>height/1.41 && mouseY<height/1.16) {
    mode = 1; //title, start button
  }

  if (mode == 1 && mouseX>width/1.075 && mouseX<width/1.007 && mouseY>height/50 && mouseY<height/8) {
    mode = 0; //menu, back to title
  }

  if (mode == 1 && mouseY>height/3 && mouseY<height/1.5) { //menu
    if (mouseX>width/7 && mouseX<width/3.3) { //to stage1
      mode = 2.1;
    } else if (mouseX>width/2.4 && mouseX<width/1.7) { //to stage2
      mode = 2.2;
    } else if (mouseX>width/1.45 && mouseX<width/1.15) { //to stage3
      mode = 2.3;

      showRecipe = true;
    }
  }

  if (mode > 2 && mode < 3) {
    if (mode > 2.2) { //stage3 
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        mode = 1;
        howtoplay = true;
      }
    }
    if (howtoplay == true) {
      if (mouseX>width/1.24 && mouseX<width/1.07 && mouseY>height/1.21 && mouseY<height/1.1) {
        howtoplay = false; //next
        showRecipe = true;
      }
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        mode = 1; //back
        howtoplay = true;
      }
    }

    if (showRecipe == true && mouseX>width/2.8 && mouseX<width/1.55 && mouseY>height/1.32 && mouseY<height/1.1) {
      showRecipe = false; //game start
      howtoplay = false;
      time = millis();
    }
    if (showRecipe == true && mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
      howtoplay = true; //back
      showRecipe = false;
    }
  }

  if (mode > 3 && mode < 4) {
    if (mouseY>height/1.39 && mouseY<height/1.19) {
      if (mouseX>width/1.65 && mouseX<width/1.34) {
        mode = stage; //try again, go to stage user just played
        if (stage == 2.3) {
          howtoplay = false;
          showRecipe = true;
        } else {
          howtoplay = true;
          showRecipe = false;
        }
      } else if (mouseX>width/1.31 && mouseX<width/1.11) {
        mode = 1; //go to menu
      }
    }
  }
}

//----------------------------------------------
//--------------------stage1---------------------
//----------------------------------------------

void draw_stage1() {
  image(background_stage1, width/2, height/2);
  image(ui, width/2, 67);
  image(clock, width/2-50, 10);
  image(ui2, width/2, 67);

  if (howtoplay == true) {
    image(howtoplay1, width/2, height/2);
    image(nextbutton, width/1.15, height/1.15);
    image(backbutton, width/7.5, height/1.15);

    if (mousePressed) {
      if (mouseX>width/1.24 && mouseX<width/1.07 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(nextbutton_pushed, width/1.15, height/1.15);
      }
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(backbutton_pushed, width/7.5, height/1.15);
      }
    }
  }

  if (showRecipe == true) {
    image(recipe, width/2, height/2);
    image(startbutton, width/2, height/1.2);
    image(backbutton, width/7.5, height/1.15);

    pushMatrix(); //show recipe
    scale(0.8);
    for (int i=0; i<6; i++) {  
      image(objectList[stage1_bowlList[i]], (width/4.5)+(205*i), height/1.6);
    }
    popMatrix();

    if (mousePressed) {
      if (mouseX>width/2.8 && mouseX<width/1.55 && mouseY>height/1.32 && mouseY<height/1.1) {
        image(startbutton_pushed, width/2, height/1.2);
      }
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(backbutton_pushed, width/7.5, height/1.15);
      }
    }
  }

  if (showRecipe == false && howtoplay == false) {
    if (game == true) {
      objectY += (height/2.3-objectY)*0.3;

      fill(157, 180, 173);
      noStroke();
      ellipse(width/2, height/1.8, shadow, 50);
      shadow += (180-shadow)*0.3;

      if (answer==0) { //bowl 
        image(objectList[stage1_bowlList[bowlObject]], objectX, objectY);   
        if (keyPressed) {
          if (keyCode == LEFT) { 
            objectX = objectX + (width/10-objectX)*0.5;
            image(O, width/2, height/2.3); 

            check = 1;
          } else if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          }
        }
      } else if (answer==1) { //rot 
        image(objectList[stage1_rotList[rotObject]], objectX, objectY);
        if (keyPressed) {
          if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(O, width/2, height/2.3);
            check = 1;
          } else if (keyCode == LEFT) {
            objectX = objectX + (width/10-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          }
        }
      }
    }

    image(ui, width/2, 67);
    pushMatrix();
    scale(0.26);
    for (int i=0; i<6; i++) {  
      image(objectList[stage1_bowlList[i]], (width/4.5)+(250*i), height/5);
    }
    popMatrix();

    if (score == left) {
      game = false;
      readyY = -3000;
      startY = -3000;
      time = millis();

      image(stageClear, width/2, stageClearY);
      stageClearY += (height/2 - stageClearY)*0.3;
      if (millis()-timeEnd>3000) {
        mode = 3.1;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
    }

    if (life == 0 || millis()-time>34000) {      
      game = false;
      readyY = -3000;
      startY = -3000;

      image(gameOver, width/2, gameOverY);
      gameOverY += (height/2 - gameOverY)*0.3;
      if (life == 0 && millis()-timeEnd>3000) {
        mode = 3.2;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
      if (millis()-time>37000){
        mode = 3.2;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
    }

    fill(255);
    text(score, width/1.51, 55);
    text(left, width/1.36, 55);

    if (mode>2 && mode <3 && game == true) {
      //text((millis()-time)/1000, 0, 50);
      clockRotate = ((millis()-time-4000)/1000)*6;
    }
    pushMatrix(); //clock
    translate(width/2, 10);
    rotate(-radians(clockRotate));
    image(clock, -50, 0);
    popMatrix();

    for (int i=0; i<life; i++) {  //life
      image(lifeImg, (width/1.19)+(75*i), 35);
    }

    //--------------------------------------------------
    image(ready, width/2, readyY);  //ready start
    if (millis()-time<2000) {
      readyY += (height/2 - readyY)*0.3;
    }

    if (millis()-time<4000 && millis()-time>2000) { 
      readyY += (3000 - readyY)*0.3;
      image(start, width/2, startY);
      startY += (height/2 - startY)*0.3;
    }
    if (millis()-time<4500 && millis()-time>4000) {
      startY += (3000 - startY)*0.3;
      game = true;
    }

    image(ui2, width/2, 67);
  }
}


//----------------------------------------------
//--------------------stage2---------------------
//----------------------------------------------

void draw_stage2() {
  image(background, width/2, height/2);
  image(ui, width/2, 67);
  image(clock, width/2-50, 10);
  image(ui2, width/2, 67);

  if (howtoplay == true) {
    image(howtoplay2, width/2, height/2);
    image(nextbutton, width/1.15, height/1.15);
    image(backbutton, width/7.5, height/1.15);

    if (mousePressed) {
      if (mouseX>width/1.24 && mouseX<width/1.07 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(nextbutton_pushed, width/1.15, height/1.15);
      }
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(backbutton_pushed, width/7.5, height/1.15);
      }
    }
  }

  if (showRecipe == true) {
    image(recipe, width/2, height/2);
    image(startbutton, width/2, height/1.2);
    image(backbutton, width/7.5, height/1.15);

    pushMatrix(); //show recipe
    scale(0.8);
    for (int i=0; i<6; i++) {  
      image(objectList[stage2_bowlList[i]], (width/4.5)+(205*i), height/1.6);
    }
    popMatrix();

    if (mousePressed) {
      if (mouseX>width/2.8 && mouseX<width/1.55 && mouseY>height/1.32 && mouseY<height/1.1) {
        image(startbutton_pushed, width/2, height/1.2);
      }
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(backbutton_pushed, width/7.5, height/1.15);
      }
    }
  }

  if (showRecipe == false && howtoplay == false) {
    if (game == true) {
      objectY += (height/2.3-objectY)*0.3;

      fill(157, 180, 173);
      noStroke();
      ellipse(width/2, height/1.8, shadow, 50);
      shadow += (180-shadow)*0.3;

      if (answer==0) { //bowl 
        image(objectList[stage2_bowlList[bowlObject]], objectX, objectY);   
        if (keyPressed) {
          if (keyCode == LEFT) { 
            objectX = objectX + (width/10-objectX)*0.5;
            image(O, width/2, height/2.3); 
            check = 1;
          } else if (keyCode == DOWN) {
            objectY = objectY + (height*1.2-objectY)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          } else if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          }
        }
      } else if (answer==1) { //rot 
        image(objectList[stage2_rotList[rotObject]], objectX, objectY);
        if (keyPressed) {
          if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(O, width/2, height/2.3);
            check = 1;
          } else if (keyCode == DOWN) {
            objectY = objectY + (height*1.2-objectY)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          } else if (keyCode == LEFT) {
            objectX = objectX + (width/10-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          }
        }
      } else if (answer==2) { //box
        image(objectList[stage2_boxList[boxObject]], objectX, objectY);
        if (keyPressed) {
          if (keyCode == DOWN) {
            objectY = objectY + (height*1.2-objectY)*0.5;
            image(O, width/2, height/2.3);
            check = 1;
          } else if (keyCode == LEFT) {     
            objectX = objectX + (width/10-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          } else if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(X, width/2, height/2.3);        
            check = 2;
          }
        }
      }
    }

    image(ui, width/2, 67);
    pushMatrix();
    scale(0.26);
    for (int i=0; i<6; i++) {  
      image(objectList[stage2_bowlList[i]], (width/4.5)+(250*i), height/5);
    }
    popMatrix();

    if (score == left) {
      game = false;
      readyY = -3000;
      startY = -3000;
      time = millis();

      image(stageClear, width/2, stageClearY);
      stageClearY += (height/2 - stageClearY)*0.3;
      if (millis()-timeEnd>3000) {
        mode = 3.1;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
    }

    if (life == 0 || millis()-time>34000) {
      game = false;
      readyY = -3000;
      startY = -3000;

      image(gameOver, width/2, gameOverY);
      gameOverY += (height/2 - gameOverY)*0.3;
      if (life == 0 && millis()-timeEnd>3000) {
        mode = 3.2;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
      if (millis()-time>37000) {
        mode = 3.2;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
    }

    fill(255);
    text(score, width/1.51, 55);
    text(left, width/1.36, 55);

    if (mode>2 && mode <3 && game == true) {
      //text((millis()-time)/1000, 0, 50);
      clockRotate = ((millis()-time-4000)/1000)*6;
    }
    pushMatrix(); //clock
    translate(width/2, 10);
    rotate(-radians(clockRotate));
    image(clock, -50, 0);
    popMatrix();

    for (int i=0; i<life; i++) {  //life
      image(lifeImg, (width/1.19)+(75*i), 35);
    }

    //--------------------------------------------------
    image(ready, width/2, readyY);  //ready start
    if (millis()-time<2000) {
      readyY += (height/2 - readyY)*0.3;
    }

    if (millis()-time<4000 && millis()-time>2000) { 
      readyY += (3000 - readyY)*0.3;
      image(start, width/2, startY);
      startY += (height/2 - startY)*0.3;
    }
    if (millis()-time<4500 && millis()-time>4000) {
      startY += (3000 - startY)*0.3;
      game = true;
    }

    image(ui2, width/2, 67);
  }
}

//----------------------------------------------
//--------------------stage3---------------------
//----------------------------------------------

void draw_stage3() {
  
  image(background, width/2, height/2);
  image(ui, width/2, 67);
  image(clock, width/2-50, 10);
  image(ui2, width/2, 67);

  howtoplay = false;

  if (showRecipe == true) {
    image(recipe, width/2, height/2);
    image(startbutton, width/2, height/1.2);
    image(backbutton, width/7.5, height/1.15);

    pushMatrix(); //show recipe
    scale(0.8);
    for (int i=0; i<6; i++) {  
      image(objectList[stage3_bowlList[i]], (width/4.9)+(220*i), height/1.6);
    }
    popMatrix();

    if (mousePressed) {
      if (mouseX>width/2.8 && mouseX<width/1.55 && mouseY>height/1.32 && mouseY<height/1.1) {
        image(startbutton_pushed, width/2, height/1.2);
      }
      if (mouseX>width/14.5 && mouseX<width/5.1 && mouseY>height/1.21 && mouseY<height/1.1) {
        image(backbutton_pushed, width/7.5, height/1.15);
      }
    }
  }

  if (showRecipe == false && howtoplay == false) {
    if (game == true) {
      objectY += (height/2.3-objectY)*0.3;

      fill(157, 180, 173);
      noStroke();
      ellipse(width/2, height/1.8, shadow, 50);
      shadow += (180-shadow)*0.3;

      if (answer==0) { //bowl 
        image(objectList[stage3_bowlList[bowlObject]], objectX, objectY);   
        if (keyPressed) {
          if (keyCode == LEFT) { 
            objectX = objectX + (width/10-objectX)*0.5;
            image(O, width/2, height/2.3); 
            check = 1;
          } else if (keyCode == DOWN) {
            objectY = objectY + (height*1.2-objectY)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          } else if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          }
        }
      } else if (answer==1) { //rot 
        image(objectList[stage3_rotList[rotObject]], objectX, objectY);
        if (keyPressed) {
          if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(O, width/2, height/2.3);
            check = 1;
          } else if (keyCode == DOWN) {
            objectY = objectY + (height*1.2-objectY)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          } else if (keyCode == LEFT) {
            objectX = objectX + (width/10-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          }
        }
      } else if (answer==2) { //box
        image(objectList[stage3_boxList[boxObject]], objectX, objectY);
        if (keyPressed) {
          if (keyCode == DOWN) {
            objectY = objectY + (height*1.2-objectY)*0.5;
            image(O, width/2, height/2.3);
            check = 1;
          } else if (keyCode == LEFT) {     
            objectX = objectX + (width/10-objectX)*0.5;
            image(X, width/2, height/2.3);
            check = 2;
          } else if (keyCode == RIGHT) {
            objectX = objectX + (width/1.1-objectX)*0.5;
            image(X, width/2, height/2.3);        
            check = 2;
          }
        }
      }
    }

    image(ui, width/2, 67);
    pushMatrix();
    scale(0.26);
    for (int i=0; i<6; i++) {  
      image(objectList[stage3_bowlList[i]], (width/4.7)+(260*i), height/5);
    }
    popMatrix();

    if (score == left) {
      game = false;
      readyY = -3000;
      startY = -3000;
      time = millis();

      image(stageClear, width/2, stageClearY);
      stageClearY += (height/2 - stageClearY)*0.3;
      if (millis()-timeEnd>3000) {
        mode = 3.1;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
    }

    if (life == 0 || millis()-time>34000) {
      game = false;
      readyY = -3000;
      startY = -3000;

      image(gameOver, width/2, gameOverY);
      gameOverY += (height/2 - gameOverY)*0.3;
      if (life == 0 && millis()-timeEnd>3000) {
        mode = 3.2;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
      if (millis()-time>37000) {
        mode = 3.2;
        score = 0;
        life = 3;
        clockRotate = 0;
      }
    }

    fill(255);
    text(score, width/1.51, 55);
    text(left, width/1.36, 55);

    if (mode>2 && mode <3 && game == true) {
      //text((millis()-time)/1000, 0, 50);
      clockRotate = ((millis()-time-4000)/1000)*6;
    }
    pushMatrix(); //clock
    translate(width/2, 10);
    rotate(-radians(clockRotate));
    image(clock, -50, 0);
    popMatrix();

    for (int i=0; i<life; i++) {  //life
      image(lifeImg, (width/1.19)+(75*i), 35);
    }

    //--------------------------------------------------
    image(ready, width/2, readyY);  //ready start
    if (millis()-time<2000) {
      readyY += (height/2 - readyY)*0.3;
    }

    if (millis()-time<4000 && millis()-time>2000) { 
      readyY += (3000 - readyY)*0.3;
      image(start, width/2, startY);
      startY += (height/2 - startY)*0.3;
    }
    if (millis()-time<4500 && millis()-time>4000) {
      startY += (3000 - startY)*0.3;
      game = true;
    }

    image(ui2, width/2, 67);
  }
}









2019_1 Interactive Video Week 14 2019_1 Interactive Video








PImage background;
PImage clock;
PImage lifeImg;
PImage O;
PImage X;
PImage ui;
PImage ui2;
PImage ready;
PImage start;
PImage stageClear;
PImage gameOver;
PImage menu_background;
PImage title;
PImage stage1_icon;
PImage stage2_icon;
PImage stage3_icon;
PImage againbutton;
PImage againbutton_pushed;
PImage background_stage1;
PImage result;
PImage result_clear;
PImage result_fail;
PImage selectbutton;
PImage selectbutton_pushed;
PImage startbutton;
PImage startbutton_pushed;


PImage[] objectList = new PImage[24];

int[] stage1_bowlList = {0, 1, 6, 7, 8, 9, 10, 11};
int[] stage1_boxList = {2, 3, 18, 19, 20, 21, 22, 23};
int[] stage1_rotList = {4, 5, 12, 13, 14, 15, 16, 17};

int[] stage2_bowlList = {0, 1, 6, 7, 8, 9, 10, 11};
int[] stage2_boxList = {2, 3, 18, 19, 20, 21, 22, 23};
int[] stage2_rotList = {4, 5, 12, 13, 14, 15, 16, 17};

int[] stage3_bowlList = {0, 1, 6, 7, 8, 9, 10, 11};
int[] stage3_boxList = {2, 3, 18, 19, 20, 21, 22, 23};
int[] stage3_rotList = {4, 5, 12, 13, 14, 15, 16, 17};

int left = 30;
int score = 0;
int life = 3; 
int time = 0; 

int answer;
int bowlObject;
int rotObject;
int boxObject;
int bowlNum = 5; 
int rotNum = 5;
int boxNum = 5;

float stage = 0;
float mode = 0;
/* 
 mode 0: title
 mode 1: menu
 mode 2.1: level 1
 mode 2.2: level 2
 mode 2.3: level 3
 mode 3: end
 mode 3.1 : result-clear
 mode 3.2 : result-fail
 */

float clockRotate = 0; 
float objectY = 0;
float objectX = 640;
float shadow = 300;
float readyY = -3000;
float startY = -3000;
float gameOverY = -3000;
float stageClearY = -3000;

float check = 0; // 0:none, 1:correct, 2:incorrect

boolean game = false;

void setup() {
  imageMode(CENTER);
  size(1280, 720);
  background = loadImage("background.png");
  clock = loadImage("clock.png");
  lifeImg = loadImage("life.png");
  ui = loadImage("ui.png");
  ui2 = loadImage("ui2.png");
  O = loadImage("O.png");
  X = loadImage("X.png");
  ready = loadImage("ready.png");
  start = loadImage("start.png");
  gameOver = loadImage("gameover.png");
  stageClear = loadImage("stageclear.png");
  menu_background = loadImage("menu.png");
  title = loadImage("title.png");
  stage1_icon = loadImage("stage1.png");
  stage2_icon = loadImage("stage2.png");
  stage3_icon = loadImage("stage3.png");
  againbutton = loadImage("againbutton.png");
  againbutton_pushed = loadImage("againbutton_pushed.png");
  background_stage1 = loadImage("background_stage1.png");
  result = loadImage("result.png");
  result_clear = loadImage("result_clear.png");
  result_fail = loadImage("result_fail.png");
  selectbutton = loadImage("selectbutton.png");
  selectbutton_pushed = loadImage("selectbutton_pushed.png");
  startbutton = loadImage("startbutton.png");
  startbutton_pushed = loadImage("startbutton_pushed.png");


  for (int i=0; i<24; i++) {
    String objectlist = (i) + ".png";
    objectList[i] = loadImage(objectlist);
  }

  answer = int(random(2)); //choose answer 0bowl 1rot 2box
  bowlObject = int(random(bowlNum)); //choose object
  rotObject = int(random(rotNum));
  boxObject = int(random(boxNum));
}

void draw() {
  imageMode(CENTER);

  if (mode == 0) {
    image(title, width/2, height/2);

    fill(255);
    textSize(30);
    text("start", 900, 600);
    image(startbutton, width/1.32, height/1.27);

    if (mousePressed) {
      if (mouseX>width/1.64 && mouseX<width/1.1 && mouseY>height/1.41 && mouseY<height/1.16) {
        image(startbutton_pushed, width/1.32, height/1.27);
      }
    }
  }

  if (mode == 1) { //menu
    image(menu_background, width/2, height/2);

    image(stage1_icon, width/4.5, height/2.05);
    image(stage2_icon, width/2, height/2);
    image(stage3_icon, width/1.28, height/2);

    if (mouseY>height/3 && mouseY<height/1.5) {
      if (mouseX>width/7 && mouseX<width/3.3) {
        pushMatrix();
        translate(width/4.5, height/2.05);
        scale(1.2);
        image(stage1_icon, 0, 0);
        popMatrix();
        if (mousePressed) {
          image(menu_background, width/2, height/2);
          image(stage2_icon, width/2, height/2);
          image(stage3_icon, width/1.28, height/2);

          pushMatrix();
          translate(width/4.5, height/2.05);
          scale(0.95);
          image(stage1_icon, 0, 0);
          popMatrix();
        }
      } else if (mouseX>width/2.4 && mouseX<width/1.7) {
        pushMatrix();
        translate(width/2, height/2);
        scale(1.2);
        image(stage2_icon, 0, 0);
        popMatrix();
        if (mousePressed) {
          image(menu_background, width/2, height/2);
          image(stage1_icon, width/4.5, height/2.05);
          image(stage3_icon, width/1.28, height/2);

          pushMatrix();
          translate(width/2, height/2);
          scale(0.95);
          image(stage2_icon, 0, 0);
          popMatrix();
        }
      } else if (mouseX>width/1.45 && mouseX<width/1.15) {
        pushMatrix();
        translate(width/1.28, height/2);
        scale(1.2);
        image(stage3_icon, 0, 0);
        popMatrix();
        if (mousePressed) {
          image(menu_background, width/2, height/2);
          image(stage1_icon, width/4.5, height/2.05);
          image(stage2_icon, width/2, height/2);

          pushMatrix();
          translate(width/1.28, height/2);
          scale(0.95);
          image(stage3_icon, 0, 0);
          popMatrix();
        }
      }
    }
  }

  //---------------game----------------

  if (mode == 2.1) {
    stage = 2.1;
    fill(0);
    rect(0, 0, width, height);
    fill(255);
    text("stage 1 not yet", width/2, height/2);
    if (mousePressed) {
      mode = 3.2;
    }
  }
  if (mode == 2.2) {
    stage = 2.2;
    draw_stage2();
  }
  if (mode == 2.3) {
    stage = 2.3;
    fill(0);
    rect(0, 0, width, height);
    fill(255);
    text("stage 3 not yet", width/2, height/2);
    if (mousePressed) {
      mode = 3.2;
    }
  }
  //-----------------------------------

  if (mode>3 && mode<4) { 
    image(result, width/2, height/2);
    image(againbutton, width/1.325, height/1.28);
    image(selectbutton, width/1.325, height/1.28);
    if (mousePressed) {
      if (mouseY>height/1.39 && mouseY<height/1.19) {
        if (mouseX>width/1.65 && mouseX<width/1.34) {
          image(againbutton_pushed, width/1.325, height/1.28);
        } else if (mouseX>width/1.31 && mouseX<width/1.11) {
          image(selectbutton_pushed, width/1.325, height/1.28);
        }
      }
    }
    if (mode == 3.1) {
      image(result_clear, width/1.325, height/2.4);
    } else if (mode == 3.2) {
      image(result_fail, width/1.32, height/2.4);
    }
  }
}

void keyReleased() {
  if (mode>2 && mode<3) {
    if (check == 1) {
      if (mode == 2.1) {
        answer = int(random(2));
      }
      answer = int(random(3));
      bowlObject = int(random(bowlNum)); 
      rotObject = int(random(rotNum));
      boxObject = int(random(boxNum));
      objectY = 0;
      score += 1;
      check = 0;
      objectX = width/2;
      shadow = 300;
    } else if (check == 2) {
      if (mode == 2.1) {
        answer = int(random(2));
      }
      answer = int(random(3));
      bowlObject = int(random(bowlNum)); 
      rotObject = int(random(rotNum));
      boxObject = int(random(boxNum));
      objectY = 0;
      life -= 1;
      check = 0;
      objectX = width/2;
      shadow = 300;
    }
  }
}

void mouseReleased() {
  if (mode == 0 && mouseX>width/1.64 && mouseX<width/1.1 && mouseY>height/1.41 && mouseY<height/1.16) {
    mode = 1;
  }

  if (mode == 1 && mouseY>height/3 && mouseY<height/1.5) {
    if (mouseX>width/7 && mouseX<width/3.3) {
      mode = 2.1;
    } else if (mouseX>width/2.4 && mouseX<width/1.7) {
      mode = 2.2;
      bowlNum = 8; 
      rotNum = 8;
      boxNum = 8;
      time = millis();
    } else if (mouseX>width/1.45 && mouseX<width/1.15) {
      mode = 2.3;
    }
  }

  if (mode > 3 && mode < 4) {
    if (mouseY>height/1.39 && mouseY<height/1.19) {
      if (mouseX>width/1.65 && mouseX<width/1.34) {
        time = millis();
        mode = stage;
      } else if (mouseX>width/1.31 && mouseX<width/1.11) {
        mode = 1;
      }
    }
  }
}

//-----------------------------------------------
//--------------------stage2 code------------------
//-----------------------------------------------

void draw_stage2() {
  image(background, width/2, height/2);

  if (game == true) {
    objectY += (height/2.3-objectY)*0.3;

    fill(157, 180, 173);
    noStroke();
    ellipse(width/2, height/1.8, shadow, 50);
    shadow += (180-shadow)*0.3;

    if (answer==0) { //bowl 
      image(objectList[stage2_bowlList[bowlObject]], objectX, objectY);   
      if (keyPressed) {
        if (keyCode == LEFT) { 
          objectX = objectX + (width/10-objectX)*0.5;
          image(O, width/2, height/2.3); 
          check = 1;
        } else if (keyCode == DOWN) {
          objectY = objectY + (height*1.2-objectY)*0.5;
          image(X, width/2, height/2.3);
          check = 2;
        } else if (keyCode == RIGHT) {
          objectX = objectX + (width/1.1-objectX)*0.5;
          image(X, width/2, height/2.3);
          check = 2;
        }
      }
    } else if (answer==1) { //rot 
      image(objectList[stage2_rotList[rotObject]], objectX, objectY);
      if (keyPressed) {
        if (keyCode == RIGHT) {
          objectX = objectX + (width/1.1-objectX)*0.5;
          image(O, width/2, height/2.3);
          check = 1;
        } else if (keyCode == DOWN) {
          objectY = objectY + (height*1.2-objectY)*0.5;
          image(X, width/2, height/2.3);
          check = 2;
        } else if (keyCode == LEFT) {
          objectX = objectX + (width/10-objectX)*0.5;
          image(X, width/2, height/2.3);
          check = 2;
        }
      }
    } else if (answer==2) { //box
      image(objectList[stage2_boxList[boxObject]], objectX, objectY);
      if (keyPressed) {
        if (keyCode == DOWN) {
          objectY = objectY + (height*1.2-objectY)*0.5;
          image(O, width/2, height/2.3);
          check = 1;
        } else if (keyCode == LEFT) {     
          objectX = objectX + (width/10-objectX)*0.5;
          image(X, width/2, height/2.3);
          check = 2;
        } else if (keyCode == RIGHT) {
          objectX = objectX + (width/1.1-objectX)*0.5;
          image(X, width/2, height/2.3);        
          check = 2;
        }
      }
    }
  }

  image(ui, width/2, 67);

  if (score == left) {
    println("complete");
    game = false;
    readyY = -3000;
    startY = -3000;

    image(stageClear, width/2, stageClearY);
    stageClearY += (height/2 - stageClearY)*0.3;
    if (mousePressed) {
      mode = 3.1;
      score = 0;
      life = 3;
      clockRotate = 0;
    }
  }

  if (life == 0 || millis()-time>34000) {
    println("failed");
    game = false;
    readyY = -3000;
    startY = -3000;

    image(gameOver, width/2, gameOverY);
    gameOverY += (height/2 - gameOverY)*0.3;
    if (mousePressed) {
      mode = 3.2;
      score = 0;
      life = 3;
      clockRotate = 0;
    }
  }

  fill(255);
  textSize(32);
  text(score, width/1.5, 50);
  text(left, width/1.35, 50);

  if (mode>2 && mode <3 && game == true) {
    //text((millis()-time)/1000, 0, 50);
    clockRotate = ((millis()-time-4000)/1000)*6;
  }
  pushMatrix(); //clock
  translate(width/2, 10);
  rotate(-radians(clockRotate));
  image(clock, -50, 0);
  popMatrix();

  for (int i=0; i<life; i++) {  //life
    image(lifeImg, (width/1.19)+(75*i), 35);
  }

//--------------------------------------------------
  image(ready, width/2, readyY);  //ready start
  readyY += (height/2 - readyY)*0.3;
  if (millis()-time>2000) { 
    readyY += (3000 - readyY)*0.3;
    image(start, width/2, startY);
    startY += (height/2 - startY)*0.3;
  }
  if (millis()-time>4000) {
    startY += (3000 - startY)*0.3;
    game = true;
  }
  
  image(ui2, width/2, 67);
}


1 2 3 4