In the earlier lesson, we generated lines, now we want to generate some additional cars that we can
use and output those values to the player.
So we've got our lines.
And when we refresh this sort of break out of that, going back into our application, into our success,
we should create some car, some additional cars as well so we can just call them enemy.
And we're going to update the background color for them as we're generating them out, so they're going
to have the same properties as our initial cars, the same size, and they're going to have the same
feel and look to those.
So going into our application, so just as we created some lines, we should also create some additional
cars.
So within the start game, we created our lines here.
Let's take this what we did earlier and also create a stir just having the player.
We're going to add in and add some cars as well.
So we'll call them enemy.
So these are diffs.
And these are the enemy elements.
And we certainly don't need 10.
How about we do three, four now?
And we're going to generate them to have a Y to be equal to and I want to start them off at a negative
position so they're not already on the screen.
So have them at Y.
Minus and let's use a random value here for that, we're going to generate we're going to use that JavaScript
math function.
So math.
Sombath.
Flor.
Math, random.
Times.
Two hundred, well, it's two times 500.
And they were going to multiply it by negative one, so it's going to give us a random position for
any of that particular element.
So they're all essentially going to be off screen once we start up.
An ad in the enemy y position there as its starting point and then add them into the game area.
And also going to set the background color so we can distinguish them to style and background color.
So set them all to red for now.
So they're all red now.
We need to get them moving.
So just as we moved the lines, we can create a function in our play game to move our enemies.
So move enemy and I'll copy out the function where we move the lines.
And instead of move lines, update that to move enemy.
And selecting those elements that have a class of enemy just going down to make sure so instead of adding
a class of line, we need to add the class of enemy to them, give it more of a generic object name
there.
So Element and we can keep item there as well.
And instead of subtracting 1500 from it, let's update this and set it to be equal to.
We could also keep the subtracting of the 1500.
And we also need to add in the positioning of the item to the left.
So adding in a style left, this is where we can use math floor and math random and let's multiply it
by 150 because we know we've got two hundred width for the road.
Don't forget to add in the picks and then we've got 50 width for the width of the car and we also need
to use this down where we've generated the element.
So not just top, we need to also specify that we are adding in left position so they're not all within
that same line.
And we can generate this randomly as well.
So instead of having the math value here as random so we can space it out a little bit better, going
to remove that and set this to X plus one and then multiply that by a value of 600.
So that will space out our enemies a little bit better and we can keep the enemy X Y value the same.
So you can see that they've been generated and there is spacing between them and they're always randomly
positioned.
So either on the left or the right, and then that one kind of showed up a little bit unexpectedly.
So we need to also take that into consideration where we're going to multiply it and we're going to
subtract about 600 from it.
So going up, just do a quick adjustment here.
And we're going to set the value of Y to be negative 600.
So try that out, run through that one more time, and now we've got some better spacing between the
enemies and you can see that they're always coming right off of the top.
So go ahead and add this into your application and you'll be ready to move on to the next part where
we're going to be doing collision detection.
And that's going to be wrapping up the game.
We're going to check to see if this car is overlapping any one of these enemies.
And if it is, then the game's over.