Assignment 4.3: Dialog Trees - 3D Games

An introduction to dialog trees in 3D games

Goals

In this assignment, we will practice the following computer science concepts

  • Writing action headers for actions with parameters
  • Writing actions with parameters
  • Calling actions with parameters

Common Core Standards

  • English Language Arts Standards ยป Science & Technical Subjects: CCSS.ELA-Literacy.RST.9-10.2, CCSS.ELA-Literacy.RST.9-10.3, CCSS.ELA-Literacy.RST.9-10.4, CCSS.ELA-Literacy.RST.9-10.5, CCSS.ELA-Literacy.RST.9-10.6, CCSS.ELA-Literacy.RST.11-12.2, CCSS.ELA-Literacy.RST.11-12.3
  • Standards For Mathmatical Practice: CCSS.Math.Practice.MP1, CCSS.Math.Practice.MP2, CCSS.Math.Practice.MP5, CCSS.Math.Practice.MP6, CCSS.Math.Practice.MP7, CCSS.Math.Practice.MP8

Computer Science Principles Curriculum

  • Big Idea: Programming:EU 5.1, LO 5.1.3, EK 5.1.3B
  • Big Idea: Programming:EU 5.3, LO 5.3.1, EK 5.3.1A
  • Big Idea: The Internet:EU 6.1, LO 6.1.1, EK 6.1.1A, EK 6.1.1B, EK 6.1.1C, EK 6.1.1D, EK 6.1.1E
  • Big Idea: The Internet:EU 6.2, LO 6.2.2, EK 6.2.2D, EK 6.2.2E, EK 6.2.2I
  • Big Idea: Global Impact:EU 7.1, LO 7.1.1, EK 7.1.1A

Vocabulary

  • Non-Player Character (NPC)
  • Dialog
  • Parameter
  • Action Header
  • Action
  • Return Value
  • Button
  • Label
  • KeyboardListener
  • MouseListener
  • Action call
  • Version Control
  • Git
  • me

Overview

In this assignment, we will write a program to create a dialog between a player and a NPC (Non-Player Character). Depending on the player's choices, the program will put different objects on the screen. We will use a KeyboardListener and a MouseListener as well as several User Interface elements like Button or Label for the interaction between the player and the NPC. We will use different actions with parameters to write this program. A parameter is a variable or an object that is passed to an action which allows the action access to the variable/object. Download this Dialog Tree Program Template to complete in this lesson.

Goal 1: Write action headers

An action header will mark the beginning of the action and give important information about the action. It defines the action name, the number and the types of parameters the action requires, and the type of the return value if there is one. Our actions for this lesson should be written after the end of the CreateGame action. The word end marks the end of an action.

Example: the action ChooseShape() header

This example shows how to write the ChooseShape action header. You must put the word action first then the name of this action with the different parameters in parentheses. You can also add a return value by putting, after the parentheses, the word return and the type of the return value (this is not necessary in our case).

// this action will change the shape put on the screen depending on the boolean parameter (true for a box and false for a cylinder)
action ChooseShape(boolean shapeType)

end

Activity: Write action headers

In the main.quorum class, you must create 3 new actions which are ChooseShape, ChooseColor and ChooseItem. To do that put the term action before the name of this action. After the name you must define the different parameters in bracket (their type then their name).

  • For the action ChooseShape it will be a boolean parameter which will define if the shape is a box (if it is true) or a cylinder (if it is false).
  • For the action ChooseColor it will be a text parameter which will define if the color of the shape which can be blue (if the user writes blue), red (if the user writes red) or green (if the user writes green).
  • For the action ChooseItem we will use an integer parameter. This will define if the item (which is a model) will be a sword (if the user chooses the button "1:sword", a stick (if the user chooses the button "2:stick" or a bow (if the user chooses the button "3:stick".

Goal 2: Implement actions

Now we have to define the operation of this action. We write the code for everything our action will do between our header and the word end.

Example: Implementing the action ChooseShape()

This example shows how to implement the ChooseShape action. The first line of this action will remove the old model and create a new one at the same position. This is necessary, because if we don't do this the old model will stay on the screen above the new one. Next, we use the a new model to load a box or a cylinder depending on user choice (which we get from the parameter of this action). To finish, we change the variable model with the new one, add it and show it. Since we need to know the shape choice in other parts of the program, we save it in a class variable (shape).

//This action is used to give to the player the choice of shape he wants
action ChooseShape(boolean shapeType)
    Remove(model)
    Model newModel
    newModel:SetPosition(8,-15,10)

    if shapeType                    // equivalent to : if shapeType = true
        //Load Box
        newModel:LoadBox(3,3,3,color)
    else
        //Load Cylinder
        newModel:LoadCylinder(3,3,3,color)
    end
    model = newModel
    Add(model)
    model:Show()
    shape = shapeType
end

Activity: Build different actions

In this activity you will write 3 actions: action ChooseShape(boolean shapeType) has been written for you in the example above. Use that example to implement the remaining action, action ChooseColor(text colorName). In this action, you will change the color of the model depending on the text parameter. You have to do two things:

  • Write a condition with 3 possibilities which correspond to the text of the 3 possible colors: "blue", "red" and "green" in this case. In each case, change the variable color with the chosen color. For example: color = color:Blue() (there are similar Color actions Red() and Green().
  • The second thing you have to do is to change the model with the new color, this would be done just like in ChooseShape() Because it is better to reuse code we have already written, we will simply call the ChooseShape() action to complete this action. This will be done in Goal 3's Activity.

Next, write action ChooseItem(integer item)

In this part, you will put an item on the screen which will replace the previous shape. This item can be any of three objects (a sword, a stick, or a bow) but each item will have the same color and shape as the previous shape. In fact, it will be made of several shapes which are either boxes or cylinders in the chosen color).

  • To begin, you must "erase" the old model with model:Hide() because if you don't, the shape will stay on the screen above your item (This is an another way to achieve the same results as using Remove() on the old model and then Add() the new model). Then you need to choose which item will be put on the screen
  • Write another condition with three possibilities depending on the chosen number (contained in the integer parameter): 1 to put a sword, 2 to put a stick and 3 to put a bow. For all the possible choices 2 things must be done:
  • Create the item - To do this use a class variable of type sword, stick, or bow and use their action create like sword:createSword(color, shape) using the color and the shape saved before. After that just Add() the element and the action ChooseItem() works.

    Goal 3: Call actions

    Now that we have prepared our actions we have to define where the program should use them. To do that we "call" the action where we need to use it. It means that the action will be executed when the program reads the "call".

    Example: Call an action

    This example explains how to "call" an action: ChooseShape() in this example.

    // This is an example of how to call an action
    me:ChooseShape(true)

    Activity: Call different actions

    We have created 3 different actions which change, respectively, the shape, the color, and the item chosen by the user. Now we must decide where to use them. Most of these calls will be in the ChangeStep() action at the end of the main.quorum class given in the template. This action defines the different steps of the dialog. For every step, it shows the element we need and hides the others, changes the text, and puts the label and the button and all that is associated to a particular step on the screen.

    • The first action we created: ChooseShape(). The user chooses a shape during the step 1 and the program has to validate it. So we must call this action in the step 2, after the validation (where dialogStep = 2). So you can write the action call where there is a comment //TODO ChooseShape box and //TODO ChooseShape cylinder. Calling an action is very simple, as you saw in the example above. Just put the name of the action and then the parameters in parentheses. Since this action has no return type, you can just call this action without an extra object or with the word me (which references the current class). So your final call looks like this: me:ChooseShape(true) the box and me:ChooseShape(false) for the cylinder. With that, when the user chooses a shape and validates it, our code will call the action ChooseShape with the appropriate parameter for a box or a cylinder. This will put it on the screen. There is one more line where we have to call this action, at the end of the ChooseColor() action. We do this because we have to put a new model with the new color on the screen. For this call, the parameter depends on the class variable shape we defined before.
    • For the second: ChooseColor(). This action must be called only one time in the ChangeStep() action in step 3 because the user chooses their favorite color during step 2 and has to validate it. In this third step, you can see that there is a condition which verifies that the player has chosen one of the 3 colors: "blue", "red" and "green" and written it in the text box. In this case, you must change the color and continue normally so put your "call" here. Just do the same as the example above. The parameter should be what the user entered in the text box. To get this value has been stored in a variable called colorInput. If the input was invalid, the program goes back to the second step until user input is valid.
    • To finish, the third action: ChooseItem(). For that, go to the fourth step in the ChangeStep() action, there is a variable named item which is equal to the item number that the user chose in step 3 after validation. Just after the line that reads item = parameterPlayerChoices put your call to the action ChangeItem() with the parameter item.

    Sample Output

    Now that you have done the three headers, the three implementations and called the three action you can run your program and verify that it works. The program should be a dialog with different choices that the user has to make either with the mouse or the keyboard. A shape will be put on the screen, then a color will be put on the shape, and finally, an item will be created using several of the chosen shapes with the chosen color.

    Collaboration Activity:

    Collaboration is an important part of programming. When you work with other programmers, you get other points-of-view that make your programs even better. The final part of this assignment requires Git, a great tool for collaborating. Head over to the Teams and Version Control Tutorial if you need to know how to use Git.

    • Create a repository for the Quorum game applications that you will want to share
    • Add your game to your repository
    • Commit and push your repository
    • Invite a friend to your repository to pull your project
    • Have your friend make one change to your game
    • Have your friend commit and push their change

    When you write your commit message, it should be short but indicate the changes that have been made. Think of it like an important email. Email and text messaging have created new ways for us to communicate and collaborate. Write a post on social media or email a friend about the benefits of SMS and email. While you are sharing, share your Quorum Game. Invite your friends to download and play your game.

    Next Tutorial

    In the next tutorial, we will discuss Challenge 4.1, which describes an introduction to line following with robots..