I comes back with full of energy and love after watching my favorite band’s live. SO I WANT TO DO SOMETHING NEW with the past knowledges again.

For the assignment, I want to copy one EP of the strokes and make it moves. To be specific, to make 5 different rectangles moves separately, but use a for loop to control them at all.

The hardest point is to distribute colors to the 5 rects, since the RGB number values have no relationship actually.

My solution is to use ARRAY, so I put 5 colors into one array called colors:

let colors= [
[211,24,17],
[228,71,20],
[227,174,20],
[25,212,35],
[18,32,105],
];

then use them in the for loop:

for(i=0;i<5;i++){
fill(colors[i]);

The second hardest point is to make two functions connect. I need to detect if the rectangle should return when touch to the edge.

So I just put turnRECTANGEL function (actually it’s in order to detect the direction condition) in the drawRECTANGEL function, and the whole thing work!

function draw5RECTANGERS(){
for(i=0;i<5;i++){
fill(colors[i]);
rect(120+i*40,125,25,y[i],30);
y[i]+=speed[i];
turnRECTANGER();//detect if rectanger need to return
}
}

function turnRECTANGER(){
if(y[i]<20||y[i]>160){
speed[i]*=-1;
}
}

play plz fab!