Let's play with variables
For the next step, let's go a bit further and make use of some variables.
In computer programming, a variable is a storage location that contains a value. Every variable has a specific name. You can store and change the values of a variable.
Firstly, let's create a variable. Find the section named "Variables" and press the "Create variable..." button.
You need to give your variable a name.
I am not that creative, so I will name my variable "i" (just a single letter i).
I am not that creative, so I will name my variable "i" (just a single letter i).
We have a variable now. Great!
When we create a variable, it's undefined - it has no value. We must set a value for every variable when our computer program starts. That's why you'll need the "set variable" block.
Put this block in the "Arduino run first:" branch.
Now you need to define the value that we want to set the variable to.
Find this block named "123" in the "Math" section. This block is a numerical value block, and you can type in the numerical value you want once you drop it onto the drawing area.
Place the block here:
Now click on the block and type in the value. Set the numerical value of the block to 0. You can do this by simply typing the number 0 (zero) on your keyboard.
Now that we have a variable created and set to zero, let's change the variable when a certain event is triggered.
We're going to change the variable when you smack your Spencer's big red button.
Luckily, we have a specific block defined for Spencer's button-smacking, and it's under the I/O section. I/O stands for "Input / output". Spencer's button is a so-called input device because it sends an electrical impulse to Spencer's computer when triggered. Spencer's display is an example of an output device because
Spencer sends signals to display information.
You need to find this purple block named "When button gets pressed".
Place the block onto the drawing area
Now let's increase the value of the variable by one every time you smack Spencer's head.
This is done by this block:
Place this block here into the purple "When button gets pressed" event block.
Now let's do something interesting - we'll use a logic IF-THEN-ELSE block to show different animations on Spencer's face depending on the value of the variable that we're changing.
Find this red block in the "Logic" section:
Place this block into the purple "When button gets pressed block".
Up next, we'll need a comparison block. This block is usually used for comparing the value of a variable to a fixed value (i.e. let's see if the variable i is equal to number 1).
Place the oddly-shaped comparison block into the IF-THEN-ELSE logic block like this:
On the left side of the comparison, block, place the variable that we've created (mine is creatively named i).
Take the numerical value block from the math section and place it to the right side of the comparison block like this:
Write the number 1 into the block.
What we're going to do now is make Spencer show an angry face animation if the variable is equal to 1.
You need to place the "Play animation" block like this and choose the "angry" animation from the drop-down menu:
Let's make Spencer cycle through seven different animations when you press his big red button.
In order to do that, you need to click five times on the white plus button in the lower-left of the logic IF-THEN-ELSE block:
The logic block will gain new branches and should now look like this:
Let's put a comparison block into every newly created logic branch.
In order to do so, you can simply right-click on the comparison block that you already have and click "duplicate".
You can duplicate the Play animation block as well and place it like this.
Let's make Spencer show the animation named "clouds" when the variable equals 2.
I'm going to fill out the other logical branches like this as well and assign different animations to different values of the variable:
Here's the catch - if we want Spencer to cycle through these seven animations, we need to reset the value of the variable back to zero once it goes above 6.
We can do this by simply adding these two block to the ELSE branch of the logic block:
These two blocks will reset the value of the variable to zero and play the initial animation that the program started with (the "heart" animation).
If you've followed everything correctly, your code should look like this at the end:
Don't forget to save all of your hard work!
Now hit the big red "Run" button and check out the code for yourself.
Smack Spencer's red button. Pretty cool?