//set size of window and color of background
void setup(){
  size(420,420);
  background(152);
}
// set 7 sects' color and size
void draw(){
  noStroke();
  fill(255,50,50);//rect1 red
  rect(0,0,60,420);
  fill(255,120,20);//rect2 orange
  rect(60,0,60,420);
  fill(50,255,50);//rect3 green
  rect(120,0,60,420);
  fill(30,220,230);//rect4 light bule
  rect(180,0,60,420);
  fill(60,70,250);//rect5 bule
  rect(240,0,60,420);
  fill(220,240,70);//rect6 yellow
  rect(300,0,60,420);
  fill(245,60,240);//rect7 purple
  rect(360,0,60,420);
  strokeWeight(1);
  stroke(255);
  
  //    judge the color when circle move to different rect
  //1 red
  if(mouseX<60){
      fill(255,50,50);
      ellipse(mouseX,mouseY,50,50);   
  }
 //2 orange
  if(mouseX>60){
      fill(255,120,20);
      ellipse(mouseX,mouseY,50,50);   
  }
 //3 green
   if(mouseX>120){
      fill(50,255,50);
      ellipse(mouseX,mouseY,50,50);   
  }
  
  //4 light bule
  if(mouseX>180){
      fill(30,220,230);
      ellipse(mouseX,mouseY,50,50);
  }
  //5 bule
  if(mouseX>240){
      fill(60,70,250);
      ellipse(mouseX,mouseY,50,50);
  }
  //6 yellow
  if(mouseX>300){
      fill(220,240,70);
      ellipse(mouseX,mouseY,50,50);
  }
  //7 purple
  if(mouseX>360){
      fill(245,60,240);
      ellipse(mouseX,mouseY,50,50);
  }
  
  
  
}