Assignment Instructions 1. Define a constant NUM_SQUARES with value as 8 2. Define the following global variables a) redRow – to remember the row that has red in it (??? datatype) b) redCol – to...

Assignment Instructions attached below, as well as video for the visual outcome.All code must be done in processing software, you can download the free software at processing.org
The desired outcome will look like the video attached
Thank you.


Assignment Instructions 1. Define a constant NUM_SQUARES with value as 8 2. Define the following global variables a) redRow – to remember the row that has red in it (??? datatype)  b) redCol – to remember the col that has red in it (??? datatype) c) sqSide – to remember the size of the square cell in canvas d) timeWhenRedMoved – to remember the time when red square was moved e) score – to keep track of score 3. Define a matrix colorMatrix of size NUM_SQUARES * NUM_SQUARES - to store color info  Inside moveRed(): does not return any info or takes parameters 1. Assign a random integer value between 0 and matrix size to redRow 2. Assign a random integer value between 0 and matrix size to redCol 3. Make the cell that is denoted by redRow and redCol to be red in color - only display red color in that cell – do not change the content of that element in the colorMatrix. 4. Register the time of moving red in timeWhenRedMoved by calling millis() Inside setup(): 1.    Populate/fill colorMatrix with a  non-red random color  inside each element. 2.    Do visual representation of the colorMatrix   : i. Initialise  the value of  sqSide .    ii. Divide the canvas into 8 rows and 8 columns. iii. Fill up each cell in the canvas with the corresponding element’s color value from colorMatrix. 3.  Call moveRed() (For steps 1, 2: refer to the solution of activity colorMatrix) Inside mousePressed() : Apply the concept in colorMatrix 1. Change the color of the cell that has the current red square back to its color. 1. color info for each cell in the canvas is stored in colorMatrix & Current position of the red square is stored in the variables redRow as well redCol. 2. Figure out the cell on which user pressed the mouse by computing clickedRow and clickedCol 3. If user clicked on the cell that currently shows red (info is in redRow  & redCol) c. Increase score c. Call moveRed() 1. If the score  is 10  d. Display the time the player took to achieve a score of 10 (similar to the video). d. Stop the game.  Inside draw(): a. Display the current score & the time taken so far (similar to the video).  b. Register the current time by calling millis(); c. Compute elapsed time. d. If elapsed time is more than 3 seconds, a. Change the color of the cell that has the current red square back to its color. Remember - color info for each cell in the canvas is stored in colorMatrix ; & Current position of the red square is stored in the variables redRow as well redCol. Without this step, the visual effect would be the grid getting filled with many red squares. b. Call moveRed() Lavf58.12.100