Side Scroller 5

Step 1
Step 2

Define a new function called showOption that we are going to use to show the message when the player is on top of the sign.

Use cut and paste to move the code there.

Step 3
Call the "showOption" function when the player is on top of the sign
Step 4

Right now, the only thing our showOption function will do is tell you that you are on top of the sign. If we want to change that, we need to be able to change the variable called message.

Do do this, we are going to give the function an input, usually called a parameter

Step 5

We're going to remove the variable from the first line of the function, and move it up to become a parameter.


How will the program know what the message is?

Step 6

Now that our showOption function has a parameter, we now have to supply that information whenever we call the function.

Add this string to make it display an option to check the sign.

Check Your Work
Step 7
Step 8
Step 9

Change your think function so that it takes a parameter called thought. This should work just like the showOption function, so that we can supply what thought we want to think.

Step 10

Now that think has a parameter, we should be able to add this code to see what the sign says, when we press enter while overlapping it.

Check Your Work
Step 11

Press Save and Run and then press the "enter" key while on top of the sign. You should see the message we put in () when we called the think function.

Step 12
Step 13
Step 14

Just like functions can have inputs called parameters, we can also give them outputs, which are called returns.


var doubleThisNumber = function(aNumber){
    var doubledNumber = aNumber*2;
    return doubledNumber;

In our example, aNumber is the parameter and doubledNumber is the return.

Step 15
Step 16
Step 17
Step 18
Step 19
Step 20
Give the player someone to talk to.

We're going to make a person object for the player to interact with. Here are the steps:

  • Declare a new variable called villager
  • In setup assign villager to an object with the same properties as player.
  • Define a new function called drawVillager that draws them just like in drawPlayer.
  • Create a new scene 4 in drawScene, and call your drawVillager function in it.
Check Your Work
Step 21

Your scene doesn't have to have a sweet castle like this one. Just make something new!

Step 22
Talk to the villager

For our final challenge, we are going to make an interaction with the villager.

Just like you did with the sign, you should:

  • In the movePlayer function, use another if statement to check if scene === 4
  • Inside that if, create another if that checks if the player is overlapping the villager
  • Show the option to "Talk" to the villager
  • If you press the key to interact, have the player think "How are you today?"
Check Your Work
Step 23
Side Scroller 5 Info


MVCode Clubs

Created By

Mandala2 slinkous


Side Scroll Adventure

Access Level


For Teachers and Schools

Teach coding to your students with MVCode Teach

MVCode offers an integrated product designed to teach coding to students.

Learn more about MVCode Teach