1
00:00:00,030 --> 00:00:02,580
Now we've done most of the easy parts,

2
00:00:02,610 --> 00:00:05,790
getting a paddle and a ball up and running on our screen.

3
00:00:06,120 --> 00:00:08,700
The next few parts are going to be a little bit more tricky.

4
00:00:09,270 --> 00:00:13,530
And the first thing we're going to tackle is how to detect collision when the

5
00:00:13,530 --> 00:00:18,530
ball hits the wall at the top and the bottom and getting the ball to bounce.

6
00:00:19,470 --> 00:00:21,210
Now, we only need to detect

7
00:00:21,240 --> 00:00:24,660
collision on the top and the bottom walls

8
00:00:24,930 --> 00:00:29,190
because when the ball hits the right or of the left edges of the program,

9
00:00:29,490 --> 00:00:33,300
it should actually be caught by one of the paddles. And if it isn't,

10
00:00:33,360 --> 00:00:35,730
then that means that player has missed the ball

11
00:00:35,940 --> 00:00:37,440
and it's a point to the other side.

12
00:00:37,920 --> 00:00:42,920
So we need to focus on how can we detect when the ball has collided with the top

13
00:00:43,830 --> 00:00:45,060
or bottom walls,

14
00:00:45,420 --> 00:00:50,420
when has its position gone past a certain point that it probably is going to

15
00:00:51,210 --> 00:00:54,810
collide with the wall. We've done something similar in snake, but it's again

16
00:00:54,870 --> 00:00:58,260
time to revisit this topic. Now on top of that,

17
00:00:58,260 --> 00:01:01,650
we have to figure out how do we get the ball to actually bounce?

18
00:01:01,980 --> 00:01:06,090
And what does bouncing actually mean in terms of changing the position of the

19
00:01:06,090 --> 00:01:06,923
ball?

20
00:01:06,960 --> 00:01:11,960
When the ball is constantly going up in the Y value and going up in the X value

21
00:01:12,390 --> 00:01:14,340
in order to travel in this direction,

22
00:01:14,670 --> 00:01:19,170
what actually happens to the X and Y values when it bounces?

23
00:01:19,530 --> 00:01:22,440
Which one gets reduced and which one stays constant?

24
00:01:23,430 --> 00:01:28,430
Have a think about those questions and play around with some of those numbers

25
00:01:29,220 --> 00:01:33,630
and see if you can complete this challenge by yourself. If you get stuck

26
00:01:33,690 --> 00:01:35,250
or if you just want to check the answer,

27
00:01:35,490 --> 00:01:37,950
then come back and I'll go through the solution with you.

28
00:01:40,680 --> 00:01:43,590
All right. So it's going to be inside our while loop

29
00:01:43,800 --> 00:01:48,180
where I'm going to be detecting the collision with the wall.

30
00:01:48,720 --> 00:01:52,440
And in order to detect the collision with the wall, essentially,

31
00:01:52,470 --> 00:01:57,450
what I'm going to say is that if the screen is 600 by 800,

32
00:01:57,870 --> 00:02:00,870
when the ball is at a Y position

33
00:02:00,900 --> 00:02:03,390
that is above 300,

34
00:02:03,420 --> 00:02:05,940
remember 300 is half of 600,

35
00:02:06,270 --> 00:02:11,270
and the Y-axis goes from 0 to 300 and 0 to -300.

36
00:02:12,780 --> 00:02:15,630
So once the ball is past 300,

37
00:02:15,930 --> 00:02:19,770
then it's going to be way past the wall, right? So at that point,

38
00:02:19,800 --> 00:02:22,230
I can be pretty sure that it's going to hit the wall

39
00:02:22,260 --> 00:02:23,970
or it has it already hit the wall.

40
00:02:24,540 --> 00:02:27,810
So that will be my criteria for detecting collision.

41
00:02:28,170 --> 00:02:33,170
So it can say if the ball.ycor is greater than 300,

42
00:02:36,960 --> 00:02:41,610
well in that case it's basically gone too far up and it's hit the top wall. Now,

43
00:02:41,670 --> 00:02:44,820
in addition, I can add a or statement to say

44
00:02:44,850 --> 00:02:49,620
if the ball.ycor is less than -300,

45
00:02:49,980 --> 00:02:53,670
then that means it's gone too far down and it's hit the bottom wall.

46
00:02:54,120 --> 00:02:57,690
So in this case, it needs to bounce.

47
00:02:58,930 --> 00:03:02,350
So we need to figure out how to get our ball to bounce.

48
00:03:02,770 --> 00:03:07,770
And we're going to create a bounce method in our ball class in order to tell it

49
00:03:08,260 --> 00:03:10,270
how to do this. Firstly,

50
00:03:10,300 --> 00:03:15,300
we're going to need to figure out a new Y because the Y coordinate needs to

51
00:03:15,580 --> 00:03:17,530
essentially reverse. So,

52
00:03:17,530 --> 00:03:22,510
whereas previously our Y coordinate was going up and up and up increasing each

53
00:03:22,510 --> 00:03:26,860
time, when it hits the wall it needs to reverse direction.

54
00:03:27,130 --> 00:03:28,750
So if it was increasing,

55
00:03:28,810 --> 00:03:32,740
it needs to decrease. If it was decreasing, it needs to increase.

56
00:03:33,250 --> 00:03:38,250
So basically we need the opposite of what it currently is. To do that,

57
00:03:38,680 --> 00:03:41,770
the easiest way is to create a attribute

58
00:03:41,800 --> 00:03:45,010
which I'm going to call x_move and another

59
00:03:45,010 --> 00:03:47,290
which I'm going to call y_move.

60
00:03:48,640 --> 00:03:51,160
These are going to start out at 10,

61
00:03:51,610 --> 00:03:55,300
and every time we move our ball we're going to say,

62
00:03:55,800 --> 00:04:00,210
self.xcor + self.x_move,

63
00:04:00,660 --> 00:04:03,510
and plus self.y_move.

64
00:04:03,960 --> 00:04:06,210
This basically hasn't changed anything.

65
00:04:06,210 --> 00:04:09,390
It's just that every single time the ball moves,

66
00:04:09,660 --> 00:04:13,950
it's going to increase in the X coordinate by 10 pixels

67
00:04:14,370 --> 00:04:19,290
and also increased by 10 pixels in the Y coordinate. Now,

68
00:04:19,320 --> 00:04:21,060
when we bounce however,

69
00:04:21,510 --> 00:04:24,390
we need to change our y_move

70
00:04:24,630 --> 00:04:29,630
so that it's the opposite in terms of direction of what it used to be.

71
00:04:31,020 --> 00:04:35,310
So if it used to be +10 we want it to be now -10,

72
00:04:35,790 --> 00:04:40,170
and if it used to be -10, we want it to be now +10. To do that,

73
00:04:40,230 --> 00:04:43,110
all we need to do is multiply it by - 1.

74
00:04:43,680 --> 00:04:48,680
So that means if y_move is currently equal to 10 and 10 is being added to the Y

75
00:04:48,990 --> 00:04:51,750
coordinate, then this ball is moving upwards.

76
00:04:52,170 --> 00:04:56,760
But when we reverse the direction by multiplying it by -1,

77
00:04:57,120 --> 00:04:59,490
now that is now -10.

78
00:04:59,940 --> 00:05:03,570
So we're now adding -10 to the Y coordinate

79
00:05:03,600 --> 00:05:08,520
which is the same as subtracting 10. So this is some basic high school math

80
00:05:08,550 --> 00:05:13,080
that's going to get our pong program to start moving in the right direction.

81
00:05:14,040 --> 00:05:17,370
Now, back in the main.py under these conditions

82
00:05:17,400 --> 00:05:19,770
when the ball has hit the top or the bottom,

83
00:05:20,130 --> 00:05:22,650
we're going to get the ball to bounce.

84
00:05:23,550 --> 00:05:28,380
And now if I hit run, you should see that when the ball hits the top screen,

85
00:05:28,650 --> 00:05:32,580
it comes right back, exactly in the way that we want it to.

86
00:05:33,120 --> 00:05:35,130
But the only thing that we might need to tweak 

87
00:05:35,280 --> 00:05:39,450
is look at how far it's gone before it actually bounces. It completely disappeared

88
00:05:40,140 --> 00:05:42,870
of the screen before it actually makes a bounce.

89
00:05:43,260 --> 00:05:46,320
So we can adjust these values accordingly.

90
00:05:46,350 --> 00:05:50,490
So I think it works best that when we actually have it as 280.

91
00:05:51,000 --> 00:05:55,680
So remember that the width of the ball is 20 pixels

92
00:05:55,980 --> 00:05:58,580
so if we're 20 pixels away from the wall,

93
00:05:58,730 --> 00:06:02,240
then that's pretty much where we need to bounce. So if I run this again,

94
00:06:02,270 --> 00:06:06,980
you can see that the ball hits close to the wall and then it comes right back.

95
00:06:08,300 --> 00:06:12,320
So this will take a little bit of thinking to get your head around it.

96
00:06:12,650 --> 00:06:17,650
The best way to really understand this is to print out the values of the new_y

97
00:06:19,070 --> 00:06:20,840
and also of the y_move

98
00:06:21,080 --> 00:06:26,060
and also after you've modified the move in the bounce. Look at those numbers

99
00:06:26,150 --> 00:06:30,320
and you'll eventually be able to understand what's actually happening to the

100
00:06:30,320 --> 00:06:33,140
position of the ball. But effectively,

101
00:06:33,170 --> 00:06:38,030
all that we're doing is we're defining an amount that the ball is going to move

102
00:06:38,090 --> 00:06:40,400
by in the X and the Y axis.

103
00:06:40,850 --> 00:06:45,850
We're adding that amount to the X and Y coordinates in order to move the ball.

104
00:06:47,000 --> 00:06:50,180
And when the ball needs to bounce off the top and bottom walls,

105
00:06:50,450 --> 00:06:55,450
we reverse the y_move number so that we get it to subtract instead of add.

106
00:06:57,890 --> 00:07:00,230
And that moves it in the opposite direction.

