Wow, the last article was intense – How can I possibly beat that? Oh, I think I can come up with an idea, um, how about tower powers?! You know that thing that makes the towers placed unique. Well I could think of a few powers that can be combined to make virtually all tower types – but then i realized something so complete would take a lot of writing to explain. So here are the intermediate level tower powers!

If you haven’t already read the last tutorial – How to build a tower defense flash game – Part 5 – Wave after Wave of Creep Kill’in! you should seriously consider giving it a go.

So this is what we will build today – Select the different towers and play around. The black tower is our default “damage only” tower. The red tower is an area of effect tower that does a tad less damage but it is spread across a larger area. The blue has a small area of effect and slows enemies by 25% and does minimal damage.

Once again all the source code for this tutorial can be downloaded by clicking here.

So if you start to look at the code, you may also have noticed that “tower powers” wasn’t the only thing I added. We’ll your right, I did a little clean up – I also added a health bar for all the creeps. I reorganized the tower onEnterFrame, well maybe you didn’t realize that but I did and it was all for a good cause.

The micro changes were:

The creeps now have health bars over their heads. This is mainly so you can see the splash damage at work, but we needed to have one created anyway – After creating the health bar symbols (health_bar > bar) I put the following code in the creeps onEnterFrame:

• this.health_bar.health._width = 30 / this.maxHealth * this.health;

We now have a health bar.

Next, I changed the spawn function code so now it uses the local variable “level” instead of “_root.wave”. I did this because _root.level is global and level is local. When we spawn a new enemy we need to check the level of the spawn object not the current level (_root["spawned" + level] == 0). This comes into play if you want the user to be able to spawn multiple waves at the same time.

Another change was to the tower code itself, I reorganized the onEnterFrame because it was redundant in some places – For example I checked for “target=0″ in multiple places. I just condensed the code and put the fire function in the right place.

Even with some of the micro changes I did – All the main changes were to support these 6 new symbols:

We now have a “Fire” and a “Water” tower! The firing code is almost exactly the same, and could be if I didn’t want the towers to actually function differently. Since I did want them to do different things we had to change the fire function, which now takes two additional parameters.

These parameters are:

“splash” – This value is actually the range around projectile when it hit the creep. It does more damage to those creeps that are closer to the target creep in the blast radius.

“slow” – This value is a number from 1 – 100 and it is the actual percentage that a given creep will be slowed down by when hit by the projectile.

So without further ado, lets jump right into the code.

Ok you see the two new parameters in the fire code – I also added a little extra at the start as well, that would be considered a micro change if it wasn’t so obviously necessary. The new code above positions the “projectile” symbol we just duplicated at the tip of the tower. What this means is that when the tower fires the projectile will appear at the tip of the gun. If you look at Part 4, you will notice the projectiles were being spawned in the center of the tower. This wasn’t too obvious when the bullets were small, but if you replace the code with what was there before:

r._x = from._x;

r._y = from._y;

The fire and water towers look all wrong. So I fixed it by taking in the towers rotation into account and then once we have the correct radians, we added half the width (because the tower was centered in the symbol) and half the height to the x and y coordinates.

Now we get into the heart of the matter. In Part 4 we literally had a call to the “Explosion” function, took away some health and then deleted the projectile. Not anymore, our projectiles have powers now baby!

Now if the tower passes in a “slow” parameter, we take that specific percentage off of the enemy the projectile hit. It’s pretty straight forward, but just to write out the math:

If the creeps maxspeed is 10 and the slow parameter was 25

this.targ.speed = 10 / 100 * (100 – 25);

this.targ.speed = 10 / 100 * (75);

this.targ.speed = .1 * (75);

this.targ.speed = 7.5;

Viola, the target just lost 25% of his forward momentum.

Ok this “beast” of code handles all of the “splash” issues. It can look daunting, but we’ll make it through it. When the projectile hits its target we loop through all of the other creeps and find out how far they were from the target creep when the hit took place. If the other creep was within the splash radius, we give out damage based on how far away the creep was at the time.

• _root.creepArray[i].health = _root.creepArray[i].health – this.damage * (1 – (d / this.splash));

Let run through one example:

If the splash distance was 50 (very big bomb – Think of the slash number as the same thing as the range number for towers), the distance away was 10 (fairly close to the explosion) and the damage from this type of bomb is 20.

_root.creepArray[i].health = _root.creepArray[i].health – 20 * (1 – (10 / 50));

_root.creepArray[i].health = _root.creepArray[i].health – 20 * (1 – (.2));

_root.creepArray[i].health = _root.creepArray[i].health – 20 * (.8);

_root.creepArray[i].health = _root.creepArray[i].health – 16;

So in this blast the surrounding creep will suffer 16 points of damage!

Now the other great thing which is in this function, is that we can do all sorts of powers as well – This is where slow comes back into play. We check if the tower has a “slow” marker on and apply that slow percentage to all the surrounding creeps as well. Hurting them by the blast, but also slowing them down. We are going to use this again when we make some more complicated towers (like poison towers – you may have noticed I made some green towers off to the side but didn’t use them yet -*wink*- -*wink*-).

Ok so the man difference between the towers is as follows:

CannonTower:

range = 120 (large distance)

rate = 5 (not to fast at shooting)

_root.fire(this, creep, 10, 1, 10, “projectile_cannonball”, 15, 0, 0);

The cannon tower doesn’t do anything fancy – but it does do more damage then the fire and water towers on an individual projectile basis, but has a slower rate of fire. It also has the largest range

so far.

Fire Tower:

range = 80 ( medium distance)

rate = 2 ( faster shooting)

_root.fire(this, creep, 10, 1, 10, “projectile_fire”, 5, 40, 0);

The fire tower has the second highest damage amount (1/3 the damage of the Cannon Tower), but is able to splash damage in a wide area. This means it works perfectly against a group of creeps that are packed together.

*Water Tower:*

range = 80 ( medium distance)

rate = 2 (faster shooting)

_root.fire(this, creep, 10, 1, 10, “projectile_water”, 2, 10, 25);

The water tower has the smallest range and damager, but it slows enemies by 25% as they pass by and is able to cause splash damage and thereby slow nearby enemies as well.

Excellent, look at that, you could already made a ton of combinations already and we’ve just started doing cool things with tower powers.

So what have we learned from this lesson:

1. We learned how to create a creeps health bar
2. We created two new towers that we can click on and place
3. We created a tower that does “splash damage”
4. We also create a tower that slows enemies down as they pass

We still have a long way to go to making a complete game, but it’s already shaping up to being a fun time. We still need to upgrade the towers and give information about each as well as a score and gold! We have a lot to do, but we’re moving fast.

How to build a tower defense flash game – Part 7 – Gold and Upgrades!