Let’s see what happens if one of the legs is not attached to the avatar. In this
case, we’ll change the left_foot so that it’s added to the scene instead of the
avatar.
varleft_foot =newTHREE.Mesh(foot, cover);
left_foot.position.set(75, -125, 0);
scene.add(left_foot);
Run this, and the left foot goes missing.
Don’t underestimate the power of this concept. We’ll do some crazy things
with it later. For now, don’t forget to fix your left foot to the avatar!
4.4 Challenge: Start/Stop Animation
Remember the is_cartwheeling and is_flipping values from when we built the avatar
in Chapter 3, Project: Making an Avatar, on page 25? Let’s add two more if
statements to the keyboard event listener. If the C key, which the computer
thinks is the number 67 , is pressed, then the avatar should either start or
stop cartwheeling. If the F key, which the computer thinks is 70 , is pressed,
then the flip routine should start or stop.
Hint: switch between true and false with the not operator. In JavaScript, the not
operator is an exclamation point, !. You can use this not operator to assign
the value of is_cartwheeling to the opposite of its original value with something
like is_cartwheeling = !is_cartwheeling. We’ll see this again in Booleans.
Hopefully, you were able to get it working yourself. Here is the animate() function
that handles the cartwheeling and flipping.
varis_cartwheeling = false;
varis_flipping = false;
functionanimate() {
requestAnimationFrame(animate);
if(is_cartwheeling) {
avatar.rotation.z = avatar.rotation.z + 0.05;
}
report erratum • discuss
Challenge: Start/Stop Animation • 39
Prepared exclusively for Michael Powell