Annie Conda added this page on March 15, 2023

Let's begin your first challenge for Level 3!

You're going to add a score to the game, so you can try to get all the questions right. When the game ends, you'll display the score!

To find the Level 3 Challenge 1 code template, open the Level 3 folder, the Challenges folder, and then the Challenge 1 folder. If you're using VS Code, you should already have the files downloaded onto your computer (see Load the IncrediCoders Files). Open the ClassroomQuizChallenge1.py file in Visual Studio Code to build the program by following along with my instructions below!

On Line 1, from init import * initializes the program by running the init.py file. This file includes code that sets up the file path for the images and text file, gets the fonts ready for this game, sets the window size, and loads the images. This statement allows you to use all the information in that file, for the rest of your program.

On Line 3, you'll see the comment, #We pull each line of text from the file into a list. As usual, comments don't do anything when you run the code (they just tell you information when you're looking at your files, so that you can remember what code does or explain what it does to someone else who is looking at the file). This comment tells you what you will be doing for the next line (for Line 4). In this case, you'll pull the text out of a file and put it into a list.

On Line 4, the code TRIVIA = read_file('Assets/Trivia.txt') takes the trivia text from the file and puts it in the TRIVIA list.

On Line 6, you'll see the comment, #We now have a list that holds our current question, correct answer, and the two wrong choices, in that order. This comment is explaining what Line 4 just did.

On Line 7, we also have another comment, #We use these variables to display text on the screen.

On Line 8, question = TRIVIA[0] creates the question variable for the first quiz question. This game updates the question variable each time that it asks a different trivia question. The code on Line 8 assigns the question text in the 0 index position of the TRIVIA list, to the question variable.

Remember, back on Line 4, you assigned every line from the Trivia.txt file into the TRIVIA list, where each line from the TXT file is assigned to a different index number (such as TRIVIA[0] and TRIVIA[1]). This means that the first line in the text file gets placed into the TRIVIA[0] index position.

On Line 9, answer = TRIVIA[1] creates the answer variable and assigns text from the TRIVIA[1] index position into the answer variable.

Note that the second line of text from the Trivia.txt file was assigned to the number 1 index position in the TRIVIA list. It's the correct answer to the first question.

On Line 10, wrong_choice_1 = TRIVIA[2] creates the wrong_choice_1 variable. The text from the TRIVIA[2] index position is assigned to the wrong_choice_1 variable. That's the third line of text from the Trivia.txt file and the first incorrect answer.

On Line 11, the code wrong_choice_2 = TRIVIA[3] creates a variable for the second wrong choice (wrong_choice_2). The text from the TRIVIA[3] index position is assigned to this wrong_choice_2 variable. That's the fourth line of text from the Trivia.txt file and the second incorrect answer.

There is no code on Line 12 (just a space to divide the sections).

On Line 13, ANSWER_CHOICES = [answer, wrong_choice_1, wrong_choice_2] creates a new list called ANSWER_CHOICES, using the variables that we just made on Lines 9-11. The first place in this ANSWER_CHOICES list is the correct answer, the second place is the first wrong choice, and the third place is the second wrong choice.

On Line 14, you'll see the code, randomize_answers(ANSWER_CHOICES) #Shuffles the first set of answer choices. This randomizes where the answer and the wrong choices are when displaying the three choices to the user. This way, the user doesn't know where the correct answer is, and each time you play the game, the answers might be in a different order, so you can't memorize which position the correct answer was in, and also this way, the correct answer isn't always in the same position (such as at the top).

On Line 16, line_number = 0 creates the new variable line_number and sets it to 0. This variable is used to count the line number that the code is currently processing in the Trivia.txt file. The variable is used to know when you complete the trivia questions and then ends the game.

On Line 17, number_of_questions = 12 creates a new variable number_of_questions, which is the amount of questions that there are going to be in the game. In this case, the number of questions is set to 12.

On Line 18, you'll see the code comment, #TODO: Uncomment this line to add the variable of score. You'll uncomment the next line, Line 19, to add the "score" variable.

On Line 19, you'll see the code, #score = 0 #Records the correct answering. As the comment on Line 18 mentioned, make sure you remove the # hashtag at the front/left of the line. This allows the code to run. This line creates the score variable and sets it to 0.

On Line 21, you'll see display_intro_screen() #Displays the intro screen. This is a function that opens the introduction screen at the beginning of the game. This screen just says, "Welcome to the Trivia Game!" This is to let the player know a little bit of context about the game. Under that, it says, "Click here to start." It's often valuable to have this kind of introduction screen so that the player can prepare themselves before starting the game. They know that the game starts as soon they click the text to start the game. (It would suprise the player if the game started right away.) The code comment (#Displays the intro screen) describes what the code does. Comments like these are helpful for when someone else sees your code, and it might not be as obvious to them what your code does.

On Line 23, running = True creates the new running variable and sets the variable to the True value. This sets up the running variable for the while loop on Line 26, so that the game will run as long as the variable running is set to True. When it's time for the game to stop running, you will just set the variable to False instead, which we do on Line 31, and later you'll also do this on Line 73.

On Line 25, you'll see the comment, #This displays the question screen until the last question or until the player closes the window. This is a commented line that will not run in the code, but it tells you that the next lines of code (in the while statement that starts on Line 26) will show you the question screen. This is the screen that displays each question and the possible answers. After the player gets the question right or wrong, then an image of Mrs. Codala appears over the screen. So the player stays on this screen througout the entire game. The player stays on the question screen until the last question or until the player closes the window.

On Line 26, while running: starts the while loop. The code in this while loop (Lines 27-78) will keep running as long as the running variable is still set to the True value, which the code sets up back on Line 23. As long as the value is True, once Line 78 runs, then the code starts again on Line 27 and runs again.

On Line 27, you'll find the code display_question(question, ANSWER_CHOICES) #Displays the new question and the three answer choices. As the comment describes, this function displays the new question and the three answer choices, which it pulls from the question variable and the ANSWER_CHOICES[] list.

On Line 28, EVENTS = pygame.event.get() creates the EVENTS list and sets the list to the values that come from the pygame.event.get() function. These events are mouse clicks that come from the player, either on the window's close button or on one of the answers.

On Line 29, for event in EVENTS: is a nested loop, which means it is a loop within another loop. In this case, it's nested within the while loop that starts on Line 26. The following code (Lines 30-78) will run until there are no more events in the EVENTS list.

On Line 30, you'll see if event.type == pygame.QUIT: #If the player clicks the Close button, it exits the game. This is an if statement that checks to see if the player clicked the close button or not. If the player clicks the close button on the window, then it is recorded as a pygame.QUIT event. The program will then run the next line.

On Line 31, running = False sets the variable running to False, which exits the while loop and closes the program.

On Line 32, mouse_position = pygame.mouse.get_pos() sets the variable mouse_position to the coordinates of where your mouse is on the screen. This value is set by the pygame.mouse.get_pos() function.

On Line 33, you'll see the code and comment, if event.type == pygame.MOUSEBUTTONDOWN: #If the player clicks the mouse. This is another nested if loop like Line 30, and this line will run whenever the player clicks the mouse button.

On Line 34, you'll see the comment, # Check to see if player has clicked on one of the possible answers. This comment describes what the next line, Line 35, is about to do.

On Line 35, we've got a longer if statement: if answer_1_rect.collidepoint(mouse_position) or answer_2_rect.collidepoint(mouse_position) or answer_3_rect.collidepoint(mouse_position): This statement is checking whether the player clicks any of the three answers. If so, then the rest of the code runs, moving on to Line 36, to check if the player clicked the first answer. If the player didn't click any of the three possible answers, then the game is essentially waiting for the player to click the mouse again (see Line 33), to progress the game forward.

On Line 36, you'll see the code, if answer_1_rect.collidepoint(mouse_position): #If the player clicks the 1st answer on the top. This is another nested if loop that checks to see if the answer selected was the first answer on the top. If so, the program then runs the indented code below Line 36, which is Lines 37-42. It's going to check whether the answer is correct or not.

On Line 37, you'll see the code if ANSWER_CHOICES[0] == answer: #If it's the correct answer. This is checking if the answer variable (with the correct answer in it) is equal to the 0 placement in the ANSWER_CHOICES[] list. If so, the answer is correct! The program then runs the indented code below it, which is Lines 38-40.

On Line 38, you'll find the comment, #TODO: Uncomment this line to add 1 score. This is a comment that doesn't run in the program. It is helping show that you'll need to uncomment (remove the hashtag) of the next line of code, in order to run it.

On Line 39, uncomment #score += 1 #The player gets one score, by deleting the first hashtag, at the beginning of the line of code. The program will then run the code (score += 1), which will add one point to the player's score.

On Line 40, you'll find the code, display_codala(correct_a, "correct_text") #Displays codala and text for correct answer. This line displays the image of Mrs. Codala with her text bubble saying that the player got the answer right.

On Line 41, you'll see else: # If it's an incorrect answer. The only part of this line that is code is "else:". The code indented under this line (Line 42) runs only if Line 37 isn't true. That means that Line 42 is going to run if the first answer is not correct. (Line 37 checks to see if the first answer is correct, after the player clicks on the first answer, which is what Line 36 checked for.)

On Line 42, you'll see the code, display_codala(incorrect_a, "incorrect_text") # Display codala and text for incorrect ans,wer. If the answer is incorrect, the image of Mrs. Codala will be displayed with a text bubble saying that the player got the answer wrong.

On Line 43, you'll find the code, if answer_2_rect.collidepoint(mouse_position): # If the player clicks the 2nd answer. Similar to Line 36, the program will run the next line if the player selects the second answer from the top (the middle answer).

On Line 44, if ANSWER_CHOICES[1] == answer: checks if the second answer is correct. If it's correct, then the indented code below this line will run (Lines 45-47).

On Line 45, you'll find the comment, #TODO: Add 1 score. This is something for you to do on Line 46.

NEW CODE: On Line 46, you are going to write your own code to add one point to your score. See the next section, "Write Your Own Code", for guidance.

On Line 47, the code display_codala(correct_b, "correct_text") runs if the second answer is correct. The image of Mrs. Codala is then displayed with her text bubble that says that the player got the answer right.

On Line 48, else: runs if Line 44 isn't true, which means the second answer is incorrect. Then Python runs the indented code on Line 49.

On Line 49, display_codala(incorrect_b, "incorrect_text") shows that the second answer was incorrect. The image of Mrs. Codala is displayed with her text bubble saying that the player got the wrong answer.

On Line 50, you'll see if answer_3_rect.collidepoint(mouse_position): # If the player clicks the 3rd answer. This line checks to see if the player selected the third answer. If so, then program runs Lines 51-56.

On Line 51, if ANSWER_CHOICES[2] == answer: checks if the third answer is correct. If it is correct, the program runs Lines 52-54.

On Line 52, you'll find the comment, #TODO: Add 1 score. This is similar to Line 39, but this time you're going to write the line of code.

NEW CODE: On Line 53, you are going to write your own code to add one point to your score. For instructions, see the next section, "Write Your Own Code."

On Line 54, display_codala(correct_a, "correct_text") shows the image of Mrs. Codala, with her text bubble saying that the player got the correct answer.

On Line 55, the else: statement runs if the third answer is incorrect. If the answer is wrong, then the program runs Line 56.

On Line 56, display_codala(incorrect_a, "incorrect_text") shows the image of Mrs. Codala, with her text bubble saying that the player got the answer wrong.

Now you're going to write some code!

First, let's go all the way back to Line 19. If you haven't yet, remove the # hashtag so that the line runs. Without the # symbol at the front of the line, the line should now look like this:

score = 0 #Starts the score at zero

That line creates the variable score and assigns 0 to it. It will later increment by one (the number one is added to it) each time the player gets an answer right!

Next is Line 46. First, look back to Line 39 for an example of how to add one point to the score. It's the same line of code! On Line 46, type in the score variable. Then include a space and add the += symbol. This assigns an incremented value to the score. Then add another space and type the number _1_.

Just like Line 39, the final line of code for Line 46 should look like this:

score += 1

Now you'll write that line of code again on Line 53! On Line 53, make sure your indentation lines up with the code comment on Line 52. Type the score variable, the += symbol, and then the number 1. Your line of code should look the same as Lines 39 and 46. This time you're adding a point to the player's score if they selected the third answer and it was the right answer!

On Line 58, you'll find the comment, #TODO: Check if it's the last question and display end screen with scores. Next, you'll write the code that ends the game when you run out of questions. This is going to be on Lines 60-73.

On Line 59, you'll see the code comment, # Modified from the check_if_last_question function in init.py. This is an example of a developer writing a note so that a future developer can understand where they got the code from.

On Line 60, you're going to write an if statement that checks if the line_number variable is greater or equal to the number of lines in the text file. Make sure Line 60 is indented at the same level as Lines 58-59, and then add your code to Line 60:

1. Type if to get the if statement started!
2. After a space, type in the line_number variable.
3. After a space, type in the >= symbol. This symbol means that the value to the right of the symbol needs to be more or the same as the value to the left of it, or else this if block of code won't run.
4. After a space, add the () parentheses, which groups together the logic of the math that's about to be done.
5. In the parentheses, type in the number_of_questions variable.
6. After a space, add the * symbol, and then add the number 4. This is all still in the parentheses. This equation multiples the value of the number of questions in the file by four, since there are four lines text in the file for each question.
7. Add -4 at the end of the line.
8. Add the : colon at the end of the line.

Once you're done, Line 60 should look like this:

if line_number >= (number_of_questions * 4)-4:

This checks if you ran out of questions in your text file!

Line 61 displays the image on top of the background, with Mrs. Codala saying that the game is over. Make sure you're lined up with the code comment on Line 62, and then type in this code on Line 61 to call the function that displays the end screen:

display_challenge1_end_screen()

When the game runs out of quiz questions, the end screen opens up and shows the players their scores. If they want to play the game again, they'll need to close the game and run the game again, to try to beat their scores.

On Line 62, you'll find the code comment, # Display the final score on the end screen. You'll write the code under this line to show the player's final score. You'll often see comments like this in code. When someone reads your code, comments like this will tell them what each section of code does.

On Line 63, you're going to write an if statement with conditional logic. Conditional logic is a fancy way of saying that the code in this block (the code that's indented under it, which will be just Line 64) only runs if this if statement is correct (if it's true). Specifically, you're going to check if the player got all the questions correct (where their score of questions that they got right is equal to the total number of questions).

Make sure you're indented at the same level as the code comment on Line 62, and then on Line 63:

1. Type if and then add a space.
2. Type in the score variable, and then add a space.
3. Type in the == (equals to) symbol of two equals symbols. Add a space.
4. Type in the number_of_questions variable, and then add a colon at the end of the line.

In case you were wondering, you use the "equals to" symbol (==) in an if statement like this, when you're comparing two values. In this case, we're comparing whether the numbers in two variables are the same.

You just wrote the if statement that will check if the player's score is the same as the number of questions they answered. If that's the case, then next we'll write up a message that tells the player that they got all the answers right!

Note that we checked to see if the variables have the same value (if the score variable is equal to the number_of_questions variable), and we didn't check to see if the score is a specific number (for example, if the score variable is equal to 12). The reason is so that we can change the value of that variable in one place. For example, if we added a question, and there were now 13 questions instead of 12. Now we can just add questions to the text file. The code will still work the same, even if there are more questions!

Here's what the final line of code looks like:

if score == number_of_questions:

On Line 64, indent to the right (at the same level as Line 56), and type in the score_text variable. Add a space, and then type in the = equal symbol. Add another space, and then type in the my_font.render() function.

Here's where it gets a little challenging. What? You thought we called this thing a Challenge for fun? Okay, inside the function's parentheses, type in the first part of the string:

"You got a perfect score! "

Notice that there's an extra space before the end parenthesis. That's on purpose, so that you can add in a variable next, and it will show up with a space before it.

Next, still on Line 64:

• Add a space, type in a + plus symbol, add another space, and then type in str(score) to show the score variable as a string.
  • The str() code is casting the variable as a string, so that the score number displays on the screen with the rest of the text.
  • The + operator is gluing the strings together so that it acts like one long string (or set of characters) that displays on the screen. In programming, we call this process concatenation.
• Add a space, type in a + plus symbol, add another space, and then type in " / " with the spaces. This is another short string that shows the slash symbol on the screen, so that the player sees how many questions they got right, such as "9 / 12" for example.
• Add a space, type in str(number_of_questions) and then type in a comma (,).
  • The code str(number_of_questions) will convert (or cast) the value of the number_of_questions variable as a string. In other words, if the value of the variable is 12, then "12" appears on the screen.
  • You added the comma because that's the end of the string or characters that you're going to display on the screen! You're going to pass two more arguments into the my_font.render() function.
• Add a space, type in True, and then type in a comma (,).
  • The True argument makes the text appear better on the screen. Pygame gives the text antialiasing, which means that it smooths out the edges of the text.
• Finally, type in (0,128,0) and make sure your function ends with a ) end parenthesis.
  • This sequence of numbers is an argument (information passed to the function) that tells Python the color of the font. These numbers are codes that represent the RGB (Red, Green, Blue) color values.

That's a long line of code! Here's what Line 64 looks like when it's done:

score_text = my_font.render("You got a perfect score! " + str(score) + " / " + str(number_of_questions), True, (0,128,0))

On Line 65, make sure you're aligned with Line 63, and then type elif to get the line started. Next, add a space and type score == 0: If the score is equal to 0 (zero), then that means the player got all the questions wrong!

On Line 66, you're going to write the same code that you wrote on Line 64. Make sure your code is lined up with Line 64. Here are the changes to make:

• Change the first string to instead say, "Woops! All the answers were wrong. " Be sure to include the space before the end quote!
• Change the three RGB color values at the end of the line, from (0,128,0) to (255,0,0) instead. This time, the text is going to be in red instead of green (because the player got all the answers wrong).

Here's what Line 66 should look like:

score_text = my_font.render("Woops! All the answers were wrong. " + str(score) + " / " + str(number_of_questions), True, (255,0,0))

On Line 67, make sure you're indented at the same level as Lines 63 and 65, and then type else: This will make it so that Line 68 runs if Lines 63 and 65 are not true. In other words, Line 68 runs if the player got more than 0 and less than 12 answers correct.

On Line 68, make sure you're indented at the same level as Lines 64 and 66, and then start with the code you completed for Line 66. Change the beginning part of the string to "You got " instead. (Be sure to include the space before the end parenthesis.) And then change the RGB values at the end of the line to (0,128,0) so that the text displays green. This RGB value is the same as it is on the end of Line 64.

On Line 69, make sure you're aligned with Line 67, and then type in the screen.blit() function. In the parentheses, type in the score_text variable, add a comma, add a space, and then type in (200,90) as the XY coordinates for displaying the text score. Make sure the line ends with the end parenthesis. This code displays the score.

The final code on Line 69 should look like this:

screen.blit(score_text, (200,90))

On Line 70, type in pygame.display.update() to update what's on the screen.

On Line 71, type in pygame.event.get() to receive the event input, which in this case is a mouse click.

On Line 72, type in the time.sleep() function. And then type 5 into the parentheses. This tells Python to delay for five seconds before running the next line of code (Line 73), which closes the game's window. In other words, after the score displays, the game closes after five seconds.

On Line 73, set the running variable to False so that the program closes. Make sure you're lined up with Line 72, and then type the running variable, add a space, type in the = symbol, add another space, and then type in False.

On Line 75, you'll see the commented line, # We display the next question after an incorrect or correct answer has been chosen.

Line 76 checks to make sure the game is still running. If so, Line 77 runs to move to the next question in the TXT file.

On Line 79, the else: statement runs if the game is not running (if it's the last question in the game). Then Line 80 displays the image of Mrs. Codala, to tell you that you finished the game.

That's it! You did it!

I included a solution file for Level 3, Challenge 1. This file has all the code filled in, so if you run into any issues with your code (for example, if it doesn't compile/run, or if something isn't working correctly in your program), then you can take a look at the final code file to see what you did differently:

• Classroom Quiz Challenge 1 - Solution file

IMPORTANT: Please don't cheat yourself! Finish the game first!

Next, you can take on Level 3, Challenge 2! This is a challenge where you add in another incorrect answer that will create a total of four choices!

• Challenge 2

In addition to this Help page and the instructions for our Level 3 challenges, we also have Online Articles, a Learning Quiz, an Unplugged Activity, and a Rewards article:

• Level 3: Help - This page helps you complete the instructions in the book, in case you get stuck.

• Level 3: Challenge 1 - On this page, I show you how to add a score to the game, so you can get all the questions right, then when the game ends, displaying the score.

• Level 3: Online Articles - I made you a list of different web pages I found, which will help you learn more about the Classroom Quiz.

• Level 3: Learning Quiz - I wrote some questions in case you want to quiz yourself about what you learned. Or you can teach others and quiz them!

• Level 3: Unplugged Activity - I wrote this page with more details than what you saw in the book. In this game you pick a character and an animal with your friend, then you flip a coin and if it lands on heads, you will act like your character and if it lands on tails, you will act like your animal!

• Level 3: Rewards - If you completed the Classroom Quiz project that we talked about, then I set up this page to act as a reward. You can see some illustrations of me and learn more about who I am! You'll also find the Bow Award digital download, to show off your accomplishment!

After you're completely done with Level 2 (did you do the challenges?), then it's time to move on to Level 4! While you read through Level 4 in your book, you can check out the resources from Sidewinder, as she teaches you how to build the Space Wars program:

• Level 4: Space Wars: All Online Resources