int i;
int hue;
float x;
float x2;
float x3;
float y;
float x4;
float w;
int vx;
int vx2;
int vx3;
int vy;
int vw;
int vx4;
float speed;
PFont myfont;
float X, Y;
float Cx=100, Cy=100;
float Angle = 10;
float R = 100;
int c = 0;
int startTime;
PImage img;
PImage img2;
PImage img3;
float Cx2=100, Cy2=100;
float angle2= 0;
float x5 =0;
float y5 =0;
float cy;
int vcy;

void setup() {
  size(500, 500);
  x = 0;
  x2 = 0;
  x3 = 0;
  y = 0;
  w = 0;
  x4 = 0;
  vx = 5;
  vx2 = 5;
  vx3 = 5;
  vy = 2;
  vw = 5;
  vx4 = 2;
  speed = 0.1; 
  cy = 0;
  vcy = 3;

  colorMode(RGB, 255, 255, 255);
  background(100);
  //camera
  stroke(0);
  strokeWeight(10);
  line(55, 350, 30, 430);
  line(65, 350, 65, 430);
  line(75, 350, 100, 430);

  noStroke();
  fill(0);
  rect(20, 280, 90, 50);
  rect(40, 330, 50, 20);
  triangle(120, 305, 160, 260, 160, 340);
  rect(110, 290, 20, 30);

  colorMode(HSB, 100);
  background(99);
  frameRate(15);
  startTime=0;  
  img = loadImage("1.png");
  img.resize(100, 100);
  img2 = loadImage("2.png");
  img2.resize(100, 100);
  img3 = loadImage("3.png");
  img3.resize(100, 100);
}
void draw() {
  frameRate(15);
  startTime += 1;
  fade();
  Angle = Angle + 20;
  X = Cx +( R * -cos(radians(Angle+60)) );
  Y = Cy +( R * -sin(radians(Angle+60)) );

  if (c >= 99) {
    c = 0;
  }
  c = c + 3;
  fill(c, 99, 99);
  ellipseMode(CENTER);
  ellipse(X+150, Y+150, 50, 50);

  if (startTime>=0&&millis()-startTime>0*1000) {
    image(img3, 200, 200);
  }   
  if (startTime>=0&&millis()-startTime>1.5*1000) {
    image(img2, 200, 200);
  }
  if (startTime>=0&&millis()-startTime>2.6*1000) {
    image(img, 200, 200);
  }

  if (startTime>=0&&millis()-startTime>3.8*1000) {
    colorMode(RGB, 255, 255, 255);
    frameRate(10);
    background(100);
    //camera
    stroke(0);
    strokeWeight(10);
    line(55, 350, 30, 430);
    line(65, 350, 65, 430);
    line(75, 350, 100, 430);
    noStroke();
    fill(255, 254, 211, 200);
    triangle(138, 305, 300, 455, 300, 45);
    rect(300, 45, 200, 440);

    fill(247, 197, 215);  
    rect(260, 150, 150, 25);
    rect(240, 180, 230, 25);
    fill(179, 235, 242);
    rect(260, 230, 150, 25);
    rect(240, 260, 230, 25);
    fill(210, 240, 123);
    rect(260, 310, 150, 25);
    rect(240, 340, 250, 25);
    textSize(25);
    fill(0);
    text("A choice", 275, 170);
    text("Push [A]key...past", 250, 200);
    text("B choice", 275, 250);
    text("Push [B]key...now", 250, 280);
    text("C choice", 275, 330);
    text("Push [C]key...future", 250, 360);

    noStroke();
    fill(0);
    rect(20, 280, 90, 50);
    rect(40, 330, 50, 20);
    triangle(120, 305, 160, 260, 160, 340);
    rect(110, 290, 20, 30);

    stroke(0);
    fill(color(255, 100, hue));
    ellipse(40, 255, 40, 40);
    ellipse(85, 255, 40, 40);
    if (255<hue) {
      hue=0;
    } else {
      hue=hue+1;
    }
    colorMode(HSB, 100);
    noStroke();
    fill(color(hue, 100, 100));
    rect(0, 0, width, 30);
    rect(0, 455, width, 30);
    if (100<hue) {
      hue=0;
    } else {
      hue=hue+1;
    }
    //film
    noStroke();
    fill(0);
    rect(0, 0, width, 15);
    rect(0, 30, width, 15);
    rect(0, 0, 15, 30);
    rect(30, 0, 15, 30);
    rect(60, 0, 15, 30);
    rect(90, 0, 15, 30);
    rect(120, 0, 15, 30);
    rect(150, 0, 15, 30);
    rect(180, 0, 15, 30);

    rect(0, 455, width, 15);
    rect(0, 485, width, 15);
    rect(0, 455, 15, 30);
    rect(30, 455, 15, 30);
    rect(60, 455, 15, 30);
    rect(90, 455, 15, 30);
    rect(120, 455, 15, 30);
    rect(150, 455, 15, 30);
    rect(180, 455, 15, 30); 

    stroke(0);
    fill(color(255, 100, hue));
    ellipse(40, 255, 40, 40);
    ellipse(85, 255, 40, 40);
    if (255<hue) {
      hue=0;
    } else {
      hue=hue+1;
    }
    colorMode(HSB, 100);
    noStroke();
    fill(color(hue, 100, 100));
    rect(0, 0, width, 30);
    rect(0, 455, width, 30);
    if (100<hue) {
      hue=0;
    } else {
      hue=hue+1;
    }
    hue += speed;
    //film
    noStroke();
    fill(0);
    rect(0, 0, width, 15);
    rect(0, 30, width, 15);
    rect(0, 0, 15, 30);
    rect(30, 0, 15, 30);
    rect(60, 0, 15, 30);
    rect(90, 0, 15, 30);
    rect(120, 0, 15, 30);
    rect(150, 0, 15, 30);
    rect(180, 0, 15, 30);
    rect(210, 0, 15, 30);
    rect(240, 0, 15, 30);
    rect(270, 0, 15, 30);
    rect(300, 0, 15, 30);
    rect(330, 0, 15, 30);
    rect(360, 0, 15, 30);
    rect(390, 0, 15, 30);  
    rect(420, 0, 15, 30); 
    rect(450, 0, 15, 30);
    rect(480, 0, 15, 30);

    rect(0, 455, width, 15);
    rect(0, 485, width, 15);
    rect(0, 455, 15, 30);
    rect(30, 455, 15, 30);
    rect(60, 455, 15, 30);
    rect(90, 455, 15, 30);
    rect(120, 455, 15, 30);
    rect(150, 455, 15, 30);
    rect(180, 455, 15, 30);
    rect(210, 455, 15, 30);
    rect(240, 455, 15, 30);
    rect(270, 455, 15, 30);
    rect(300, 455, 15, 30);
    rect(330, 455, 15, 30);
    rect(360, 455, 15, 30);
    rect(390, 455, 15, 30);
    rect(420, 455, 15, 30);
    rect(450, 455, 15, 30);
    rect(480, 455, 15, 30);


    if (keyPressed) {
      if (key=='A'||key=='a') {
        frameRate(15);
        colorMode(RGB, 256);
        noStroke();
        fill(250, 218, 207);
        rect(0, 320, 500, 200);
        fill(248, 250, 207);
        rect(0, 0, 500, 320);
        //tana
        fill(211, 197, 169);//kage
        rect(0, 200, 240, 140);
        fill(255, 223, 157);//usuibrown
        rect(0, 200, 240, 20);
        rect(220, 220, 20, 120);
        rect(120, 220, 20, 120);
        rect(20, 220, 20, 120);
        rect(0, 340, 240, 20);
        rect(0, 270, 240, 20);
        //honn
        fill(250, 82, 15);//red
        rect(200, 220, 20, 49);
        fill(41, 221, 255);//blue
        rect(180, 220, 20, 49);
        //borl
        fill(41, 255, 89);
        ellipse(90, 247, 45, 45);

        //tsumiki
        fill(250, 82, 15);
        rect(50, 420, 50, 30);
        fill(255, 248, 31);
        rect(70, 390, 40, 30);
        fill(83, 180, 82);
        triangle(75, 360, 55, 390, 90, 390);

        //window
        stroke(160, 158, 156);
        strokeWeight(7);         
        fill(138, 244, 252);
        rect(50, 50, 170, 120);
        stroke(160, 158, 156);
        strokeWeight(7); 
        line(130, 50, 130, 170);
        noStroke();
        fill(247, 181, 72);
        triangle(50, 50, 90, 50, 50, 170);
        triangle(220, 50, 180, 50, 220, 170);
        triangle(50, 140, 80, 190, 40, 190);
        triangle(220, 140, 190, 190, 230, 190);
        rect(40, 140, 20, 10);
        rect(210, 140, 20, 10);

        fill(255, 193, 237);
        ellipse(370, 30, 10, 30);
        ellipse(390, 30, 10, 30);
        ellipse(380, 60, 50, 40);
        fill(0);
        ellipse(370, 55, 5, 5);
        ellipse(390, 55, 5, 5);

        //bag
        stroke(216, 9, 26);
        strokeWeight(7);
        line(310, 150, 280, 220);
        line(310, 150, 330, 220);
        noStroke();
        fill(216, 9, 26);
        rect(270, 220, 80, 50, 15);
        stroke(255);
        strokeWeight(4);
        line(270, 240, 340, 240);

        stroke(36, 128, 224);
        strokeWeight(7);
        line(440, 150, 410, 220);
        line(440, 150, 470, 220);
        noStroke();
        fill(36, 128, 224);
        rect(400, 220, 80, 50, 15);
        stroke(255);
        strokeWeight(4);
        line(400, 240, 480, 240);

        //boushi
        noStroke();
        fill(250, 227, 13);
        ellipse(440, 150, 80, 80);
        ellipse(310, 150, 80, 80);
        stroke(250, 159, 13);
        strokeWeight(3);
        noFill();
        ellipse(440, 150, 60, 60);
        ellipse(310, 150, 60, 60);
        line(440, 120, 440, 180);
        line(410, 150, 470, 150);
        line(420, 130, 460, 170);
        line(420, 170, 460, 130);
        line(310, 120, 310, 180);
        line(280, 150, 340, 150);
        line(290, 130, 330, 170);
        line(290, 170, 330, 130);

        //child
        noStroke();
        fill(255, 229, 191);//hada
        ellipse(350, 235, 83, 77);
        rect(340, 260, 40, 30); 

        fill(227, 110, 186);//isu
        ellipse(370, 390, 80, 40);
        rect(330, 385, 80, 105, 25);

        fill(25, 218, 250);//uniform
        rect(315, 280, 65, 90, 40, 10, 10, 10);
        quad(315, 330, 280, 400, 380, 400, 360, 330);

        stroke(255, 229, 191);//hoot
        strokeWeight(25);
        line(340, 390, 300, 410);
        line(300, 420, 260+x, 450);//hidari
        line(300, 420, 340-x, 450);//migi
        noStroke();
        fill(25, 218, 250);//sukart
        quad(315, 330, 280, 400, 380, 400, 360, 330);
        fill(100, 97, 97);//shoose
        rect(230+x, 450, 45, 25, 25);//hidari
        rect(320-x, 450, 45, 25, 25);//migi
        noStroke();
        fill(255);//table
        quad(200, 330, 280, 330, 310, 390, 170, 390);
        stroke(166, 171, 173);
        strokeWeight(20);
        line(180, 400, 180, 480);
        line(300, 400, 300, 480);
        noStroke();
        fill(214, 216, 216);
        rect(170, 390, 140, 20);
        stroke(100);
        strokeWeight(3);
        noFill();
        quad(210, 350, 270, 350, 280, 380, 200, 380); 
        stroke(227, 110, 186);//iro
        strokeWeight(7);
        line(230, 370, 240, 365);
        line(230, 360, 240, 365);
        stroke(227, 110, 186);//pen
        strokeWeight(15);
        line(330-x, 360, 315-x, 355);
        noStroke();
        fill(255, 229, 191);//hand
        ellipse(345-x, 360, 30, 30);
        fill(255);
        triangle(325, 280, 380, 280, 350, 300);
        stroke(25, 218, 250);//arm migi
        strokeWeight(20);
        line(365, 300, 370-x, 340);
        line(355-x, 350, 370-x, 340);
        noStroke();
        fill(134, 85, 11);//hair
        ellipse(354, 210, 60, 30);
        ellipse(350, 210, 70, 45);
        ellipse(370, 225, 48, 61);
        quad(355, 220, 365, 220, 405, 220, 390, 220);
        fill(245, 234, 12);//bousi
        rotate(PI/6);
        ellipse(420, 5, 100, 30);
        ellipse(420, 0, 70, 50);

        x += vx;
        if (x>70 ||x<=0) {
          vx =-vx;
        }
      }  
      if (key=='B'||key=='b') {
        frameRate(12);
        colorMode(RGB, 256);
        background(255);
        stroke(255);
        background(255);
        stroke(255);
        strokeWeight(5);
        fill(250, 217, 146);
        rect(0, 320, 500, 200);
        rect(0, 360, 500, 200);
        rect(0, 400, 500, 200);
        fill(206, 201, 196);
        rect(0, 440, 500, 200);

        noStroke();
        //kokubann
        fill(104, 108, 104);
        rect(45, 50, 350, 200);
        fill(22, 152, 11);
        rect(55, 60, 330, 180);
        //clock
        x5 = cos(radians(angle2));
        y5 = sin(radians(angle2));      
        fill(25, 183, 209);
        ellipse(450, 40, 70, 70);
        fill(255);
        ellipse(450, 40, 60, 60);
        stroke(0);
        strokeWeight(5);
        line(450, 40, 455, 20);
        line(450, 40, 450+x5*30, 40+y5*30);
        angle2=angle2+1;

        noStroke();
        fill(190, 195, 196);
        rect(180, 5, 60, 40);
        fill(104, 108, 104);
        ellipse(210, 25, 35, 30);

        noStroke();
        fill(255);
        ellipse(175, 265, 50, 40);
        ellipse(225, 265, 50, 40);
        stroke(255);
        strokeWeight(10);
        line(200, 265, 250, 265);
        stroke(240, 84, 12);
        strokeWeight(15);
        line(150, 265, 200, 265);
        line(200, 265, 250, 265);
        stroke(216, 69, 46);
        strokeWeight(15);
        line(200, 265, 200, 280);

        //table
        noStroke();
        fill(170, 109, 48);
        rect(130, 270, 190, 190);
        rect(120, 270, 210, 30);
        fill(149, 103, 9);
        rect(130, 300, 190, 20);      

        fill(255, 209, 245);//cho-ku
        rect(65, 235, 35, 8);
        fill(254, 255, 209);
        rect(110, 235, 35, 8);

        //arth
        stroke(175, 130, 39);//chair
        strokeWeight(10);
        line(420, 275, 420, 330);
        line(480, 275, 480, 330);
        noStroke();
        fill(240, 187, 82);
        ellipse(450, 277, 100, 35);
        stroke(22, 135, 219);
        strokeWeight(5);
        noFill();
        arc(450, 200, 95, 95, -radians(45), radians(135), false);
        line(450, 250, 450, 270);
        noStroke();
        fill(22, 135, 219);
        ellipse(450, 270, 80, 15);

        fill(25, 183, 209);///chikyuu
        ellipse(450, 200, 80, 80);
        fill(206, 252, 107);
        quad(425, 180, 430, 175, 460, 190, 435, 230); 
        rect(450, 225, 10, 10); 
        stroke(206, 252, 107);
        strokeWeight(15);
        line(460, 165, 475, 180);
        line(475, 195, 480, 210);

        colorMode(RGB, 256);
        //girl
        noStroke();
        fill(255, 229, 191);//hada
        ellipse(550+x2, 195, 83, 77);
        rect(540+x2, 220, 40, 30);
        fill(255, 229, 191);//hand
        ellipse(480+x+x2, 355, 30, 30);
        stroke(62, 75, 137);//arm hidari
        strokeWeight(20);
        line(480+x+x2, 340, 535+x2, 253);  

        noStroke();
        fill(62, 75, 137);//uniform
        rect(515+x2, 240, 65, 90, 40, 10, 10, 10);
        fill(255);
        triangle(515+x2, 270, 560+x2, 240, 580+x2, 260);
        fill(245, 62, 89);//ribon
        triangle(515+x2, 270, 490+x2, 285, 510+x2, 295);
        triangle(515+x2, 270, 525+x2, 295, 540+x2, 285);

        stroke(255, 229, 191);//hoot
        strokeWeight(25);
        line(540+x2, 370, 500+x+x2, 470);//hidari
        line(540+x2, 370, 580-x+x2, 470);//migi
        noStroke();
        fill(62, 75, 137);//sukarto
        quad(520+x2, 330, 500+x2, 395, 595+x2, 395, 575+x2, 330);
        quad(535+x2, 320, 520+x2, 405, 580+x2, 405, 560+x2, 320);
        fill(100, 97, 97);//shoose
        rect(470+x+x2, 470, 45, 25, 25);//hidari
        rect(560-x+x2, 470, 45, 25, 25);//migi
        fill(255, 229, 191);//hand
        ellipse(598-x+x2, 360, 30, 30);
        stroke(62, 75, 137);//arm migi
        strokeWeight(20);
        line(565+x2, 260, 598-x+x2, 345);  

        noStroke();
        fill(134, 85, 11);//hair
        ellipse(554+x2, 170, 60, 30);
        ellipse(550+x2, 170, 70, 45);
        ellipse(570+x2, 185, 48, 61);
        ellipse(575+x2, 240, 30, 60);

        x += vx;
        if (x>100||x<=0) {
          vx = -vx;
        }
        x2 -=vx2;
      }
      if (key=='C'||key=='c') {
        frameRate(15);
        colorMode(RGB, 256);
        background(242, 242, 237);
        noStroke();
        fill(250, 217, 146);
        rect(0, 320, 500, 200);
        //kokubann
        fill(147, 101, 1);
        rect(30, 30, 270, 150);
        fill(255);
        rect(40, 40, 250, 130);
        stroke(252, 143, 212);//gurahu
        strokeWeight(15);
        line(250, 60-cy, 250, 150);
        line(230, 70+cy, 230, 150);
        line(210, 90-cy, 210, 150);
        line(190, 60+cy, 190, 150);

        cy += vcy;
        if (cy>10 ||cy<=-4) {
          vcy =-vcy;
        }        
        noStroke();
        fill(255, 158, 113);//enngurahu
        ellipse(110, 100, 90, 90);
        fill(134, 255, 197);
        arc(110, 100, 90, 90, radians(30), radians(270));

        //PC
        fill(116, 116, 115);
        rect(320, 110, 100, 80);
        fill(255);
        rect(330, 120, 80, 60);
        //siryou
        fill(11, 182, 214);
        rect(460, 150, 20, 75);
        fill(229, 171, 232);
        rect(435, 150, 20, 75);
        fill(255);
        rect(465, 155, 10, 35);
        rect(440, 155, 10, 35);

        fill(232, 218, 192);
        rect(265, 185, 40, 50, 15);
        stroke(232, 218, 192);
        strokeWeight(7);
        noFill();
        arc(265, 205, 30, 30, radians(90), radians(270));

        //desk
        noStroke();
        fill(214, 210, 209);
        rect(260, 230, 220, 35);
        rect(260, 265, 100, 50);
        rect(260, 315, 100, 50);
        rect(260, 365, 100, 50);
        stroke(175, 174, 173);
        strokeWeight(5);
        line(260, 265, 480, 265);
        line(260, 315, 360, 315);
        line(260, 365, 360, 365);
        strokeWeight(8);
        line(475, 268, 475, 420);        
        strokeWeight(10);
        line(290, 285, 310, 285);
        line(290, 335, 310, 335);
        line(290, 385, 310, 385);

        //isu
        noStroke();
        fill(162, 209, 101);
        rect(380, 200, 80, 100, 15);
        triangle(380, 294, 460, 294, 420, 330);
        rect(375, 330, 90, 30, 15);
        fill(118, 118, 117);
        rect(385, 240, 68, 60, 15);
        triangle(385, 294, 455, 294, 420, 325);
        rect(380, 360, 80, 10, 15);
        rect(410, 310, 20, 50);
        rect(415, 360, 10, 40);
        ellipse(390, 420, 13, 13);
        ellipse(450, 420, 13, 13);
        stroke(118, 118, 117);
        strokeWeight(7);
        line(420, 400, 390, 415);
        line(420, 400, 450, 415);

        stroke(144, 104, 18);
        strokeWeight(10);
        line(50, 270, 50, 320);
        stroke(113, 180, 27);
        strokeWeight(10);
        line(50, 260, 60, 220);
        line(50, 260, 10, 210);
        line(50, 260, 40, 200);
        line(50, 260, 50, 290);
        line(50, 270, 40, 250);
        line(30, 260, 50, 290);
        line(30, 260, 10, 280);
        line(50, 270, 80, 240);

        noStroke();//red
        fill(201, 16, 16);
        rect(20, 320, 60, 50);
        fill(173, 14, 70);
        rect(20, 330, 60, 10);


        //robot
        fill(144, 195, 203);
        rect(100, 351+x4, 35, 50);//hoot
        rect(150, 351-x4, 35, 50);
        rect(200, 250+x4, 20, 70, 15);//arm
        rect(65, 250-x4, 20, 70, 15);
        fill(225, 157, 255);
        rect(90, 397+x4, 50, 30, 15);
        rect(145, 397-x4, 50, 30, 15);

        fill(162, 246, 255);//body
        rect(85, 241, 115, 130, 25);
        fill(0);
        rect(100, 260, 86, 80, 25);

        fill(248, 255, 160);//yellow
        ellipse(100, 205, 35, 45);
        ellipse(180, 205, 35, 45);
        fill(162, 246, 255);//blue
        rect(100, 170, 80, 70, 25);
        fill(225, 157, 255);//purple
        rect(120, 170, 40, 30);
        fill(255);//eye
        ellipse(120, 200, 26, 26);
        ellipse(160, 200, 26, 26);
        fill(144, 195, 203);//kage
        rect(125, 225, 30, 15);
        fill(0);//eye
        ellipse(120, 200, 20, 20);
        ellipse(160, 200, 20, 20);
        rect(125, 225, 30, 7);//kuchi

        x4 += vx4;
        if (x4>10 ||x4<=-10) {
          vx4 =-vx4;
        }

        //adult
        noStroke();
        fill(255, 229, 191);//hada
        ellipse(350, 195, 83, 77);
        rect(340, 220, 40, 30); 
        noStroke();
        fill(255);//uniform
        rect(315, 240, 65, 90, 40, 10, 10, 10);
        fill(224, 193, 129);
        rect(315, 290, 65, 50, 0, 0, 10, 10);
        quad(315, 290, 380, 290, 380, 240, 360, 235);

        stroke(255, 229, 191);//hoot
        strokeWeight(25);
        line(340, 370, 340, 470);//hoot migi
        noStroke();
        fill(224, 193, 129);//sukarto
        quad(320, 330, 315, 395, 380, 395, 375, 330);
        fill(100, 97, 97);//shoose
        rect(310, 470, 45, 25, 25);//migi
        stroke(255);
        strokeWeight(4);
        noFill();
        triangle(330, 265, 360, 240, 380, 255);
        triangle(315, 290, 330, 264, 345, 275);
        noStroke();
        fill(255, 229, 191);//hand
        ellipse(345-x3, 320-y, 30, 30);
        stroke(224, 193, 129);//arm migi
        strokeWeight(20);
        line(365, 260, 360-x3, 320-y);
        noStroke();
        fill(134, 85, 11);//hair
        ellipse(354, 170, 60, 30);
        ellipse(350, 170, 70, 45);
        ellipse(370, 185, 48, 61);
        quad(355, 180, 365, 280, 405, 280, 390, 180);

        x3 += vx3;
        y += vy;
        if (x3>80 ||x3<=0) {
          vx3 =-vx3;
          vy = -vy;
        }       
        if (x3>=80&&x3>70) {
          myfont = createFont("Meiryo UI Bold Italic", 30);
          textFont(myfont);
          fill(232, 87, 121);
          textSize(30);
          text("Hello", 103, 305);
        }
      }
    }
  }
}
void fade() {
  noStroke();
  fill(99, 5);
  ellipseMode(CORNER);
  ellipse(150, 100, 270, 270);
  ellipse(150, 170, 270, 270);
  ellipse(140, 170, 200, 200);
  ellipse(140, 100, 250, 250);
} 

//URL
//lecture.nakayasu.com/?p=1059(rainbow circle/count)
//ap.kakoku.net/6-4.html(rotate circle/movie)
//www2.kobe-u.ac.jp/~tnishida/course/2014/programming/techniques.html(walking)
//detail.chiebukuro.yahoo.co.jp/qa/question_detail/q14170337564?ccode=ofv&pos=3(time)