For our purposes, a "board" is a 2-dimensional list of color names (strings like "red").  Our goal here is to allocate the board in the init function (init), and then to draw the board in our draw functions (which will be called by redrawAll).
 

To help us test our code, we will add a few lines in the init function (init) to pre-load a few cells in the board with some colors.  This code will be removed after this step.  In particular, we will paint the top-left cell red, the top-right cell white, the bottom-left cell green, and bottom-right cell gray.
 

Here is how our code should paint the board at this point:


 

Writing the playTetris() function:
We'll have the playTetris() function take no parameters. First, it will set the rows and columns ("cols") to 15 and 10, respectively, and use these values to determine the window size so the board just fits with the appropriate margins. Once the window size is computed, playTetris() will call run() providing the appropriate window size. Unfortunately, in the current framework, we cannot also provide the rows and cols as extra parameters. Thus, we have to separately set data.rows and data.cols in our init function, as noted below.

Writing the init function:
With that, there are several tasks we need to do in the init function.

First, we need to set data.rows, data.cols, and data.margin to the same values that we used in our playTetris() function, as noted above.

Next, we need to allocate our board as a 2-dimensional list of names of colors, and fill it with our emptyColor ("blue"), as all cells are empty to start the game. We also need to store this board, and the emptyColor, in the data object (data.board, data.emptyColor).

Finally, we add the temporary code to pre-load the 4 corner cells with colors for testing purposes:
   # pre-load a few cells with known colors for testing purposes
   data.board[0][0] = "red" # top-left is red
   data.board[0][data.cols-1] = "white" # top-right is white
   data.board[data.rows-1][0] = "green" # bottom-left is green
   data.board[data.rows-1][data.cols-1] = "gray" # bottom-right is gray

Writing the draw functions:
Our main draw function, drawGame, will be called by our top-level draw function, redrawAll. It will draw the background of the entire game (orange in the picture above), then it will use top-down design and call a new function, drawBoard, to draw the board.

To draw the board in the drawBoard function, we simply iterate over every cell (with two variables running over every row and column), and repeatedely call the drawCell function, which takes 4 parameters: the canvas, the row of the cell, the col of the cell, and the color of the cell (which for now is just the value in board[row][col]).

Finally, the drawCell function must draw the given cell using the color stored in the board list corresponding to that cell (that is, in board[row][col]).  To draw a cell a given color, we will create two rectangles:  an outer rectangle in the grid color (black) followed by an inner rectangle in the cell's color (other reasonable approaches exist, but we'll go with this one).

Code at this point:
In future steps, we will not provide sample solutions. But to be sure we are all on the same page, here is a sample solution to this step: tetris-after-step-2.py