1
00:00:00,390 --> 00:00:05,940
In the earlier lesson, we generated lines, now we want to generate some additional cars that we can

2
00:00:05,940 --> 00:00:09,170
use and output those values to the player.

3
00:00:09,750 --> 00:00:10,920
So we've got our lines.

4
00:00:10,930 --> 00:00:18,030
And when we refresh this sort of break out of that, going back into our application, into our success,

5
00:00:18,300 --> 00:00:23,940
we should create some car, some additional cars as well so we can just call them enemy.

6
00:00:27,170 --> 00:00:31,580
And we're going to update the background color for them as we're generating them out, so they're going

7
00:00:31,580 --> 00:00:37,520
to have the same properties as our initial cars, the same size, and they're going to have the same

8
00:00:37,520 --> 00:00:38,600
feel and look to those.

9
00:00:41,250 --> 00:00:48,540
So going into our application, so just as we created some lines, we should also create some additional

10
00:00:48,540 --> 00:00:48,990
cars.

11
00:00:49,320 --> 00:00:53,260
So within the start game, we created our lines here.

12
00:00:54,330 --> 00:01:00,570
Let's take this what we did earlier and also create a stir just having the player.

13
00:01:00,840 --> 00:01:04,330
We're going to add in and add some cars as well.

14
00:01:04,350 --> 00:01:05,450
So we'll call them enemy.

15
00:01:06,450 --> 00:01:07,440
So these are diffs.

16
00:01:09,920 --> 00:01:12,890
And these are the enemy elements.

17
00:01:15,430 --> 00:01:17,380
And we certainly don't need 10.

18
00:01:17,410 --> 00:01:18,810
How about we do three, four now?

19
00:01:20,090 --> 00:01:26,990
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

20
00:01:26,990 --> 00:01:29,000
position so they're not already on the screen.

21
00:01:29,870 --> 00:01:31,430
So have them at Y.

22
00:01:33,630 --> 00:01:41,940
Minus and let's use a random value here for that, we're going to generate we're going to use that JavaScript

23
00:01:42,150 --> 00:01:43,020
math function.

24
00:01:44,430 --> 00:01:45,330
So math.

25
00:01:48,530 --> 00:01:49,220
Sombath.

26
00:01:52,090 --> 00:01:52,660
Flor.

27
00:01:54,580 --> 00:01:56,050
Math, random.

28
00:01:57,930 --> 00:01:58,800
Times.

29
00:02:00,840 --> 00:02:03,690
Two hundred, well, it's two times 500.

30
00:02:11,210 --> 00:02:17,450
And they were going to multiply it by negative one, so it's going to give us a random position for

31
00:02:17,450 --> 00:02:19,610
any of that particular element.

32
00:02:22,320 --> 00:02:25,980
So they're all essentially going to be off screen once we start up.

33
00:02:33,020 --> 00:02:39,230
An ad in the enemy y position there as its starting point and then add them into the game area.

34
00:02:40,940 --> 00:02:49,140
And also going to set the background color so we can distinguish them to style and background color.

35
00:02:49,280 --> 00:02:51,150
So set them all to red for now.

36
00:02:52,460 --> 00:02:53,870
So they're all red now.

37
00:02:53,870 --> 00:02:55,010
We need to get them moving.

38
00:02:55,550 --> 00:03:02,330
So just as we moved the lines, we can create a function in our play game to move our enemies.

39
00:03:03,350 --> 00:03:10,130
So move enemy and I'll copy out the function where we move the lines.

40
00:03:12,100 --> 00:03:15,520
And instead of move lines, update that to move enemy.

41
00:03:18,090 --> 00:03:24,600
And selecting those elements that have a class of enemy just going down to make sure so instead of adding

42
00:03:24,600 --> 00:03:30,810
a class of line, we need to add the class of enemy to them, give it more of a generic object name

43
00:03:30,810 --> 00:03:31,080
there.

44
00:03:31,110 --> 00:03:34,130
So Element and we can keep item there as well.

45
00:03:34,350 --> 00:03:41,150
And instead of subtracting 1500 from it, let's update this and set it to be equal to.

46
00:03:41,700 --> 00:03:44,540
We could also keep the subtracting of the 1500.

47
00:03:44,910 --> 00:03:48,910
And we also need to add in the positioning of the item to the left.

48
00:03:49,500 --> 00:03:58,560
So adding in a style left, this is where we can use math floor and math random and let's multiply it

49
00:03:58,560 --> 00:04:02,820
by 150 because we know we've got two hundred width for the road.

50
00:04:02,850 --> 00:04:07,740
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

51
00:04:07,740 --> 00:04:10,590
to use this down where we've generated the element.

52
00:04:11,640 --> 00:04:19,140
So not just top, we need to also specify that we are adding in left position so they're not all within

53
00:04:19,140 --> 00:04:20,100
that same line.

54
00:04:22,190 --> 00:04:24,410
And we can generate this randomly as well.

55
00:04:26,480 --> 00:04:33,740
So instead of having the math value here as random so we can space it out a little bit better, going

56
00:04:33,740 --> 00:04:40,810
to remove that and set this to X plus one and then multiply that by a value of 600.

57
00:04:41,300 --> 00:04:47,410
So that will space out our enemies a little bit better and we can keep the enemy X Y value the same.

58
00:04:47,960 --> 00:04:54,260
So you can see that they've been generated and there is spacing between them and they're always randomly

59
00:04:54,260 --> 00:04:54,850
positioned.

60
00:04:54,860 --> 00:04:59,620
So either on the left or the right, and then that one kind of showed up a little bit unexpectedly.

61
00:04:59,810 --> 00:05:05,270
So we need to also take that into consideration where we're going to multiply it and we're going to

62
00:05:05,270 --> 00:05:07,420
subtract about 600 from it.

63
00:05:07,670 --> 00:05:10,070
So going up, just do a quick adjustment here.

64
00:05:12,000 --> 00:05:15,900
And we're going to set the value of Y to be negative 600.

65
00:05:17,670 --> 00:05:23,010
So try that out, run through that one more time, and now we've got some better spacing between the

66
00:05:23,010 --> 00:05:25,820
enemies and you can see that they're always coming right off of the top.

67
00:05:26,130 --> 00:05:30,360
So go ahead and add this into your application and you'll be ready to move on to the next part where

68
00:05:30,360 --> 00:05:31,830
we're going to be doing collision detection.

69
00:05:32,010 --> 00:05:34,070
And that's going to be wrapping up the game.

70
00:05:34,080 --> 00:05:38,640
We're going to check to see if this car is overlapping any one of these enemies.

71
00:05:39,060 --> 00:05:40,680
And if it is, then the game's over.