Code in code::blocks

Develop Tetris Game in C programming Without Graphics Library and Full Source Code

2025-03-30T21:26:00.006+11:00

Tetrix game is created in C programming without using graphic library. We draw shapes only using # character and game is played on command window. User can play game using up, left, right, and down arrow key. The up key rotate Tetrimino (Shapes) in clockwise direction, left key move Tetrimino (Shapes) in left direction toward negative x-axis, right key move Tetrimino (Shapes) in right direction toward positive x-axis, and down key rotate Tetrimino (Shapes) in anticlockwise direction. By default, Tetrimino (Shapes) will move 1 unit downward toward negative y-axis in each frame of the game. The score is calculated based on the number of rows filled with boxes.

The main objective of this project is to provide knowledge and technique about creating Tetris game in C programming, provide basic knowledge of linear algebra to rotate and translate shapes. User can use any graphics library to draw window, and shapes to make it similar to commercial games. However, the algorithm of the game is same in all Tetris game available in market.

In this article, I will explain the following items:

Coordinate system of the game
Usage of linear algebra to rotate and translate shapes.
Data Structure used in the game
Collision detection and score checking Techniques

Also, Download the final version of the game Download Project from GitHub.

I have explained the game in following two articles:

Part 1: Tetriminos (Shapes), Coordinate System, Rotation and Translate

Part 2: Data Structure, Collision detection and Score checking Techniques

Part 2: Tetris Game in C programming | Data Structure, Collision detection and Score checking Techniques

2025-03-30T21:23:00.007+11:00

Data Structure

This is a 2D game where the primary object is a box. A combination of 4 boxes forms a Tetrimino (shape). Boxes are arranged on the Tetris board from the bottom upward.

Board Specifications

The Tetris board has a size of 11 columns (x-axis) by 21 rows (y-axis).
Tetriminos are arranged on the board such that if an entire row is filled with boxes, the player earns points.

Box Representation

Each box is defined by 2D (x, y) coordinates, which determine where it is drawn.
To represent boxes and Tetriminos (shapes), the game uses three structure variables:

Point2D
Tetriminos
TetrisBox


//Structure definition of x,y coordinate
struct Point2D {
    int x;
    int y;
};

//Structure definition to define each game board boxes
struct Tetriminos {
    struct Point2D body[4];
};

//Structure definition of individual Tetris Box
//Added on the Tetris board.
struct TetrisBox {
    struct Point2D box;
    int flag_T;
};

//Store four corner of the Tetris board
struct Point2D window[4];
//Store 7 shapes (Tetrimino)
struct Tetriminos tetrimino[7];

//Current Tetris shapes
struct Tetriminos current_T;

//Next Tetris shapes
struct Tetriminos next_T;

//Declare all box 11 * 21 = 231 within Tetris board
//double array matrix is created to represent board vertical boxes
//and horizontal boxes. The flag is to identify occupied box.
struct TetrisBox tetrisBoard[board_index_i_y][board_index_j_x];

The Point2D has two integer variables x, and y to represent x, and y coordinates. Tetriminos structure has only one body array of size 4 Struct Point2D variable to represent Tetrimino (Shapes).

The structure definition TetrisBox represent only one box added on the board. The struct Point2D box variable store the coordinates and int flag_T variable represent it is filled by Tetrimino. The flag_T = 0 means box is not filled, flag_T = 1 means box is filled by Tetrimion. If any Terimino is added on the board then it will fill the box. So, after collision we will compare the coordinates of Tetrimino and boxes of the board, if both equal then we will set flag_T to 1. This technique is also used to check collision with boxes.

There are other variables such as struct Point2D currTranslateVec to represent translate vector, struct Point2D unitVec[4] to represent 4 units vectors toward positive and negative x and y axis, and struct Point2D currRotationVec[2] represent rotation vector clockwise and anticlockwise.


//Current Translate vector
struct Point2D currTranslateVec = {0,11};

//Unit vector toward  x-axis and y-axis both positive and negative
//0= + y-axis, 1 = - y-axis, 2 = + x-axis, and 3 = - x-axis
struct Point2D unitVec[4] = {{0,1},{0,-1},{1,0},{-1,0}};

//Clockwise rotation vector, 0 = clockwise, 1 = anti-clock wise
struct Point2D currRotationVec[2] = {{1,-1},{-1,1}};

//Index to indicate direction of unit vector
int unitVecDir = 1;

//Variable to calculate score
int score=0;

Collision detection

I have implemented collision detection based on following rules.

Tetrimino reach bottom of the board -> Add it in Tetris board.
Tetrimino collided with box while moving toward negative y-axis (downward) -> Add it in Tetris board.
Tetrimino collided with box while moving toward negative or positive x-axis -> Do not add it in board but stop moving further toward x-axis.
Tetrimino moving outside the board (out of window) -> Stop moving further toward x-axis.
Tetrimino collided with box but one or all boxes are outside of the window (positive y-axis) -> Game over

Scoring Techniques

Player will score if player able to arrange boxes in a row completely. We will scan the value of flag_T of the boxes along row to check scoring. We have defined Tetris board by two-dimension array struct TetrisBox tetrisBoard[board_index_i_y][board_index_j_x]. First index is number of rows toward y-axis and second index is number of columns. So, for each row we will multiply the value of flag_T, if value equal to 1 then it means that row is filled by boxes and player will win 10 points. As you know, if box is not filled the value of flag_T is 0. Any of the box in a row is empty then total product of flag_T will be 0.

When player win the points after filing all boxes in a row, we have to delete that row. To achieve this, I have implemented following logic.

Add boxes from higher index i.e bottom of the board which is represented by board_index_i_y variable. Its value is up to 20 to represent all 21 rows of the board. The value 0 represents top row and 20 represent bottom row.
Check the product of the value of flag_T from bottom row. If value is 1 increase the score and unset the value of flag_T to 0. Shift the value of flag_T from top rows to one step down starting from that index. Again, start checking product from same index, and repeat this step until you reach top row.

This is the end of the article. I hope you understood the coordinate system, data structure, collision detection techniques and scoring techniques used in this game. Please don't forget to download source code from the link provided in main page of this project, also do not forget to watch video. In video I have explain the source code in detail.

Part 1: Tetris Game in C programming | Tetriminos (Shapes), Coordinate System, Rotation and Translation of Tetriminos (Shapes)

2025-03-30T21:13:00.007+11:00

Previous Page Next Page

Tetriminos (Shapes)

In this Tetris game, I use 7 shapes. While some versions only include 5 shapes, I’ve added two extra ones: the J and S shapes, which are mirror opposites of the L and Z shapes, respectively.

Each shape consists of 4 blocks, and each block is called a Mino (short for monomino). A group of 4 Minos forms a Tetrimino (also known as Tetromino or Tetramino). For consistency, I’ll use the term Tetrimino throughout this article.

Coordinate System

To simplify game development, I’ve designed a gotoxy(x, y) function that relocates the coordinate system’s origin (0, 0) from the default top-left corner of the command window to a more convenient central position at (36, 12).

How It Works:

Coordinate Transformation:

The function offsets input coordinates:

x becomes x + 36
y becomes y - 12

This allows negative coordinates (e.g., (-36, 12) maps to the original (0, 0)).

Purpose:

Centering (0, 0) simplifies calculations for symmetric gameplay elements (e.g., rotating Tetriminos around the origin).
Negative coordinates enable intuitive positioning relative to the new origin.

The final coordinate system of the game is represented on below image.

Tetris game board spans 11 units along x-axis (width) and 21 units along the y-axis (height). The center coordinate is (0,0) so the coordinates of four corner of the Tetris board are (5, 10), (5, -10), (-5, -10), and (-5, 10).

Rotation and Translation

To rotate and translate Tetrimino, we must use linear algebra. This is 2D game and we rotate Tetrimino only by 90 degrees clockwise or anticlockwise. So, the final formula of rotation and translation will be simple.

Translation formula is:

v = (x, y) , T = (x', y') then v' = v + T = (x + x', y + y')

so, v = (0,0) T = (0, 12) move to v' = (0+0, 0+12) = (0,12)

Rotation formula by center of axis is:

v = (x, y), R = (cos Φ - sin Φ, sin Φ + cos Φ) then v' = R . v

v' = (x cos Φ - y sin Φ, x sin Φ + y cos Φ)

we rotate Tetrimino only by 90 degrees so cos Φ = 0, and sin Φ = -1 so final rotation vector is

v' = (y * -1, x * 1), anticlockwise

v' = (y * 1, x * -1), clockwise

so (2,3), clockwise rotation is (3*1, 2*-1) = (3, -2)

Let's take a line shape Tetrimino as an example and discuss how we have implemented in game.

We always draw Tetrimino at the center of axis so that while rotating it will rotate by its own center of body. Initial coordinates of line are (0, 2), (0, 1), (0, 0), and (0, -1).

Coordinates after clockwise rotation are (-1,0), (0, 0), (1, 0), and (2, 0).

Coordinates after translating by (-3, 7) are (-4,7), (-3, 7), (-2, 7), and (-1, 7).

Part 2: Tic Tac Toe game in C programing | Source Code explanation

2025-02-02T10:42:00.008+11:00

Watch this tutorial in YouTube.

In this article, we will discuss the following main topics. I encourage you to watch YouTube video to understand the source code in detail.

Technique to switch players.
Logic to check winner player.
Calculate computer player best move.

Technique to switch players

I have assigned the value 0 to the first player and the value 1 to the second player, regardless of who plays first. If the human chooses to play first, the value 0 is assigned to the human variable, and the value 1 is assigned to the computer variable, and vice versa. Throughout the project, the system checks the current player against the human or computer variable to determine the player type. The first player always uses "X," while the second player uses "O." However, the value assigned to a box depends on the player type: the value of a box chosen by the human is 3, and the value of a box chosen by the computer is 5.

#define firstPlayer 0 //Flag for first player
#define secondPlayer 1 //Flag for second player
int human,computer; //Variable to identify human or computer

//code to initialize player
void initGame(int choice){

    initBoard();
    if(choice == 1){
        human = firstPlayer;
        computer = secondPlayer;
    } else if(choice == 2){
        human = secondPlayer;
        computer = firstPlayer;
    }
    initPlayer(firstPlayer,secondPlayer);
    //getch();
}

Logic to check winner player

As you know, the value 3 is assigned to a box chosen by the human player, and the value 5 is assigned to a box chosen by the computer. To determine the winner, we will check the sum of the values of the boxes. If the total sum of a row, column, or diagonal is 9, the human player wins the game. Conversely, if the total sum is 15, the computer wins the game. We will calculate the sum of the values for each row, column, and both diagonals individually and compare the results to identify the winner.


//This function check the winner
int checkWinner(){

    int total=0;

    //Check Column
    for(int i=0;i<3;i++){
        total = box[i].value + box[i + 3].value + box[i + 6].value;
        if (total == 9 || total == 15)
            return 1;
    }

    //Check rows
    for(int i=0;i<9;i=i+3){
        total = box[i].value + box[i + 1].value + box[i + 2].value;
        if (total == 9 || total == 15)
            return 1;
    }

    //Check first diagonal of the board
    total = box[0].value + box[4].value + box[8].value;

    if(total == 9 || total == 15)
        return 1;

    //Check second diagonal of the board
    total = box[2].value + box[4].value + box[6].value;

    if(total == 9 || total == 15)
        return 1;

    return 0;
}

Calculate computer's next best move

We have already discussed the algorithm for the computer player to determine its next move. I have implemented this algorithm exactly as described in the source code. The computer player prioritizes selecting a winning position first. If a winning position is not available, it chooses a position that results in a draw. If neither a winning nor a draw position is available, the computer selects the next best move from a set of predefined steps.

//This function check the winner
int checkWinner(){

    int total=0;

    //Check Column
    for(int i=0;i<3;i++){
        total = box[i].value + box[i + 3].value + box[i + 6].value;
        if (total == 9 || total == 15)
            return 1;
    }

    //Check rows
    for(int i=0;i<9;i=i+3){
        total = box[i].value + box[i + 1].value + box[i + 2].value;
        if (total == 9 || total == 15)
            return 1;
    }

    //Check first diagonal of the board
    total = box[0].value + box[4].value + box[8].value;

    if(total == 9 || total == 15)
        return 1;

    //Check second diagonal of the board
    total = box[2].value + box[4].value + box[6].value;

    if(total == 9 || total == 15)
        return 1;

    return 0;
}


//This function will return game winning move 
//or game draw move based on prameters
//flag == 0, winning move
//flag == 1, draw move
int getWinDrawMove(int flag){

    int total=-1;

    if(flag==0){
        total=10;
    } else if(flag==1){
        total=6;
    }

    //Check Column
    for(int i=0;i<3;i++){
        if (total==(box[i].value+box[i + 3].value+box[i + 6].value)){
            if(box[i].value==0)
                return i;
            else if (box[i + 3].value==0)
                return i+3;
            else if (box[i + 6].value==0)
                return i+6;
        }
    }

    //Check rows
    for(int i=0;i<9;i=i+3){
        if ((box[i].value+box[i + 1].value+box[i + 2].value)==total){
            if(box[i].value==0)
                return i;
            else if (box[i+1].value==0)
                return i+1;
            else if (box[i+2].value==0)
                return i+2;
        }
    }
    //Check first diagonal of the board
    if((box[0].value+box[4].value+box[8].value) == total){
        if(box[0].value==0)
            return 0;
        else if (box[4].value==0)
            return 4;
        else
            return 8;
    }
    //Check second diagonal of the board
    if((box[2].value+box[4].value+box[6].value) == total){
        if(box[2].value==0)
            return 2;
        else if (box[4].value==0)
            return 4;
        else
            return 6;
    }

    return -1;
}

//Get location of boxes 5,2,4,6,8 respectively
int getMake2()
{
    if(box[4].value == 0)
        return 4;
    if(box[1].value == 0)
        return 1;
    if(box[3].value == 0)
        return 3;
    if(box[5].value == 0)
        return 5;
    if(box[7].value == 0)
        return 7;

    return -1;
}

//Get location of boxes 1,3,7,9 respectively
int getMake4()
{
    if(box[0].value == 0)
        return 0;
    if(box[2].value == 0)
        return 2;
    if(box[6].value == 0)
        return 6;
    if(box[8].value == 0)
        return 8;

    return -1;
}

//This function return best next move for computer player
int getNextMove(){

    int boxNum;


    if(p.numOfTurn >= 3){
        //Get winning position
        boxNum = getWinDrawMove(1);
        if(boxNum!=-1)
            return boxNum;

        //Get Draw position
        boxNum = getWinDrawMove(0);
        if(boxNum!=-1)
            return boxNum;
    }

    boxNum = getMake2();
    if(boxNum!=-1)
        return boxNum;

    boxNum = getMake4();
    if(boxNum!=-1)
        return boxNum;

    return -1;
}

Part 1: Tic Tac Toe game in C programing | Flowchart, Algorithm of Computer Player, and Data Structure

2025-02-02T10:41:00.011+11:00

Previous Page Next Page

Watch this tutorial in YouTube.

Flowchart

Explanation of Flowchart:

Start: The game process begins here.

Display Game Menu: The user can choose to play first or second.

Initialize Game: Initialize the human or computer as the first or second player. Set up the Tic-Tac-Toe board and assign initial values to the players.

Draw Game Window: Render the game window and wait for user input.

Start Game: Begin an infinite game loop.

Set Current Player (Human or Computer): Designate the current player as either the human or the computer and obtain input from the player.

Get Input from Player and Draw X or O Based on Player: Draw an "X" for the first player and an "O" for the second player.

Check for Game Winner or Draw: Determine if a player has won the game or if the game has ended in a draw.

Display Game Winner or Draw Message: Show a message indicating whether a player has won or if the game is a draw.

Ask User to Restart Game or Exit: If the user presses any key, restart the game. If the user presses the ESC key, exit the game.

Exit Game: The game process ends.

Algorithm of computer player:

As this game article is target for beginner c programmer, I haven't used complex AI algorithm which required creating complex data structure. Tic Tac Toe game has very limited number of steps, so I have formulated series of best game steps from high rank to low rank. Computer will choose next move based on predefine series of game steps.

In every turn, computer will choose location starting from 1 to 11 steps.

1. Choose location to win the game by scanning columns, rows, first diagonal, and second diagonal in order. If there is no winning position, then go to 2 steps.

2. Choose location to draw the game by scanning columns, rows, first diagonal, and second diagonal in order. If there is no game draw position, then go to 3 steps.

3. Choose center location i.e. fifth location, if not available go to step 4.

4. Choose second location, if not available go to step 5.

5. Choose fourth location, if not available go to step 6.

6. Choose sixth location, if not available go to step 7.

7. Choose eighth location, if not available go to step 8.

8. Choose first location, if not available go to step 9.

9. Choose third location, if not available go to step 10.

10. Choose seventh location, if not available go to step 11.

11. Choose ninth location

In above algorithm, 1 and 2 steps will not come in effective until third turn of the game.

Data Structure:

This game is a 2D game played by two players on a 3x3 grid, totaling 9 boxes. There are three key elements/objects in this game: the player, the game board, and a 2D x-y coordinate system to represent the boxes. To model these elements, I have created three structure definitions: struct Point2D, struct BoardBox, and struct Player.

The Point2D structure is used to represent the center of each box, making it easier to draw an "X" or an "O" in the correct position. The BoardBox structure represents the nine boxes of the game. It contains the coordinates of the center of each box and a value assigned to it. The value is determined based on the player's choice: a value of 3 is assigned for the human player, and a value of 5 is assigned for the computer player.

//Structure definition to store window x,y coordinates
struct Point2D {
    int x;
    int y;
};

//Structure definition to define each game board boxes
struct BoardBox {
    struct Point2D center;
    int value;
};

//struct variable to store nine boxes of the board.
struct BoardBox box[numBox];

The Player structure represents both the human and computer players. It contains information about the current player, the next player, the box number selected by the current player, and the number of turns taken by the player. In total, there will be 9 turns to complete the game.

//structure definition to store player information
struct Player {
    int numOfTurn;
    int selectedBox;
    int currentPlayer;
    int nextPlayer;

};

//Global variable to represent player
struct Player p;

Part 2: Snake Game in C | Snake Collision Detection, Calculate next position and Changing direction

2024-12-04T21:42:00.006+11:00

Previous page

In this section, we will discuss the following items.

Techniques to change direction of the snake based on user input.
Techniques to calculate the snake's next position.
Techniques to check for snake collision with window and its body.

Snake direction and food

We are using the gotoxy(int x, int y) function to move the snake on the screen. The top left corner of the PC window starts at (0,0). The right side of the screen is positive x-axis, and the bottom of the screen is positive y-axis. However, we can represent the direction of snake in all four directions by positive and negative axes (-x, 0), (x, 0), (0, -y), and (0, y). For the left arrow key, set direction as negative x-axis (-x,0), for the right arrow key set direction as positive x-axis (x,0), for the up arrow key set direction as negative y-axis (-y,0), and for the down arrow key set direction as positive y-axis (y,0). When the direction is changed, the snake will move perpendicular to current position, so we don't have to use both x, and y coordinates values. The coordinates system of the PC window is shown in the image below.

Simply, we draw the "0" character as food in a random position on the window. To simplify this process, we create an array of Point2D struct variables (struct Point2D food[sSize]) and initialize it by storing all possible coordinates of the window. In this game, there are 800 possible coordinates, 40 towards x-axis and 20 towards y-axis. Now, we generate a random number between 0 and 800. The random number is used as an index of the food array, and we draw the "0" character at the coordinate of that index.


struct Point2D dir[4]; //array for snake direction vector
struct Point2D food[sSize];

void initDir(){

    //Up direction
    dir[UP].x = 0;
    dir[UP].y = -1;

    //Down direction
    dir[DW].x = 0;
    dir[DW].y = 1;

    //Right Direction
    dir[RT].x = 1;
    dir[RT].y = 0;

    //Left Direction
    dir[LT].x = -1;
    dir[LT].y = 0;
}

void initFood(){

    int i=0;
    for(int j=0;j<winYLen;j++){
        for(int k=0;k<winXLen;k++){
            food[i].x = k + startPosX;
            food[i].y = j + startPosY;

            i++;
        }
    }
}

Calculate Snake's next position

At first, we have to initialize snake variable which initial values such as length, body, head, tail and direction. We set snake length and calculate initial snake body coordinates from initial starting position, set snake head and tail coordinates and set snake initial direction. In this game, I have used initial length of 3, snake starting position (11,10), and initial moving direction is right (1, 0). The body of snake will be (11,10), (12,10), (13,10), snake head will be (13,10) and tail will be (11,10).

void initSnake(){

    for(int i=0;i<startLen;i++){
        s.body[i].x = startPosX + i;
        s.body[i].y = 10;
    }

    s.head.x = s.body[startLen-1].x;
    s.head.y = s.body[startLen-1].y;

    //In first frame of the game tail position
    //need to be out of window or blank
    s.tail.x = 0;
    s.tail.y = 0;

    s.dir.x = dir[RT].x; s.dir.y = dir[RT].y;

    s.length = startLen;
}

Now, using initial snake position and direction we will calculate next position. Next position will be always snake's head position. As you know, snake always move in straight line and change direction ±90 degree from its current head position. In each given frame only one coordinate axis (either x or y) will change. So, we need to calculate new head position only. Snake body is an array of 2D coordinates. We know the maximum possible length of snake is 800 in this example. We had already created snake body array of size 800. We will add new head position in body array and swap the body coordinates so that previous tail coordinates of snake will no longer be the part of snake body will get removed. If snake collide with food, then we will not swap the body, but we will increase the length of the snake and increase score. On screen we will print blank on previous tail coordinates and print "*" on new head coordinate. Even we don't have to print whole snake body in each frame. Also, we don't have to print window in each frame, it is always fixed. Here, moving parts will be always head and tail of the snake other parts are not changes.

For example, if the snake head is (13,10) and the direction is right (1,0), then add 1 unit to the x-coordinate. If direction is up (0, -1), then subtract 1 unit from the y-coordinate. If the direction is down (0,1), then add 1 unit to the y-coordinate. If direction is left (-1,0), then subtract 1 unit from the x-coordinate. However, if previous direct is right, then user should not be allowed to move left. Snake should move only by 90 degrees either positive or negative.


int buildSnake(struct Point2D f,struct Point2D d){

    if(s.dir.x != -d.x && s.dir.y != -d.y){
        s.dir.x = d.x; s.dir.y = d.y;
    }

    s.head.x = s.body[s.length-1].x + s.dir.x;
    s.head.y = s.body[s.length-1].y + s.dir.y;

    s.body[s.length].x = s.head.x;
    s.body[s.length].y = s.head.y;
    if(s.head.x == f.x && s.head.y == f.y){
        s.length++;
        return 1;
    } else {
        s.tail.x = s.body[0].x;
        s.tail.y = s.body[0].y;
        //Swap snake body back starting from initial index
        for (int i = 0;i<s.length;i++){
            s.body[i].x = s.body[i+1].x;
            s.body[i].y = s.body[i+1].y;
        }
    }

    return 0;
}

Collision detection

We have very few objects in this game, so the collision detection is very simple. We have to detect the collision of snake's head with four walls of window and its body. We already have coordinates of all these objects. After calculating the next snake's head position, we will compare the coordinates of snake's head position with four walls. Also, we will check weather new head position falls within its body. If a collision with walls and its body found, we will terminate game and ask user to restart again or exit.


int checkCollision(){
    if(s.length == sSize){
        return 2;
    }

    if(s.head.x == wX1 || s.head.x == wX2){
        return 1;
    }

    if(s.head.y == wY1 ||s.head.y == wY3){
        return 1;
    }

    for (int i=0;i<s.length-2;i++){

        if(s.head.x == s.body[i].x && s.head.y == s.body[i].y){
            return 1;
        }
    }

    return 0;
}

Please find video of this article in YouTube.

Part 1: Snake Game in C | Flowchart, Data Structure and Algorithm

2024-12-04T21:41:00.008+11:00

Previous page Next Page

Flowchart

Explanation of Flowchart:

Start: The process begins here.

Initialize game: Initialize Snake Direction, food, snake, window, variables, and others

Draw initial window: Draw the window when snake game is played. Window will have fix coordinates.

Start Game: Start gameplay.

Calculate Snake Next Position: For the first time, snake will start at a fix location. It will calculate the next position based on snake directions (up, down, left or right) provided by the user.

Check Snake Eating Food: After calculating next position, check whether the snake's next location and food location collide.

Increase length of snake and draw food: If yes, then food is eaten by the snake. Increase the length of the snake and draw food in another random location.

Check Collision: Check the snake's collision with snake body and window walls.

Draw next frame (snake): Based on snake next position and length, draw the snake.

Check Key Press: Check keyboard key presses by the user.

Change Snake Direction: Based on key press (up, down, left and right arrows) by the user, change the direction of snake.

Exit Game: Exit game if user presses ESC key or the snake collides with window or its body.

Data Structure

This is a 2D game played on flat window. So, each point on the window is (x, y) coordinate. The initial size of the game window is fixed, defined by the x-axis length and y-axis length. I am using an x-axis length 40 and y-axis length 20 of window. So, the maximum size of the snake is 40*20=800. The maximum number of foods required to display is also 800. Also, based on the widow size and starting position, we will calculate the coordinates of all four corners of the window.

#define winXLen 40 //Snake game play window x-coordinate size
#define winYLen 20 //Snake game play window y-coordinate size
#define startPosX 11 //Game play window starting x-coordinate
#define startPosY 1 //Game play window starting y-coordinate
#define startLen 3 //Snake starting length
//Max size of the snake must be always >= winXLen * winYLen
#define sSize 800 

#define UP 0 //Up direction array index
#define DW 1 //Down direction array index
#define RT 2 //Right direction array index
#define LT 3 //Left direction array index

static const int winBorderX = winXLen + startPosX;
static const int winBorderY = winYLen + startPosY;
//First Corner of the Window
static const int wX1 = startPosX-1, wY1 = startPosY-1; 
//Second Corner of the Window
static const int wX2 = winBorderX, wY2 = startPosY-1; 
//Third Corner of the Window
static const int wX3 = winBorderX, wY3 = winBorderY; 
//Fourth Corner of the Window
static const int wX4 = startPosX-1, wY4 = winBorderY;

We must always represent points (x, y) coordinates using single variable. It is done by defining struct variable Point2D with two int x and int y variables inside it. Using this structure variable, we can define each point of the snake, snake direction and food. The body of snake is an array of (x,y) coordinates. So, we can define snake by array of Point2D struct Point2D body[size].

To move snake in player's given direction, display moving snake and check for collision, we need snake characteristics such as snake's body, head, tail, length, and direction in each frame of the game. We must bundle all these characteristics in struct variable Snake. The structure variable struct Snake s define the snake in any given frame. Here, I am refreshing window in every 150 milliseconds so there will be 6-7 frames per second.

struct Point2D{
    int x;
    int y;
};

struct Snake{
    struct Point2D body[sSize];
    struct Point2D head;
    struct Point2D tail;
    struct Point2D dir;
    int length;
};

struct Snake s;
//array for snake direction vector
struct Point2D dir[4]; 
struct Point2D food[sSize];

Algorithm

Step 1: Initialize global variables such as window length, height, snake starting position, snake initial length, total number of moving coordinates inside the window.
Step 2: Create C structure for 2D points, and the snake, and create global variables for snake, direction, and food.
Step 3: Initialize direction, food, snake, and hide mouse cursor
Step 4: Draw window and draw snake in initial starting position
Step 5: Generate random value range 0 to maximum size of available coordinates and draw food in a random position
Step 6: Start game and capture game status flag.
Step 7: Initialize game status flag to zero and variable to capture user input
Step 8: Start do-while loop and break loop when user presses a key.

Step 8.1: Delay by 150 milliseconds or as needed so that there will be 6-7 frame per second.
Step 8.2: Calculate Snake next position and check collision with food. Initialize snake head by next snake position. If snake do not collide with food, initialize tail variable by snake tail coordinates and swap the value of snake body array so that the next position will be the snake head, and the second last position will be the snake tail.
Step 8.3: If the snake collides with food, draw food in random location, and increase snake length and game score. Otherwise, go to step 8.4.
Step 8.4: Check for collisions of the snake with the window walls and within the snake body.
Step 8.5: If the snake collides, then exit the game and go to step 9.
Step 8.6: Draw the snake head in next position and delete the snake tail.
Step 8.7: Check for key presses by user. If a key is entered, go to step 8.8; Otherwise, do nothing and continue loop from step 8.1.
Step 8.8: If an arrow key (up, down, left, right) is entered, change the direction of the snake. If ESC key entered, exit the game. Otherwise, start the game again from step 8.

Step 9: Display the game over message and request user to start game again by pressing any key or exit the game by pressing the ESC key.
Step 10: If user press any key, start the game from step 3; Otherwise, exit the game.

Please find video of this article in YouTube.

Part 4: Library management in C| Pagination, Dynamic Memory allocation, write Comma Separated Values (CSV) file

2024-06-03T20:34:00.017+10:00

Previous Page

In this part, we will create pagination in C programming to view large set of books data. In college there might be thousands of books. We can't display all items on the screen, so we need to create techniques to display small set of data at a time and allow users to select next page or previous page to view data which is called pagination. Also, we will discuss to manage large set of books data and write books data into CSV file.

Here, we will discuss following items:

Pagination: Users can explore large set of data by selecting next or previous page of data.
Dynamic Memory allocation: Dynamic numbers of books are loaded into the memory, modify or delete book details from the memory using dynamic memory allocation.
Write Comma Separated Values (CSV): Export large set of books data into CSV file.

Please follow the source code of header file userMenu.h and loadCsvData.h.

Pagination:

We have three main functions to implement pagination features. The main technique is to load data into computer memory (RAM). The number of data which can be loaded in memory depend upon size of the memory. However, we will not get memory problem to load couple of thousands of data. In this application I haven't used large set of data however this technique can be used for any size of data.

The name of the functions are readBooks(), viewAllBooks(), and viewBooksByPage().

int readBooks(): This function is written inside loadCsvData.h header file. This function is called at the very first start of the application inside void adminMenu() and void studentMenu().

Line 148: int bkSize = getRowCount(fpl), function getRowCount() reads the books data file to count number of books and assign count to the variable bkSize. This variable is used to allocate size of the array of book structure.
Line 151: rewind(fpl); this will rewind the file pointer back to start of the file to continue reading books data.
Line 151: bk = (struct books*)malloc(bkSize * sizeof(struct books)); using malloc function we will allocate the size of the array bk equal to number of books count, and bk is array pointer.
Remaining codes up to line 194 will read books data from the file using loadBookValues functions which is discussed in part 3 of this tutorial.
Line 196: bk++, this will increment the pointer by 1 unit so that we can assign new books value into the array.
Line 201: bk=(bk-bkSize), this will move pointer back to initial position so that we can view data from the beginning of array.

void viewAllBooks(int flag): This function calculates the value of lower index and higher index of an array based on user input to display books data on the screen. The parameter flag will decide whether it is viewed by student or admin user. The number of data displayed per page is 15 which is declared by variable pageSize. At first lower index is zero, and higher index is 15 which is defined by variables lIndex and hIndex respectively. Now, when user will press key 'b' to view next page, the lower and higher index will be incremented by 15, if the value of higher index is greater than books count then higher index will be equal to books count, stops incrementing variables value. In similar way, if user press key 'n' to view previous page, the initial and lower index will be subtracted by 15. If lower index value will be less than zero, then initial index is set to zero and stops decrementing variables value. Every time user press key, the calculated initial index and higher index is passed to function viewBooksBypage() to display books data on the screen.

Add, Update and Delete books data: As books data is already loaded in memory data, modifying and deleting data do not involve C file operations. Add, update and delete operation happens directly in data array. Here dynamic memory allocation plays major role to perform these operations.

Update book data: We can update the value of array directly which is very fast and easy. The function updateBook() is created to update books data. It requests book's new details from the user and update the value in array.
Add book data: We can't simply add additional elements in array because memory is not already allocated. At first, we have to allocate memory and add new elements. The function addBook() is created to add books data. It requests new books information and add books data in the array.

Line 375: int newbkCount=bkCount+1;, assign variable by new book count.
Line 377: bk = (struct books*)realloc(bk,newbkCount * sizeof(struct books));, the memory of array bk is reallocated using realloc function by new new book count.
Line 378: bk = (bk+bkCount);, move the pointer to new element of an array.
Line 380 to 386: Copy the books value into bk array using strcpy function.
Line 388: bk = (bk-bkCount), move the pointer back to initial position of an array.
Line 389: update the variable bkCount by new count i.e newbkCount.

Delete book data: The logic to delete data is to allocate new memory block with size 1 item less than current memory block. Copy all data to new memory block except the item which we want to delete. Free previous memory block and point pointer to new memory block.

Line 475: tmp_bk = (struct books*)malloc((bkCount-1) * sizeof(struct books)), allocate new memory block of size bkCount-1.
Line 477: if(indexToRemove != 0) memmove(tmp_bk,bk,(indexToRemove)*sizeof(struct books)), copy data from memory bock bk to tmp_bk upto the block which we want to delete.
Line 480: if(indexToRemove != (bkCount-1)) memmove(tmp_bk+indexToRemove,bk+(indexToRemove+1),(bkCount-indexToRemove-1)*sizeof(struct books)), copy data from memory bock bk to tmp_bk after the block which we want to delete.
Line 483: free(bk), free memory block.
Line 484: bk = tmp_bk, assign the address of new memory block to old pointer bk.

Write data into Comma Separated Values (CSV) file

The method to write data into CSV file is straight forward and easy. We can use fprintf() function to write data in file as a required format.

Part 3: Library management in C| Read Comma Separated Values (CSV) file and Student Login System

2024-06-03T20:34:00.016+10:00

Previous Page Next Page

In this application we have two scenarios where we read CSV files. First to read Students data and second to read books data. Students need to provide student id to login application. We read the students data from csv file and compare the student id. Also, we read large set of books data from csv file.

Sample student csv data:

Sample books csv data:

The header file loadCsvData.h is written to load csv files student data and books data. There are four main functions which reads the files.


static int getStudentID(char stuId[MAX_ID], struct stuProfile *st);
static int  loadStuValues(char *line, char *sFields[STU_COL_NUM]);
int readBooks();
static int  loadBookValues(char *line, char *lFields[BK_COL_NUM]);
int getRowCount(FILE *fpl);

First two functions static int getStudentID(char stuId[MAX_ID], struct stuProfile *st) and static int loadStuValues(char *line, char *sFields[STU_COL_NUM]) loads student data. Let's breakdown these functions.

Function getStudentID(char stuId[MAX_ID], struct stuProfile *st): This function compares the student id passed in the paraments with the student data read and if student id found, it will initialize the stuProfile structure pointer by student information.

Line 49: fps = fopen(STU_DATA_FILE, "r") reads the csv file in read mode.
Line 58: while (!feof(fps)) loop reads the file line by line until the end of the file is reached.
Line 61: if(fgets(inBuffer, BUFFER_SZ-1, fps)==NULL) break; reads the line from the file into the buffer. The loop will break if end of the file is reached.
Line 65 and 69: if(++rowNum==1) continue; and if(strlen(inBuffer)==0) continue; skips the first header data and empty lines.
Line 72: if(loadStuValues(inBuffer,sFields)==FAIL){This call function loadStuValues() to read each columns values from the line. The parameter sFields is character pointer to array of string equal to number of columns. The size of the array must be equal to number of columns in csv file. After reading columns value, function will assign it to sFields pointer variable.
Line 78: if(strcmp(sFields[ID],stuId)==0) it compares the student id passed in the parameter to file data. If student id exits, followings line will initialize structure stuProfile elements.

Source code of the function:


static int getStudentID(char stuId[MAX_ID], struct stuProfile *st){

    FILE *fps;

    // char* array will point to fields
    char *sFields[STU_COL_NUM];

    int err_count = 0;

    fps = fopen(STU_DATA_FILE, "r");
    if(fps == NULL) {
        //printf("Error opening file: %d\n",errno);
        return(FAIL);
    }

    char inBuffer [BUFFER_SZ];
    long rowNum = 0L;

    while (!feof(fps)) {

        // load line into static buffer
        if(fgets(inBuffer, BUFFER_SZ-1, fps)==NULL)
            break;

        // skip first line (headers)
        if(++rowNum==1)
            continue;

        // jump over empty lines
        if(strlen(inBuffer)==0)
            continue;
        // set pFields array pointers to null-terminated 
        //string fields in inBuffer
        if(loadStuValues(inBuffer,sFields)==FAIL){
           err_count++;
            if(err_count > MAX_ERROR_NUM)
                break;
        } else {
            //Compare Student ID
            if(strcmp(sFields[ID],stuId)==0){

                strcpy(st->stuID,sFields[ID]);
                strcpy(st->fName,sFields[fNAME]);
                strcpy(st->lName,sFields[lNAME]);
                strcpy(st->faculty,sFields[FACULTY]);

                fclose(fps);
                return PASS;
            }
        }
    }
    fclose(fps);

    return FAIL;
}

Function loadStuValues(char *line, char *sFields[STU_COL_NUM]): This function reads the column value separated by csv. To include the comma value inside the column we will user enclose the column value by double inverted quotation.

Line 97: char delim=','; Initialize delimiter value by comma (,). We can user delimiter other than comma.
Line 98: if(line == NULL) return FAIL; If the input character buffer value is null, it will return fail flag.
Line 103: if(*(line + strlen(line)-1) == '\r' || *(line + strlen(line)-1) == '\n') *(line + strlen(line)-1) = '\0'; It chop of last char of input if it is a CR or LF (e.g.Windows file loading in Unix env.). It can be removed if sure fgets has removed both CR and LF from end of line.
Line 106: char *cptr = line; This declares a character pointer and initializes it to point to the start of the line.
Line 111: sFields[fld]=cptr; This declares a character pointer and initializes it to point to the start of cptr variable. sFields[fld] is a string which represent the column values. At this line we can consider sFields[0] has value of whole line.
Line 112 to 126: while((ch=*cptr) != '\0' && fld < STU_COL_NUM) It loop through each character of string cptr until it reaches end of line. Inside while loop, we check opening quote ("), closing quote ("), and comma (,) value in each character and if found will split string by assigning null character ('\0'). Each time adding null character we will increment the index of array sFields and continue loop. At the end array sFields[0] is equal to first column, sFields[1] is equal to second column and so on.
Line 128 to 131: It will verify the number of columns found in the file and the required number of columns.
After reading line successfully, the function ends by returning true flag.

The source code of the above function:


static int  loadStuValues(char *line, char *sFields[STU_COL_NUM]){
    char delim=',';
    if(line == NULL)
        return FAIL;

    // chop of last char of input if it is a CR or LF 
    //(e.g.Windows file loading in Unix env.)
    // can be removed if sure fgets has removed both CR 
    //and LF from end of line
    if(*(line + strlen(line)-1) == '\r' || *(line + strlen(line)-1) == '\n')
        *(line + strlen(line)-1) = '\0';

    char *cptr = line;
    int fld = 0;
    int inquote = FALSE;
    char ch;

    sFields[fld]=cptr;
    while((ch=*cptr) != '\0' && fld < STU_COL_NUM){

        if(ch == '"') {
            if(! inquote){
                sFields[fld]=cptr+1;
            }else {
                *cptr = '\0';// zero out quote and jump over it
            }
            inquote = ! inquote;
        } else if(ch == delim && ! inquote){
            *cptr = '\0';// end of field, null terminate it
            sFields[++fld]=cptr+1;
        }

        cptr++;
    }
    if(fld > STU_COL_NUM-1){
        return FAIL;
    } else if (fld < STU_COL_NUM-1){
        return FAIL;
    }
    return PASS;
}

Second two functions int readBooks(); and static int loadBookValues(char *line, char *lFields[BK_COL_NUM]); very much similar to above two functions. To understand the code further please follow my youtube video provided below. LoadBookValues and LoadStuValues is exactly same. However, getStudentID function we read only specific student data and assign it to stuProfile structure variable, and readBooks() function read all books data and assign it to array of bk (Book) structure variable. The size of Array of book structure 'bk' is allocated dynamically. We will discuss about in next part.

Student login system:

Student should choose the login in student mode at the start of an application. To login student should provide only student Id. The provided student Id is verified by reading student csv data in getStudentID function. If student Id found in the csv file, application let user to continue. Here, I choose not to use password for students because they will use application basically in read mode to view books details and view books issued to them. Student can't modify the application data.

Part 2: Library management in C | Username/Password Login System and Manage Admin Accounts

2024-06-03T20:34:00.015+10:00

Previous Page Next Page

In this part, we will learn the techniques to implement a username and password login system and manage user accounts.

When a user runs the application for the first time in admin mode, the application requests the user to create an admin account. However, from the second run onwards, the user has to log in using their account details. After logging into admin mode, the user can add or modify multiple admin accounts. To identify the application’s first run, it will check if the admin account file exists in the system. If the file doesn’t exist, then the application calls the create account function. Otherwise, if the file exists, it will call the Admin login function.


int checkFirstLogin(){
    int flag=1;

    fa = fopen(DATA_FILE,"rb");

    if(fa!= NULL){
        flag= 0;
    }
    fclose(fa);

    return flag;

}

Source code of function to create account:


void createAccount(){

    char passV[MAX_PWD_SZ];
    struct password pd;

    printWelcomeMsg();

    gotoxy(35,8);
    printf("Please Enter New Username and Password.");
    gotoxy(35,10);
    printf("New User Name: ");
    getString(pd.userName,MAX_USR_SZ);
    gotoxy(35,11);
    printf("New Password: ");
    getPassword(pd.password,MAX_PWD_SZ);
    gotoxy(35,12);
    printf("Re-type Password: ");
    getPassword(passV,MAX_PWD_SZ);


    if(strcmp(passV,pd.password)==0){

        add(pd);

        printWelcomeMsg();

        gotoxy(35,8);
        printf("Congratulation! User account created.");
        gotoxy(35,10);
        printf("Please press any key to continue and log in.");
        if(getch()){
            adminLogin();
        }

    }
}

In the above code, it gets the username and password details from the user and saves them in a file. The most interesting part of this code is that it hides the password entered by the user. It displays an asterisk (*) instead of the actual character to hide the password. The user can even delete entered characters before confirming. The task of password hiding is performed by the function getPassword(), which is shown below.


static void getPassword(char *buff, size_t sz){

    char ch;
    int i=0;

    while(ch!=13 && i!=sz)
    {
        ch=getch();

        if(ch==8 && i>0){
            printf("\b \b");
            i--;
            buff[i]='\0';
        }else if(ch!=13 && ch!=8){

            putch('*');
            buff[i] = ch;
            i++;
        }
    }

    buff[i]='\0';
    ch=' ';i=0;
}

In above code, it reads user character using getch() function, display Asterix (*) using putch() function, and remove the character from the screen by printing backspace, space and backspace (printf("\b \b")). While loop is used to read multiple characters.

After getting username and password details from the user, we will call add() function inside create account function to save user account details in C file.

Now, we will create admin login function. Source code is given below:


void adminLogin(){

    struct password pd;

    printWelcomeMsg();

    gotoxy(35,8);
    printf("Please Enter Username and Password.");
    gotoxy(35,10);
    printf("User Name: ");
    getString(pd.userName,MAX_USR_SZ);
    gotoxy(35,11);
    printf("Password: ");
    getPassword(pd.password,MAX_PWD_SZ);

    if(check(pd,0)==1){

        printWelcomeMsg();

        gotoxy(35,10);
        printf("Login Successfull.");
        gotoxy(35,13);
        printf("Please press any key to continue.");
        if(getch()){
            adminMenu();
        }
    } else {

        printWelcomeMsg();

        gotoxy(35,10);
        printf("Sorry! Username or Password do not match.");
        gotoxy(35,13);
        printf("Please press any key to re-login.");
        if(getch()){
            adminLogin();
        }
    }
}

In the above code, it gets the username and password, and checks the details in the system using the check() function. The check function reads the user account details from the file and compares them with the details provided by the user. If the user account exists, then it will take the user to the adminMenu() screen. Otherwise, it will request the user to log in again.

From the admin menu, the user can add, modify, view, and delete admin accounts by selecting option A. We will not discuss the function which gets details from the user or displays details on the screen. The source code of the function given below will read or modify data from the C file where the user account details are stored.



#define DATA_FILE "adminAccess.dat"
#define TEMP_FILE "tempFile.dat"

//Read data from file

int check(struct password d,int flag){

    struct password a;
    int i=0;
    fp = fopen(DATA_FILE,"rb");
    while(fread(&a,sizeof(a),1,fp)==1){
        if(flag==0){
            if(strcmp(a.userName,d.userName)==0 && 
            strcmp(a.password,d.password)==0){
                i=1;
                break;
            }
        } else if (flag==1){
            if(strcmp(a.userName,d.userName)==0){
                i=1;
                break;
            }
        }
    }
    fclose(fp);
    return i;
}

//Read data from file
int view(struct password d[], int sz){

    struct password a;
    int i=0;
    fp = fopen(DATA_FILE,"rb");
    while(fread(&a,sizeof(a),1,fp)==1 && i<sz){
        d[i]=a;
        i++;
    }
    fclose(fp);
    return i;
}

//Add data into the file
void add(struct password d){

    fp = fopen(DATA_FILE,"ab+");
    fseek(fp,0,SEEK_END);
    fwrite(&d,sizeof(d),1,fp);
    fclose(fp);
}


//Update data into the file
int update(struct password d){

    struct password a;
    int flag=0;

    fp=fopen(DATA_FILE,"rb+");

    while(fread(&a,sizeof(a),1,fp)==1){
        if(strcmp(a.userName, d.userName)==0){
            fseek(fp,ftell(fp)-sizeof(a),0);
            fwrite(&d,sizeof(d),1,fp);
            fclose(fp);
            flag=1;
        }
    }
    fclose(fp);

    return flag;
}

//Delete data from the file
int del(char *userName){

    struct password a;
    int flag=0;

    fp=fopen(DATA_FILE,"rb+");
    ft=fopen(TEMP_FILE,"wb+");

    while(fread(&a,sizeof(a),1,fp)==1){
        if(strcmp(userName, a.userName)!=0){
            fwrite(&a,sizeof(a),1,ft);
        } else {
            flag=1;
        }
    }

    fclose(ft);
    fclose(fp);

    remove(DATA_FILE);
    rename(TEMP_FILE,DATA_FILE);

    return flag;

}

Above source code is reused from the project Contact Management. It will read, add, modify, and delete data from the file using C file handling functions. Please follow Contact Management project to understand the source code.

Part 1: Library management in C | Flowchart and Function Stack Call Diagram

2024-06-03T20:33:00.007+10:00

Previous Page Next Page

The application is represented by three mainMenu, adminMenu and studentMenu flowchart. The mainMenu flowchart represents the options provided to the user to choose application mode and user security. The adminMenu flowchart represents the all the tasks that administrator can perform, and the studentMenu flowchart represents the tasks that students can perform.

Explanation of Main Menu flowchart:

Start: The process begins here.

Main User Menu: The application displays the user menu to select the mode of the application.

Admin or Student?: This is the decision point where the user can choose either Admin mode or Student mode. The general idea is that library staff will choose Admin mode and students will choose Student mode.

Student Login: If the user is a Student, the application requests the user to log in by providing their student ID.

Exist?: The application checks if the student exists in the system. If the student ID exists, the process moves to the Student Menu Process. If the student ID does not exist, the application requests the user to enter it again.

Student Menu Process: This is a sub-process of the application. This process executes the application in Student mode. It is represented by the Student Menu flowchart.

Setup?: If the user is an Admin, the application checks if it is the first run (setup) of the application.

Create Account: If the application is running for the first time, the application requests the user to create the first admin account by providing a username and password.

Admin Login: The application moves to the Admin login screen if an admin account already exists.

Exist?: The application checks if the admin user account exists in the system. If the admin account exists, the process moves to the Admin Menu Process. If the admin account does not exist, the application will request the user to enter the details again.

Admin Menu Process: This is a sub-process of the application. This process executes the application in Admin mode. It is represented by the Admin Menu flowchart.

End: End of the application.

Explanation of Admin Menu flowchart:

Start: The Admin process begins here.

Admin Menu: The application displays the admin menu to select the task to perform. User can select task by input key A, B, C, D, E or Esc.

All Decision Points: If user input A, application takes user to Add/Modify Admin Account task menu, else if user input B, application takes user to Add/Modify Books info task menu, else if user input C, application takes user to issued or Return Books task menu, else if user input D, application takes user to search Books task, else if E or ESC applicaiton will end.

Add/Modify Admin Account: User can view, add, update and delete admin account.

Add/Modify Books Info: User can view, add, update and delete books data.

Issued or Return Books: User can issue books to the students and update returned books.

Student Menu Process: This is a sub-process of the application. This process executes the application in Student mode. It is represented by the Student Menu flowchart.

Search Books: User can search books by proving book ID.

End: End of the application.

Explanation of Student Menu flowchart:

Start: The student process begins here.

Student Menu: The application displays the student menu to select the task to perform. User can select task by input key A, B, C, D or Esc.

All Decision Points: If user input A, application takes user to search books task, else if user input B, application takes user to view all books, else if user input C, application takes user to view issued or Returned Books, else if user input D or ESC applicaiton will end.

Search Books: User can search books by proving book ID.

View All Books: User can view all books avaiable in the library.

View My Issued Books: User can view issued and returned books.

End: End of the application.

Above is the function call stack diagram. It is different from a flowchart. A flowchart helps to represent application flow, business cases, and user interactions. It helps to explain application features to non-technical business users. However, in the function call stack diagram, you will find the link between the functions within the application source code. It helps technical users or developers to understand the application source code.

Chapter 2: Contact Management in C | File Handling

2023-11-03T10:36:00.004+11:00

<<Previous Chapter

If you remember we have categoried all the functions into two types user functions and operational functions. Here I will explain the operational function and its usage in user functions one by one.

First, let's define Variables and Data Structure.


// Define Constant Variables
#define ESC 27
#define MAX_NAME_SZ 15
#define MAX_NUM_SZ 25
#define READ_ARRAY_SZ 15
#define DATA_FILE "dataFile.dat"
#define TEMP_FILE "tempFile.dat"

//Define data structure

struct data{
    char fName[MAX_NAME_SZ];
    char lName[MAX_NAME_SZ];
    char mPhone[MAX_NUM_SZ];
    char wPhone[MAX_NUM_SZ];
    char hPhone[MAX_NUM_SZ];
};

We will use struct data types to store contact information. It has only five fields First Name (fName), Last Name (lName), Mobile Phone (mPhone), Work Phone (wPhone), Home Phone (hPhone), and all these variables are char types. We can't set primary key as in database but we will choose Mobile Phone i.e mPhone as a primary key and will make sure that Mobile Phone number will not be a null value or duplicate while adding data into the file.

Function getString(): This function reads the data from the buffer and puts data into the array. You might think that scanf() function is very easy compared to this. Yes, you are true but there are problems with scanf() function. It does not clear the overflow value from the buffer. For example a user might input 20 long characters for the first name, but the size of the first name array is just 15 so remaining 5 characters will remain in the buffer. In the next use of scanf() function, it will read the previous remaining characters and you will get incorrect data. The scanf() function is useful only if you are sure about the input value.


//Get string input from user
static void getString(char *buff, size_t sz){

    fgets(buff,sz, stdin);
    if ((strlen(buff) > 0) && (buff[strlen (buff) - 1] == '\n'))
        buff[strlen (buff) - 1] = '\0';

    fflush(stdin);
}

Function readData(): This is a user function. It will interact with the user to get contact information. In the below code, you can see, it displays message using printf function and read input value using getString function which we have discussed above. After reading data, it will return the struct data type variable 'c'.


//Function to read contact data
struct data readData(){
    struct data c;

    gotoxy(35,11);
    printf("Enter first name: ");
    getString(c.fName,sizeof(c.fName));

    gotoxy(35,12);
    printf("Enter last name: ");
    getString(c.lName,sizeof(c.lName));

    gotoxy(35,13);
    printf("Enter mobile phone: ");
    getString(c.mPhone,sizeof(c.mPhone));

    gotoxy(35,14);
    printf("Enter work phone: ");
    getString(c.wPhone,sizeof(c.wPhone));

    gotoxy(35,15);
    printf("Enter home phone: ");
    getString(c.hPhone,sizeof(c.hPhone));

    return c;
}

Declare File Pointers: Now let's declare the file pointers, and use these pointers to create files. Both pointers are required, you will find it in the code somewhere below.

//File pointers
FILE *fp, *ft;

Function add(): This is an operational function that adds the data into the file. Adding data into the file is very simple. First, open the file using file pointer fp in ab+ mode which is for both reading and appending data in binary mode. There are many opening modes in C, please google about it to study in detail. After opening the file, the fseek function will move the cursor always at the end of the file so that data will not get overridden. The function fwrite writes the data into the file in a block of size equal to the size of 5 char variables inside the struct.

At last, the file is closed using fclose function.


//Add data into the file
void add(struct data d){

    fp = fopen(DATA_FILE,"ab+");
    fseek(fp,0,SEEK_END);
    fwrite(&d,sizeof(d),1,fp);
    fclose(fp);
}

Function searchByNum(): This function searches the numbers in the file from top to bottom one by one. If a number, passed in the function parameter is found then it will return 1 otherwise it will return 0.


//Search mobile number in the file
int searchByNum(char *num){

    struct data a;
    int i=0;
    if(strcmp(num,"")==0){
        i=2;
    } else {
        fp = fopen(DATA_FILE,"rb");
        while(fread(&a,sizeof(a),1,fp)==1){
            if(strcmp(num, a.mPhone)==0){
                i=1; //return 1 if found
            }
        }
        fclose(fp);
    }

    return i; //return 0 if not found
}

Function addItems(): This function interacts with the user to get input data. After getting data, it checks the phone number in the file. If it exits will not add data and request the user to go back to update data. If it does not exist then it calls the add() function to save the data into the file that we had discussed above. At last, it allows the user to add another item or exit the function.


//Add contacts
void addItems(){

    struct data c;

    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("Please enter details:");

    c = readData();
    if(searchByNum(c.mPhone)==2){
        gotoxy(35,16);
        printf("Mobile number is empty. Record can't be saved.");
    } else if(searchByNum(c.mPhone)==1){
        gotoxy(35,16);
        printf("Mobile number %s exist. Please go back to update.",c.mPhone);
    } else {
        add(c);
        gotoxy(35,17);
        printf("Record Successfully Saved.");
    }
    gotoxy(35,27);
    printf("Please press any key to continue or enter ESC key to go back.");
    if(getch()==ESC){
        mainMenu();
    } else {
        addItems();
    }
}

Function view(): This function reads the data from the file and stores the data into the array of structure data a.


//Read data from file
int view(struct data d[], int sz){

    struct data a;
    int i=0;
    fp = fopen(DATA_FILE,"rb");
    while(fread(&a,sizeof(a),1,fp)==1 && i<sz){
        d[i]=a;
        i++;
    }
    fclose(fp);
    return i;
}

Function viewItems(): This function gets the data from the view() function that we discussed above and displays the contact information in a tabular form. However, this function displays only 15 items only, due to the limitation of console windows size. You can implement a pagination feature to display the remaining items on the next page. I will add this feature in my next tutorials.


//Display contacts only 15 items
void viewItems(){

    struct data c[READ_ARRAY_SZ];
    int data_sz=0;
    data_sz = view(c,READ_ARRAY_SZ);

    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("View Contact function selected %d",data_sz);


    gotoxy(15,10);
    printf("First Name");
    gotoxy(35,10);
    printf("Last Name");
    gotoxy(55,10);
    printf("Mobile Number");
    gotoxy(70,10);
    printf("Work Number");
    gotoxy(85,10);
    printf("Home Number");
    for (int i=0;i

Function update(): To update the existing data, we first search for the old mobile number in the file. After finding the mobile number in the file it rewinds the file cursor just by 1 block of data using fseek function. You can check the logic below. After rewinding the cursor by 1 block, we will overwrite the data with the new value.


//Update data into the file
void update(struct data d, char *oldNumber){

    struct data a;

    fp=fopen(DATA_FILE,"rb+");

    while(fread(&a,sizeof(a),1,fp)==1){
        if(strcmp(oldNumber, a.mPhone)==0){
            fseek(fp,ftell(fp)-sizeof(a),0);
            fwrite(&d,sizeof(d),1,fp);
            fclose(fp);
        }
    }

}

Function updateItems(): This function asks users to input the mobile number that they want to update. It searches the number in the file, and if found then it will ask the user for new contact information and pass the value into the update function which we have discussed above. If a number does not exist in the file, it simply requests the user to continue searching for another number or go back.


//Update contact details
void updateItems(){

    char pNum[MAX_NUM_SZ];
    struct data c;
    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,7);
    printf("Please enter the Mobile Phone that you want to update details");
    gotoxy(35,9);
    printf("Enter Mobile Phone:");
    getString(pNum,sizeof(pNum));

    if(searchByNum(pNum)==1){
        gotoxy(35,10);
        printf("Mobile number %s exist. Please enter new details.",pNum);
        c=readData();
        update(c,pNum);
    } else {
        gotoxy(35,11);
        printf("Mobile number %s do not exist.",pNum);
    }
    gotoxy(35,27);
    printf("Please enter any key to continue or enter ESC key to go back.");
    if(getch()==ESC){
        mainMenu();
    } else {
        updateItems();
    }
}

Function del(): This is the most interesting function among all the functions we created. I like the logic that we are using to delete files. Actually, we don't have any function to delete data from the file directly because once we allocate a block of data in a file it is not possible to remove that block of data. So in the below function, we copy all the data from the source file to the target file except the data that we want to delete. It is more like shifting memory blocks from one file to another file. After copying all the data we delete the source file and rename the target file as the source file name.

However, this technique is not efficient if the data size is huge. For huge data file, we have to find different techniques that I will leave with you for now.


//Delete data from the file
void del(char *delNumber){

    struct data a;

    fp=fopen(DATA_FILE,"rb+");
    ft=fopen(TEMP_FILE,"wb+");

    while(fread(&a,sizeof(a),1,fp)==1){
        if(strcmp(delNumber, a.mPhone)!=0){
            fwrite(&a,sizeof(a),1,ft);
        }
    }

    fclose(ft);
    fclose(fp);

    remove(DATA_FILE);
    rename(TEMP_FILE,DATA_FILE);

}

Function deleteItems(): This function requests the mobile phone number that the user wants to delete. It searches the data in the file if it exists then it deletes the data by calling del() function, if not it requests the user to continue for another number or go back.


//Delete contacts details
void deleteItems(){

    char pNum[MAX_NUM_SZ];
    char choice;
    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,7);
    printf("Please enter the Mobile Phone that you want to delete");
    gotoxy(35,9);
    printf("Enter Mobile Phone:");
    getString(pNum,sizeof(pNum));

    if(searchByNum(pNum)==1){
        gotoxy(35,12);
        printf("Mobile number %s exist. Do you want to delete it?.",pNum);
        gotoxy(35,14);
        printf("Please press y to delete or any key to skip.");
        choice=tolower(getch());
        if(choice=='y'){
            del(pNum);
            gotoxy(35,16);
            printf("Phone number successfully deleted.");
        }

    } else {
        gotoxy(35,12);
        printf("Mobile number %s do not exist.",pNum);
    }

    gotoxy(35,27);
    printf("Please enter any key to continue or enter ESC key to go back.");

    if(getch()==ESC){
        mainMenu();
    } else {
        deleteItems();
    }
}

This is the end of the code. I hope you have understood the logic implemented in the application. Please go back to the project's main page to download source code Project Main Page.

You can also watch a video about this project on YouTube.

Chapter 1: Contact Management in C | Flow Chart and Functions

2023-11-01T20:05:00.004+11:00

<<Previous Chapter Next Chapter>>

Application Flow Chart:

Functions:

We will divide the above application into two kinds of functions. The first type of function is user functions which interact with the user to get input and display output, the second type of function is operational functions which do the actual tasks.

The list of user functions is as follows:

mainMenu(): It displays the options to the user.
viewItems(): It displays the list of contact information on the screen.
addItems(): It requests the user to input contact information added to the file.
updateItems(): It requests the user to update the contact information in the file.
deleteItems(): It requests the user to delete the contact information in the file.
readData(): It requests the user to input contact information.

The list of operational functions is as follows:

view(): It fetches the data from the file.
add(): It adds the data into the file.
update(): It updates the existing data in the file.
del(): It deletes the existing data from the file.
searchByNum(): It searches the data in the file based on unique data elements. In this case, it is a phone number.
getString(): It reads the data input and saves it into the data structure.

Please find the source code up to this part below.


// Define C standard headers
#include<windows.h>
#include<stdio.h>
#include<conio.h>
#include<ctype.h>
#include<string.h>
#include "gotoxy.h"

// Define Constant Variables
#define ESC 27

// Declare functions
void mainMenu();
void viewItems();
void addItems();
void updateItems();
void deleteItems();

// C main function
int main(){
    mainMenu();
    return 0;
}

//Start function definitions

//Display user menu
void mainMenu(){


    char choice;

    system("cls");

    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("Please select the any option v, a, u, d, e or ESC");
    gotoxy(35,10);
    printf("V) View All Contact");
    gotoxy(35,12);
    printf("A) Add Contact");
    gotoxy(35,14);
    printf("U) Update Contact");
    gotoxy(35,16);
    printf("D) Delete Contact");
    gotoxy(35,18);
    printf("E) Exit application");
    gotoxy(35,20);
    printf("Please enter ESC to exit application");

    choice=tolower(getch());

    switch(choice){
        case 'v':
            viewItems();
            break;
        case 'a':
            addItems();
            break;
        case 'u':
            updateItems();
            break;
        case 'd':
            deleteItems();
            break;
        case 'e':
            exit(0);
        case ESC:
            exit(0);
        default:
            gotoxy(35,30);
            printf("Please enter options V, A, U, D, E or ESC");
            if(getch())
                mainMenu();
    }
}

//Display contacts only 15 items
void viewItems(){

    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("View Contact function selected");

    gotoxy(35,27);
    printf("Please enter ESC key to go back.");
    if(getch()==ESC){
        mainMenu();
    } else {
        viewItems();
    }

}

//Add contacts
void addItems(){

    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("Add Contact function selected");

    gotoxy(35,27);
    printf("Please press any key to continue or enter ESC key to go back.");
    if(getch()==ESC){
        mainMenu();
    } else {
        addItems();
    }
}

//Update contact details
void updateItems(){

    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("Update Contact function selected");

    gotoxy(35,27);
    printf("Please enter any key to continue or enter ESC key to go back.");
    if(getch()==ESC){
        mainMenu();
    } else {
        updateItems();
    }
}

//Delete contacts details
void deleteItems(){

    system("cls");
    gotoxy(35,6);
    printf("----Welcome to Contact Management System----");
    gotoxy(35,8);
    printf("Delete Contact function selected");

    gotoxy(35,27);
    printf("Please enter any key to continue or enter ESC key to go back.");

    if(getch()==ESC){
        mainMenu();
    } else {
        deleteItems();
    }
}

Explaining the Code:

There isn't much to explain the above code, most part of it is self-explanatory. It will display the options to the user and based on the user input the respective functions are called to do a specific task. After completing tasks user can go back to the main screen by pressing the ESC key, and select another option, or exit the application.

Also, I am using gotoxy(x,y) function to align the text. You will see this function throughout my articles. Please find the my article gotoxy in Code::blocks to learn about it.

We will add file handling code and explain it in detail in the next chapter.

You can also watch a video about this project on YouTube.

Quiz Game in C Part 3: Final Game Play and score

2020-03-28T09:24:00.004+11:00

First Page

In previous articles, we created functions, multi-dimensional character array to store questions, options, and answers. Up to this point, we have everything ready to finish gameplay.
Here we will use the following techniques:

Create for loop to display question one by one
Create another infinite loop inside for loop to check the answer given by the user. The loop breaks only if the user-provided an answer is within options (a, b, c and d) otherwise it will loop infinitely.
Calculate the score for the correct answer provided.
Use gotoxy to manage text indentation.

Here is the final gamePlay() code used in this article:

void gamePlay(){
    system("cls");
    char question[10][250];
    strcpy(question[0], "This is question no 1");
    strcpy(question[1], "This is question no 2");
    strcpy(question[2], "This is question no 3");
    strcpy(question[3], "This is question no 4");
    strcpy(question[4], "This is question no 5");
    strcpy(question[5], "This is question no 6");
    strcpy(question[6], "This is question no 7");
    strcpy(question[7], "This is question no 8");
    strcpy(question[8], "This is question no 9");
    strcpy(question[9], "This is question no 10");

    char option[10][4][50] = {
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
    };

    char answer[10]={'a','b','c','d','a','b','c','d','a','b'};
    char letter[4]={'a','b','c','d'};
    char ans;
    int score=0;

    for(int i=0;i<10;i++){
            system("cls");
            gotoxy(20,8);
            printf("%s\n",question[i]);
            for(int j=0;j<4;j++){
                if(j==0 || j==2){
                    gotoxy(20,10 + j);
                    printf("%c) %s\n",letter[j],option[i][j]);
                } else {
                    gotoxy(55,9 + j);
                    printf("%c) %s\n",letter[j],option[i][j]);
                }
            }

            do{
                gotoxy(22,15);
                printf("Please Choose Answer using key a|b|c|d: ");
                ans=tolower(getch());
                if(ans=='a'||ans=='b'||ans=='c'||ans=='d')
                    break;
            }while(1==1);

            if(ans==answer[i]){
                gotoxy(22,15);
                printf("Correct Answer!!PRESS ANY KEY TO Continue....");
                score++;
                getch();
            }else{
                gotoxy(22,15);
                printf("Wrong Answer!!PRESS ANY KEY TO Continue....");
                getch();
            }

        }
        system("cls");
        gotoxy(22,8);
        printf("You have score %d Out of 10.PRESS ANY KEY...",score);
        getch();

        mainMenu();
}

Explaining the code:

We will declare two variables "ans" and "score" to store the answer provided by the user and to store the total score.

    char ans;
    int score=0;

And two nested for loop is used to display answers and options. First for loop statement loops 10 times and another nested for loop statement loops 4 times so in total there will be 40 loops. Inside first for loop another infinite do-while loop is created to waits user input and validation. Users can provide any value outside the provided options. This scenario is handled using an infinite do-while loop it only breaks if and only the user provides the correct value.

do{
        gotoxy(22,15);
        printf("Please Choose Answer using key a or b or c or d: ");
        ans=tolower(getch());
        if(ans=='a'||ans=='b'||ans=='c'||ans=='d')
            break;
    }while(1==1);

Finally, the if-else statement is used to compare the answer provided by the user and correct answer stored in character array variables "answer".

    if(ans==answer[i]){
        gotoxy(22,15);
        printf("Correct Answer!! PRESS ANY KEY TO Continue....");
        score++;
        getch();
    }else{
        gotoxy(22,15);
        printf("Wrong Answer!! PRESS ANY KEY TO Continue....");
        getch();
    }

After completing the game, the final score is displayed and we will call mainMenu() function to direct the program to the main menu screen where the user can choose to play again or quit the game.

 mainMenu();

Quiz game in C Part 2: Multi-dimensional C array

2020-03-28T09:23:00.004+11:00

Previous Page Next Page

In this article, we will discuss the gameplay() function but not all only the usages of one dimension, two-dimension, and third dimension character array. Choosing the correct dimension of the array is very important to store information effectively. We have to display a question, four options and store the correct answer to compare the answer provided by the user. Remember these three information are connected to each other if we mismatch the order then the game will go wrong.
Here, we will declare three character array to store questions, four options, and answer in the same order of the array index.

Question is a string which is an array of character and we will ask 10 questions in total. We create a two-dimension character array, the first index is a total number of questions i.e 10 and the second index is the length of a string.

    char question[10][250];
    strcpy(question[0], "This is question no 1");
    strcpy(question[1], "This is question no 2");
    strcpy(question[2], "This is question no 3");
    strcpy(question[3], "This is question no 4");
    strcpy(question[4], "This is question no 5");
    strcpy(question[5], "This is question no 6");
    strcpy(question[6], "This is question no 7");
    strcpy(question[7], "This is question no 8");
    strcpy(question[8], "This is question no 9");
    strcpy(question[9], "This is question no 10");

We can't assign string using "=" to the two-dimension array and correct way to use it is strcpy() function.

Next, we create a three-dimension array to store four options for each question. A first index is a number of questions i.e 10, a second index is a number of options i.e 4 and a third index is the length of a string.

    char option[10][4][50] = {
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
    };

Now, we create a one-dimension array to store the answer corresponding to the questions.

    char answer[10]={'a','b','c','d','a','b','c','d','a','b'};

Here is the main menu code for the gameplay() function used in this article

void gamePlay(){
    system("cls");
    char question[10][250];
    strcpy(question[0], "This is question no 1");
    strcpy(question[1], "This is question no 2");
    strcpy(question[2], "This is question no 3");
    strcpy(question[3], "This is question no 4");
    strcpy(question[4], "This is question no 5");
    strcpy(question[5], "This is question no 6");
    strcpy(question[6], "This is question no 7");
    strcpy(question[7], "This is question no 8");
    strcpy(question[8], "This is question no 9");
    strcpy(question[9], "This is question no 10");

    char option[10][4][50] = {
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
        {"option1","option2","option3","option4"},
    };

    char answer[10]={'a','b','c','d','a','b','c','d','a','b'};
    char letter[4]={'a','b','c','d'};

            for(int i=0;i<10;i++){
            printf("%s\n",question[i]);
            for(int j=0;j<4;j++){
                printf("%c) %s\n",letter[j],option[i][j]);
            }
            printf("Answer is: %c\n",answer[i]);
        }
}

In the next part of the article, we will finalize the gameplay() function and complete the quiz game.

Quiz Game in C part 1 - Flow Chart and Main Menu

2020-03-28T09:22:00.005+11:00

Previous Page Next Page

Application Flow Chart:

Start: Quiz program start

Main Menu: Program display menu to the user to start the game or to quit.

User Input: The application stops to get user input.

Decision Tree: If user input is S then Quiz game start else if user input is Q then the program will quit.

Quiz Game: User gets 10 questions one by one and each correct score is marked as 1.

Display Score: It display final score after ending the game and the user is directed to the main menu.

Stop: End of the game.

Here is the main menu code for the Quiz game used in this article:

#include <stdio.h>
#include <conio.h>
#include <ctype.h>
#include "gotoxy.h"

/* Define variable*/
#define ESC 27

/* Function declaration*/
void mainMenu();
void gamePlay();

int main() {
    mainMenu();
    return 0;
}

/* Function definition*/
void mainMenu(){

    char choice;

    system("cls");
    gotoxy(30,8);
    printf("WELCOME TO I.Q TEST PROGRAM");
    gotoxy(30,10);
    printf("----------------------------");
    gotoxy(30,12);
    printf("Enter S to start game");
    gotoxy(30,14);
    printf("Enter Q or ESc to quit");
    gotoxy(30,16);
    printf("----------------------------");

    choice=toupper(getch());

    switch(choice){
    case 'S':
        gamePlay();
        break;
    case 'Q':
        exit(0);
    case ESC:
        exit(0);
    default:
        gotoxy(30,18);
        printf("Wrong Entry!!");
        gotoxy(30,20);
        printf("Press any key and re-enter correct option");
        if(getch())
            mainMenu();
    }
}
//Function defination
void gamePlay(){
    system("cls");
    printf("Choice S selected");
}

Explaining the Code:
Let's start digging the code. Here you will learn to breakdown application in function and using switch statements to switch between functions based on user input.

First, we will include the user define header "gotoxy.h" and system library headers "stdio.h", "conio.h" and "ctype.h". The "stdio.h" is C Standard Input Output library, "conio.h" is not a C Standard Input Output but required for user input function getch() and "ctype.h" is C Standard library required for toupper() function. To learn about "gotoxy.h" library function please follow my previous article gotoxy in codeblock.

#include <stdio.h>
#include <conio.h>
#include <ctype.h>
#include "gotoxy.h"

27 is the ASCII decimal code for the "ESC" character. In a switch statement, this value is used to check the user input "ESC" key.

/* Define variable*/
#define ESC 27

Next, we will define functions. These functions are created as per the application flow chart. In above flow chart, you can see there are three processes main menu, quiz game, and display score. Here display score process is simple and small so no need to create a separate function and it can be included in a quiz game.

/* Function declaration*/
void mainMenu();
void gamePlay();

int main() {
    mainMenu();
    return 0;
}

This is another line please :D
mainMenu() function displays user options and waits for the user input. Switch statement is used to switch the application state. If user input "S" gamePlay() function is called to start the game, else if user input "Q" program exits by calling exit(0) and if user input other then these two options then again mainMenu() function is called to return program in the current state. This technique will help to create an infinite loop, until and unless the user input correct option program will remain in the current sate.
You may have noticed that at top of each function system("cls") function is called which is used to clear screen.
Finally, gamePlay() function is the main part of this application which we will discuss in the next part.

Basic GLFW Tutorials with C++

2013-08-27T00:10:00.001+10:00

GLFW (OpenGL FrameWork) is open source library to create OpenGL Window and multi-platform too. Very easy to manage OpenGL context and event with GLFW. It is specially suitable for game development. GLFW doesn't render 3D scene for that you have to use OpenGL library function. GLFW help to create window , handle keyboard , mouse and joystick events. This tutorials is for those who are new to OpenGL and GLFW. By the end of this tutoirals series understand the basic knowledge about OpenGL and handling events with GLFW.

Tutorials 1: Setup GLFW in Code::Blocks IDE in Windows Machine

Tutorials 2: Introduction to GLFW

Tutorials 3: Drawing Basic Shapes

Tutorials 4: Transformation: Translation, Rotation and Scalling

Tutorials 5: Texture Mapping

Modern OpenGL Tutorial Series

2013-07-27T22:47:00.001+10:00

Modern OpenGL are different than ancient opengl version before 2.0. After opengl 2.0 vetex shader and fragment shader became compulsory. It is little bit difficult for beginner to start.

All chapter include basic concept of Modern OpenGL and especially focus on beginner. After going through all the chapter user can get concept of shader, drawing shapes, perspective projection, transformation, color, texture mapping and load 3D model wavefront OBJ.

Download all the code as a zip from here: https://github.com/smokindinesh/Modern-OpenGL-Series/archive/master.zip

All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

Tutorials 1: Setup Modern OpenGLin Code::Blocks IDE
Tutorials 2: Sample source code to check OpenGL setup
Tutorials 3: Introduction to Modern OpenGL
Tutorials 4: Drawing Basic Shapes
Tutorials 5: Perspective Projection
Tutorials 6: Rotation,Translation and Scalling
Tutorials 7: Playing With Colors
Tutorials 8: Texture Mapping
Tutorials 9: Load 3D model wavefront OBJ

Modern OpenGL tutorial 3D model .obj loader/parser with C++ and GLM

2013-07-27T11:00:00.000+10:00

When you need to draw a more advanced object like character, house, terrain, vehicles we can't pass the vertices by ourselves for these object so we have to use the 3D model and model are simply the meshes made of one or more number of vertices. There are many 3D modeling software one of them is blender which is open source also. Blender help to create the model and export it into different file format like .obj, 3ds, md2 etc among them I choose the .obj (wave front obj) file which is very simple. OBJ only contain vertex, normal, texture and other material information. It doesn't support animation for animation we can use 3ds, md2 3Dmodel. There are many library to load 3D model.

Download
All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

In this articles I will show you how to write your own .obj model parser.

For a quick and simplicity rather than making our own 3D model we use existing one. At first if you don't have blender then download it form here.
We will export the blender default cube in .obj format. We don't use any other material effect, texture and normal just only vertices are exported.
Open the blender you will see the default cube. You don't have to do anythings just export it in obj format.
For exporting goto file->export->wavefront(.obj) option. Give name "cube" and choose the directory where you want to export it.While exporting don't forgot to check the triangular faces which is shown in figure.

You will see two file "cube.obj" and "cube.mtl".
The .obj file contains the mesh : vertices and faces.
The .mtl file contains information about material.
Lets inspects the .obj file how it looks like. You will see pretty simple format.

# Blender v2.67 (sub 0) OBJ File: ''
# www.blender.org
mtllib cude.mtl
o Cube
v 1.000000 -1.000000 -1.000000
v 1.000000 -1.000000 1.000000
v -1.000000 -1.000000 1.000000
v -1.000000 -1.000000 -1.000000
v 1.000000 1.000000 -0.999999
v 0.999999 1.000000 1.000001
v -1.000000 1.000000 1.000000
v -1.000000 1.000000 -1.000000
usemtl Material
s off
f 1 2 3
f 5 8 7
f 1 5 6
f 2 6 3
f 3 7 4
f 5 1 4
f 4 1 3
f 6 5 7
f 2 1 6
f 6 7 3
f 7 8 4
f 8 5 4

lines starting with # are comments
o introduces a new object
v introduces a vertex
vt introduces texture coordinates
vn introduces a normal
f introduces a face, using vertex indices, starting at 1
usemtl and mtlib describe the look of the model

But in our model we doesn't see vn and vt because we haven't use it. One thing you may surprise that for making complete cube we need 12 triangles that is 12 * 3 = 36 vertex but you see there is only 8 vertex. This is because cube has only 8 corner so we only 8 vertex is enough. For representing all 12 triangles by 8 vertex we use f (face index) we can see

f 1 2 3

f 5 8 7
f 1 5 6
These are the vertex index. f 1 2 3 means vertex first, second and third makes one triangular face among the 12 triangular face of cube. Other f 5 8 7 is also similar 5th , 8th, 7th vertex makes another triangular face and so on. In this way all the 12 triangle is represented.

Our obj parser is limited it doesn't support multiple object , texture and normal. This is only for learning purpose so that we can understand how to write our own complet obj parser.For that I have created the mesh class.
mesh.h

#ifndef MESH_H
#define MESH_H
#include
#include
#include
#include
#include
#include
#include
#include
#include
#include

class Mesh
{
    public:
        Mesh();//constructor
        void LoadObjModel(const char *filename);//function to load obj model
        std::vector returnMesh();//return the vertices of mesh data
    private:
        std::vector vertices;//to store vertex information of 3D model started with v
        std::vector meshVertices;//to store all 3D model face vertices
        std::vector faceIndex;//to store the number of face index started with f

};

#endif
 // MESH_H

mesh.cpp

#include "../include/Mesh.h"

Mesh::Mesh()
{
    //ctor
}
void Mesh::LoadObjModel(const char *filename)
{
    std::ifstream in(filename, std::ios::in);
    if (!in)
        {
            std::cerr &lt;&lt; "Cannot open " &lt;&lt; filename &lt;&lt; std::endl;
            exit(1);

        }
    std::string line;
    while (std::getline(in, line))
    {

      if (line.substr(0,2)=="v "){
            std::istringstream v(line.substr(2));
            glm::vec3 vert;
            double x,y,z;
            v&gt;&gt;x;v&gt;&gt;y;v&gt;&gt;z;
            vert=glm::vec3(x,y,z);
            vertices.push_back(vert);
      }
      else if(line.substr(0,2)=="f "){
        std::istringstream v(line.substr(2));
        GLuint a,b,c;
        v&gt;&gt;a;v&gt;&gt;b;v&gt;&gt;c;
        a--;b--;c--;
        faceIndex.push_back(a);
        faceIndex.push_back(b);
        faceIndex.push_back(c);
      }

    }

 //calculate all mesh vertices using face index
for(unsigned int i=0; i &lt; faceIndex.size(); i++)
{
    glm::vec3 meshData;
    meshData=glm::vec3(vertices[faceIndex[i]].x,vertices[faceIndex[i]].y,vertices[faceIndex[i]].z);
    meshVertices.push_back(meshData);

}

}

//function for returing mesh vertex data
std::vector Mesh::returnMesh()
{
    return meshVertices;
}

This is end of chapter for my Modern OpenGL tutorial series for beginner. If you haven't follow all previous chapter then you can get here http://www.codeincodeblock.com/2013/07/modern-opengl-32-tutorial-series-with.html

Modern OpenGL tutorial Texture Mapping Example source code

2013-06-21T13:08:00.001+10:00

Texture mapping technique haven't change in Modern OpenGL. If you are experience in ancient version of OpenGL you might have done Texture mapping which is similar to here.Only difference is adding the extra variable to the vertex shader and fragment shader. Texture memory lie in video memory similar to VBO which is uploaded to OpenGL. Two things we have to pass in vertex shader and fragment shader. One is texture co-ordinate to define how to map on vertex and another texture color data to define the color of every pixel.Many article are there in internet about texture.Some of the great article are below.

Texture Maping and Bitmap This example use the OpenGL version 1.5 where VBO and VAO are absent.
Texture is not Picture Article presents whats the texture is about.
Texure This is the blog form where I learn about Modern OpenGL.

Download
All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

In this program I am going to map a texture on a square. My aim is to provide the simplest source code so that beginner can understand quickly and write there own. Code of this project is similar to my previous articles I only specify the added function. In this project I have added one library loadBMP.cpp and loadBMP.h which load the Bitmap image for texture. Function to load the texture is given below.

//Makes the image into a texture, and returns the id of the texture
GLuint loadTexture(Image* image) {
 GLuint textureId;
 glGenTextures(1, &textureId); //Make room for our texture
 glBindTexture(GL_TEXTURE_2D, textureId); //Tell OpenGL which texture to edit
 glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER,GL_LINEAR);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER,GL_LINEAR);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
 //Map the image to the texture
 glTexImage2D(GL_TEXTURE_2D,                //Always GL_TEXTURE_2D
     0,                            //0 for now
     GL_RGB,                       //Format OpenGL uses for image
     image->width, image->height,  //Width and height
     0,                            //The border of the image
     GL_RGB, //GL_RGB, because pixels are stored in RGB format
     GL_UNSIGNED_BYTE, //GL_UNSIGNED_BYTE, because pixels are stored
                       //as unsigned numbers
     image->pixels);               //The actual pixel data
 return textureId; //Returns the id of the texture
}

GLuint _textureId; //The id of the texture

static void LoadTextureMaping()
{
    Image* image = loadBMP("chessBoard.bmp");
 _textureId = loadTexture(image);
 delete image;
}

At first texture memory is resides in texture unit and then it is uploaded to OpenGL. Lets look the implementation of texture in our code.

// bind the texture and set the "tex" uniform in the fragment shader
    glActiveTexture(GL_TEXTURE0);
    glBindTexture(GL_TEXTURE_2D, _textureId);
    glUniform1i(program->uniform("tex"),0); //set to 0 because the texture is bound to GL_TEXTURE0

"tex" is the uniform sampler2D variable in fragment shader. Uniform variable is used because it value is uniform and doesn't change. Uniform variable can be used in both fragment and vertex shader. Texture can't be used whithout calling glActiveTexture after that texture is bound by glBindTexture. We call the glUniform1i to upload the texture data form texture unit to "tex" variable of fragment shader. Second argument is 0 because texture is bind in 0 texture unit.
Final step is to get the texture co-ordinate.Texture co-ordinates is pass with vertex data.

// Put the three triangle verticies into the VBO
    GLfloat vertexData[] = {
        //  X     Y     Z     U     V
         -0.5f, -0.5f, 0.0f,  0.0f, 0.0f,
         -0.5f,0.5f, 0.0f,  0.0f, 1.0f,
         0.5f,-0.5f, 0.0f,  1.0f, 0.0f,
         0.5f,0.5f, 0.0f,  1.0f, 1.0f,

    };

    glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);
    // connect the xyz to the "vPosition" attribute of the vertex shader
    glEnableVertexAttribArray(program->attrib("vPosition"));
    glVertexAttribPointer(program->attrib("vPosition"), 3, GL_FLOAT, GL_FALSE,5*sizeof(GLfloat), NULL);


    glVertexAttribPointer(program->attrib("vertTextCoord"), 2, GL_FLOAT, GL_TRUE, 5*sizeof(GLfloat),(const GLvoid*)(3*sizeof(GLfloat)));
    glEnableVertexAttribArray(program->attrib("vertTextCoord"));

You have seen in above code how I pass the texture co-ordinate in attribute variable "vertTextCoord". This is similar to my previous article Playing with color how color data are passed.
This the final output of our program.

Next Chapter: 3D model .OBJ loader/parser

Modern OpenGL tutorial Playing with color example

2013-06-21T03:51:00.000+10:00

At first have a look screen shot of our program what we have going to build.

You have seen a triangle having different color at each vertex. In previous tutorials series we are just drawing the white triangle without color.

Download
All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

For color we have just pass the 3 vertex data into VBO just like below

// Put the three triangle verticies into the VBO
    GLfloat vertexData[] = {
        //  X     Y     Z 
         0.0f, 0.8f, 0.0f,
        -0.8f,-0.8f, 0.0f,
         0.8f,-0.8f, 0.0f,
    };

    glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);
    // connect the xyz to the "vPosition" attribute of the vertex shader
    glEnableVertexAttribArray(program->attrib("vPosition"));
    glVertexAttribPointer(program->attrib("vPosition"), 3, GL_FLOAT, GL_FALSE, 0 , NULL);

Now here we are going to give a color for every vertex for that we can pass the color data by creating and binding another VBO or within same VBO with vertex data. Here we pass the color data with vertex and bind it in same VBO just like below.

// Put the three triangle verticies into the VBO
    GLfloat vertexData[] = {
        //  X     Y     Z   R    G     B    A
         0.0f, 0.8f, 0.0f,1.0f,0.0f,0.0f,1.0f,
        -0.8f,-0.8f, 0.0f,0.0f,1.0f,0.0f,1.0f,
         0.8f,-0.8f, 0.0f,0.0f,0.0f,1.0f,1.0f,
    };

    glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);
    // connect the xyz to the "vPosition" attribute of the vertex shader
    glEnableVertexAttribArray(program->attrib("vPosition"));
    glVertexAttribPointer(program->attrib("vPosition"), 3, GL_FLOAT, GL_FALSE, 7*sizeof(GLfloat), NULL);
    // connect the RGBA to the "vColor" attribute of the vertex shader and passed to the fragment shader
    glVertexAttribPointer(program->attrib("vColor"), 4, GL_FLOAT, GL_FALSE, 7*sizeof(GLfloat),(const GLvoid*)(3*sizeof(GLfloat)));
    glEnableVertexAttribArray(program->attrib("vColor"));

You can see the differences what we have added. We have passed four color value where first three are for color (RGB) and fourth for Alpha(A). You can also see the differences in the call of glVertexAttriPointer, the most important change is last two argument. Second argument is 7*sizeof(GLfloat) which means how many bytes are in between start of one value and start next value.In our data there 7 GLfloat value for single vertex where 3 for xyz vertex value and 4 for RGBA color value.While connection xyz vertex with "vPosition" attribute variable of vertex shader in argument second we are passing "3" to read 3 data for xyz single vertex but another vertex data start at 8th position after 4 color data so there is gap of 7*sizeof(GLfloat) bytes which we have to specify. Gap is always calculated in bytes not the number of value. For connection RGBA color data with "vColor" attribute variable of vertex shader which is further passed to fragment shader you can see the last argument of glVertexAttriPointer is (const GLvoid*)(3*sizeof(GLfloat)) which is offset argument which means how many bytes from the start is the first value. Our color data isn't in initial position it is after 3 bytes vertex data so we have to pass the offset value. In above while connection xyz vertex last argument offset value is NULL because the vertex data is in initial position.

Next Chapter: Texture Mapping.

Modern OpenGL tutorial Rotation, Scalling and Translation Matrix using GML (OpenGL Mathematics)

2013-06-01T03:31:00.000+10:00

In previous article perspective projection I have shown you how to do perspective projection. Now its time to do Scalling, Translation and Rotation which are very important task. In ancient version of OpenGL for these operation opengl provide funcition like glRotate, glScale, glTranslate but in modern opengl this function are not available so we are using GLM (OpenGL Mathematics) for doing such task. From this article I have change the source code with OOP. I have made two reusable classes Program and Shader.

Download
All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

GLM function for rotation, scalling and translation is given below.

// Projection matrix : 45° Field of View, aspect ratio, display range : 1 unit <-> 200 units
    projectionMatrix = glm::perspective(45.0f, (float)SCREEN_SIZE.x / (float)SCREEN_SIZE.y, 1.0f, 200.0f);
    glUniformMatrix4fv(program->uniform("prespective"),1,GL_FALSE,glm::value_ptr(projectionMatrix));
    // Camera matrix
    viewMatrix       = glm::lookAt(
                            glm::vec3(0,0,1), // Camera is at (4,3,3), in World Space
                            glm::vec3(0,0,0), // and looks at the origin
                            glm::vec3(0,1,0)  // Head is up (set to 0,-1,0 to look upside-down)
                            );

    glUniformMatrix4fv(program->uniform("camera"),1,GL_FALSE,glm::value_ptr(viewMatrix));
    // Model matrix : an identity matrix (model will be at the origin)
    modelMatrix= glm::mat4(1.0f);// Changes for each model !
    modelMatrix= glm::translate(modelMatrix,glm::vec3(0,0,-5));//translating to negative z-axis
    modelMatrix= glm::scale(modelMatrix,glm::vec3(2,2,2));//scalling by 2x
    modelMatrix= glm::rotate(modelMatrix, -rotationAngle, glm::vec3(0,0,1));//rotating in clockwise direction

    glUniformMatrix4fv(program->uniform("model"),1,GL_FALSE,glm::value_ptr(modelMatrix));

For continuous rotaton, to update the value of rotationAngle I have made the update function.

    // update the scene based on the time elapsed since last update
    void Update(float secondsElapsed) {
    const GLfloat degreesPerSecond = 100.0f;
    rotationAngle += secondsElapsed * degreesPerSecond;
    while(rotationAngle > 360.0f) rotationAngle -= 360.0f;
}

Next Chapter: Playing with Color

Setup GTK project in Code::Blocks (windows 7)

2013-06-01T02:04:00.000+10:00

Follow the following step to setup GTK project in Code::Blocks (windows 7)

step 1: Download gtk+-bundle_2.24.10-20120208_win32.zip (all-in-one bundle) from http://www.gtk.org/download/win32.php

step 2: Extract it in c drive creating new directory or any other place. In my case C:\GTK is the directory where I extracted the zip file.

My extracted files looks like below.

step 3: Now Open Code::Blocks , create new project , from project wizard slect GTK project. And click go.

Give project name "GTKsample" or give name of your choice. And click next.

Give path C:\GTK for GTK location where you extracted the zip file. And click Next.

And click Finish.

After creating gtk project you will see the sample program then build project, build must be successful.

step 4: This is last step, upto step 3 build project must be successful. When you try to run the project you will get message something .dll file (runtime library) missing like below image because we haven't given path for runtime library(.dll file).

For this goto the C:\GTK directories where you extracted the zip file. Open the bin folder only copy all the .dll file and paste it in your project directory GTKsample\bin\Debug\ with project executable file.

In this method every time you create the project you have to keep all the .dll file with project executable file i.e (inside project \bin\Debug\ folder). If you don't want this then copy and paste all the .dll file from bin folder to C:\windows\system32 directory.

If you completed the step 4 then the project. You must have successfully running project like below image.

Finally if you see the successfully running project like above image then you became successful to setup GTK project in Code::Blocks. If any problem occurs please comment below.

Modern OpenGL tutorial Perspective Projection using GLM (OpenGL Mathematics)

2013-05-20T02:01:00.000+10:00

In my previous article you may notice that in vertex data for drawing a triangle, I have fixed the co-ordinate of z-axis to 1. If you change the value of z-axis greater than 1 or less than -1 then Image will not render on the screen because we haven't define the perspective projection matrix. In this project we are using GLM , in previous article there is no especial use of it so I haven't talk about it before but here we use GLM function for perspective projection .GLM is header only library made by heavy use of C++ templates due to which performance can be reduce but make programming easier. GLM can be use with GLSL easily so we are using GLM.

Download
All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

I will explain the only GLM part other things are similar to previous article . At last you can download the complete source code.
GLM variables are:

glm::vec2 SCREEN_SIZE(800, 600);//screen size
glm::mat4 projectionMatrix; // Store the projection matrix
glm::mat4 viewMatrix; // Store the view matrix
glm::mat4 modelMatrix; // Store the model matrix

Now defining the projectionMatrix , viewMatrix and modelMatrisx:

// Projection matrix : 45° Field of View, 4:3 ratio, display range : 0.1 unit <-> 100 units
    projectionMatrix = glm::perspective(45.0f, (float)SCREEN_SIZE.x / (float)SCREEN_SIZE.y, 1.0f, 200.0f);
    // Camera matrix
    viewMatrix       = glm::lookAt(
    glm::vec3(0,0,3), // Camera is at (4,3,3), in World Space
    glm::vec3(0,0,0), // and looks at the origin
    glm::vec3(0,1,0)  // Head is up (set to 0,-1,0 to look upside-down)
    );
    // Model matrix : an identity matrix (model will be at the origin)
    modelMatrix      = glm::mat4(1.0f);  // Changes for each model !
    // Our ModelViewProjection : multiplication of our 3 matrices

    // Remember, matrix multiplication is the other way around
    glm::mat4 MVP        = projectionMatrix * viewMatrix * modelMatrix;

    // Get a handle for our "MVP" uniform.
    // Only at initialisation time.
    GLuint MatrixID = glGetUniformLocation(programId, "MVP");

    // Send our transformation to the currently bound shader,
    // in the "MVP" uniform
    // For each model you render, since the MVP will be different (at least the M part)
    glUniformMatrix4fv(MatrixID, 1, GL_FALSE, &MVP[0][0]);

Now our vertex shader:

#version 150 core

in vec3 vPosition;
uniform mat4 MVP;

void main()
{
gl_Position = MVP*vec4(vPosition,1.0);
}

Now I will explain the code a little. In function glm::perspective first argument is angle made by viewer eye and screen. Try to change its value form 45 to other and see what difference you observe. Second argument is aspect ratio of your screen. Third and forth value is near and far points it means all vertex point between them are render other vertex point are not render. So your vertex point should not be too small than near value i.e 1 and too big than far value i.e 200.
The function glm:lookAt is used to setup camera matrix. First argument is camera vector, second eye vector and third one is up vector ( the direction of your head )

Next Chapter: Rotation,Translation and Scalling

Modern OpenGL tutorial Drawing the basic shapes

2013-05-18T20:40:00.003+10:00

This article is almost similar to my previous tutoirals series. In previous article we draw only triangle but here we are drawing other shapes.

Download
All the code in this series of articles is available from github: https://github.com/smokindinesh/Modern-OpenGL-Series You can download a zip of all the files from that page, or you can clone the repository if you are familiar with git.

Vertex data for drawing is given below:

// Put the 18 triangle verticies into the VBO
    GLfloat vertexData[] = {
        //  X     Y     Z

        //Pentagon
        0.25f, 0.25f, 1.0f,
        0.75f, 0.25f, 1.0f,
        0.25f, 0.5f, 1.0f,

        0.25f, 0.5f, 1.0f,
        0.75f, 0.25f, 1.0f,
        0.75f, 0.5f, 1.0f,

        0.25f, 0.5f, 1.0f,
        0.75f, 0.5f, 1.0f,
        0.5f, .75f, 1.0f,

        //Triangle
        -0.25f, 0.25f, 1.0f,
        -0.5f, 0.75f, 1.0f,
        -0.75f, 0.25f, 1.0f,
        //Trapezoid
        -0.2f, -0.25f, 1.0f,
        -0.35f, -0.75f, 1.0f,
        0.35f, -0.75f, 1.0f,

        0.2f, -0.25f, 1.0f,
        -0.2f, -0.25f, 1.0f,
        0.35f, -0.75f, 1.0f,
    };

Above you can see we are using three triangle to draw Pentagon and two triangle to draw Trapezoid.
Now we have to change little things in render function. OpenGL function to render the scene is

// draw the VAO
    glDrawArrays(GL_TRIANGLES, 0, 3);

The third argument is 3 that means to draw triangle we are passing only 3 vertices. But we are going to draw other shapes and total vertices are 18. So, we have to pass 18 in third argument.

// draw the VAO
    glDrawArrays(GL_TRIANGLES, 0, 18);

Output of the program:

Next Chapter: Perspective Projection