let tshirts=[];

let jeans=[];

let start=false;

let astart=false;

​

function preload(){

  tshirts[0]=loadImage('tshirt1.png');

  jeans[0]=loadImage('jeans1.png');

  tshirts[1]=loadImage('tshirt2.png');

  jeans[1]=loadImage('jeans2.png');

  tshirts[2]=loadImage('tshirt3.png');

  jeans[2]=loadImage('jeans3.png');

​

  jeans[3]=loadImage('jeans4.png');

}

function setup() {

  createCanvas(800, 600);

  background(255,255,255);

  for(var i=0;i<3;i++){

    image(tshirts[i],200+i*20,100,100,100);

  }

  for(var j=0;j<4;j++){

    image(jeans[j],400+j*50,100,100,100);

  }

  noStroke();

  fill('GRAY');

  rect(0,300,width,5);

  frameRate(1);

}

​

function draw() {

    if(start){

​

        if( start && tc<=11){

         // image(tshirts[tc],120+tc*250,350,50,50);

        frameRate(30);

        fill(255,255,255);

        rect(0,302,width,100);

        image(tshirts[0],120+250-(tc/11)*250,350,50,50);

        image(tshirts[1],120+250,350,50,50);

        image(tshirts[2],120+250+(tc/11)*250,350,50,50);

          tc+=1;

       }

       if(astart){

           if (tc>11 && tc<24){

              frameRate(5);

              image(tshirts[floor((tc-12)/4)%3],(tc-9)*40+floor((tc-12)/4)*90-50,500,30,30);

              image(jeans[(tc-12)%4],(tc-9)*40+floor((tc-12)/4)*90-53,528,35,35);

              tc+=1;

           }

       }  

  }

​

}

​

function mouseClicked(){

    if(start){

       astart=true;

    }

    start=true;

}

​