3D Game Programming

if(is_flipping) {

avatar.rotation.x = avatar.rotation.x + 0.05;

}

renderer.render(scene, camera);

}

animate();

There is a lot happening in our animate() function. We know from Chapter 5,

Functions: Use and Use Again, on page 49, that this “noise” can make it hard

to read our code. We’ll be adding even more stuff to animate(). Unless we do

something, that animate() function is going to get really, really big.

So, let’s create an acrobatics() function that does the flipping and cartwheeling.

We might as well move the is_cartwheeling and is_flipping variables with it. Then

we can call acrobatics() from within animate(), making it easier to read.

functionanimate() {

requestAnimationFrame(animate);

acrobatics();

renderer.render(scene, camera);

}

animate();

varis_cartwheeling = false;

varis_flipping = false;

functionacrobatics() {

if(is_cartwheeling) {

avatar.rotation.z = avatar.rotation.z + 0.05;

}

if(is_flipping) {

avatar.rotation.x = avatar.rotation.x + 0.05;

}

}

Take a moment to make sure everything still works. If something has gone

wrong, check the JavaScript console!

Now let’s add three things to the animate() function.

❶ varclock =newTHREE.Clock(true);

functionanimate() {

requestAnimationFrame(animate);

❷ walk();

acrobatics();

renderer.render(scene, camera);

}

animate();

❸ functionwalk() {

varposition = Math.sin(clock.getElapsedTime()*10) * 100;

right_hand.position.z = position;

}

report erratum • discuss

Moving a Hand • 61

Prepared exclusively for Michael Powell