1
00:00:00,830 --> 00:00:04,050
All right guys so in the last video we started on our.

2
00:00:04,050 --> 00:00:06,280
We added all the variables.

3
00:00:06,420 --> 00:00:10,100
We created the logic here and the wind case.

4
00:00:10,100 --> 00:00:13,570
So if a user wins we know that the values too.

5
00:00:13,800 --> 00:00:18,220
They get the green border they can't change the number and they get a message.

6
00:00:18,240 --> 00:00:22,380
So now we're going to do is the lose case.

7
00:00:22,440 --> 00:00:29,240
All right so if they lose then we want to subtract one from the guesses left.

8
00:00:29,250 --> 00:00:29,580
All right.

9
00:00:29,580 --> 00:00:32,630
So we want this it's the wrong number.

10
00:00:33,840 --> 00:00:37,300
So we want to say guesses left.

11
00:00:37,620 --> 00:00:43,300
Now we can do a shortcut here we can say minus equals 1.

12
00:00:43,320 --> 00:00:43,720
All right.

13
00:00:43,740 --> 00:00:45,500
So this will take one away.

14
00:00:45,500 --> 00:00:49,590
This is the same as saying guess's left equals

15
00:00:52,110 --> 00:00:53,350
guesses left.

16
00:00:53,390 --> 00:00:54,410
Take away one.

17
00:00:54,540 --> 00:00:57,230
OK it's just a shorter way of doing that.

18
00:00:57,300 --> 00:01:05,430
So we do that and then we want to check to see if there's any guesses left so let's say if guesses left

19
00:01:06,750 --> 00:01:09,390
is equal to zero.

20
00:01:09,480 --> 00:01:17,730
That means the game's over and they lost or just put a comment here and say game over last actually

21
00:01:17,730 --> 00:01:26,950
up here we should say game over 1.

22
00:01:26,960 --> 00:01:27,380
All right.

23
00:01:27,440 --> 00:01:31,370
So we need an else here

24
00:01:34,640 --> 00:01:35,990
and we'll say game

25
00:01:39,050 --> 00:01:40,680
continues.

26
00:01:41,300 --> 00:01:42,800
Will Say game continues.

27
00:01:42,800 --> 00:01:45,080
Answer wrong

28
00:01:48,460 --> 00:01:48,760
all right.

29
00:01:48,790 --> 00:01:56,500
So if the game is over it's going to be very similar to what we did if it was one we're going to disable

30
00:01:56,590 --> 00:01:57,820
and we're going to set a message.

31
00:01:57,820 --> 00:02:00,850
So I'm just going to copy all of this.

32
00:02:01,000 --> 00:02:01,570
Now this.

33
00:02:01,570 --> 00:02:04,150
Now I know this looks repetitive and don't worry about that.

34
00:02:04,150 --> 00:02:08,160
We're going to get to the two optimizing the code later on.

35
00:02:08,560 --> 00:02:11,500
But we want to set disable to true.

36
00:02:11,500 --> 00:02:11,840
All right.

37
00:02:11,850 --> 00:02:18,890
We want to set the border color to red and then the message see.

38
00:02:18,910 --> 00:02:21,070
So for the message we want to say

39
00:02:25,630 --> 00:02:33,510
let's say game over say game over and then we want to.

40
00:02:33,770 --> 00:02:36,290
We'll just say you lost.

41
00:02:36,330 --> 00:02:38,120
We don't want to be too harsh.

42
00:02:38,160 --> 00:02:39,400
Game over you lost.

43
00:02:39,420 --> 00:02:51,650
And we'll say the correct number was and then we can put in here the winning number that.

44
00:02:51,980 --> 00:02:56,310
All right we want this to be a read read message.

45
00:02:56,590 --> 00:03:01,150
So let's try that we'll save it we'll put it in a couple guesses.

46
00:03:01,150 --> 00:03:02,820
One two three.

47
00:03:02,860 --> 00:03:06,060
Game over you lost the correct number was two.

48
00:03:06,910 --> 00:03:07,300
All right.

49
00:03:07,300 --> 00:03:12,880
So in the else this is when they guess wrong but the game's all over.

50
00:03:12,880 --> 00:03:18,100
So in this case when I submit this case here which rating right now does nothing.

51
00:03:18,100 --> 00:03:22,130
So let's go ahead and let's send a message

52
00:03:26,850 --> 00:03:37,640
and for the message we're going to say we're put in some back ticks here and will say gas is not correct.

53
00:03:38,040 --> 00:03:44,670
And then we also want to notify them of the guesses they have left so we'll say you have what we want

54
00:03:44,680 --> 00:03:45,900
so you have I'll just say

55
00:03:50,180 --> 00:03:51,230
guesses left

56
00:03:54,560 --> 00:03:58,600
guesses left like that.

57
00:03:59,050 --> 00:04:03,370
All right well also make the border red so let's grab this

58
00:04:08,900 --> 00:04:11,490
say toe use or

59
00:04:14,320 --> 00:04:15,720
it's the wrong number

60
00:04:19,720 --> 00:04:24,950
what we want to make sure this is we want to pass in red as the color of the message.

61
00:04:24,950 --> 00:04:27,240
And then I also want to clear the input

62
00:04:30,430 --> 00:04:36,740
so I'll say I guess I guess input value.

63
00:04:37,140 --> 00:04:39,730
He calls nothing.

64
00:04:39,820 --> 00:04:40,080
All right.

65
00:04:40,090 --> 00:04:40,780
So let's try it.

66
00:04:40,780 --> 00:04:43,350
So put it in one submit.

67
00:04:43,510 --> 00:04:44,560
One is not correct.

68
00:04:44,560 --> 00:04:45,900
Two guesses left.

69
00:04:46,000 --> 00:04:48,410
We'll put in one again submit.

70
00:04:48,460 --> 00:04:55,790
One is not correct one gets left with split in five game over you lost the correct number was two.

71
00:04:55,810 --> 00:04:58,000
All right good.

72
00:04:58,000 --> 00:04:58,350
All right.

73
00:04:58,360 --> 00:05:04,320
Now this is where I want to do a little bit of optimization because where we're repeating ourselves.

74
00:05:04,330 --> 00:05:04,870
OK.

75
00:05:05,140 --> 00:05:11,020
If we guess the winning number we're disabling the input or setting the border color we're setting a

76
00:05:11,020 --> 00:05:12,450
message.

77
00:05:12,490 --> 00:05:12,940
All right.

78
00:05:13,030 --> 00:05:17,290
Else if there's no guesses left and we lost.

79
00:05:17,290 --> 00:05:20,020
Where are disabling the input.

80
00:05:20,020 --> 00:05:23,830
We're setting the border color where setting a message.

81
00:05:23,860 --> 00:05:36,340
So I think what we should do is create a function called Game Over.

82
00:05:37,120 --> 00:05:37,480
All right.

83
00:05:37,480 --> 00:05:42,790
So game over is going to take in two parameters one is going to be if they want or not which will be

84
00:05:42,790 --> 00:05:44,030
true or false.

85
00:05:44,140 --> 00:05:47,360
The second will be the message.

86
00:05:47,860 --> 00:05:48,260
All right.

87
00:05:48,280 --> 00:05:56,860
And then what we'll do is we'll well grab the disabled and put the board of the color and then the set

88
00:05:56,860 --> 00:05:58,190
message.

89
00:05:58,240 --> 00:05:58,600
All right.

90
00:05:58,600 --> 00:06:06,380
So what I'm going to do is copy this and comment it out and go down here and to game over pay Sison

91
00:06:07,420 --> 00:06:10,460
OK so we're disabling it.

92
00:06:10,630 --> 00:06:12,820
We're going to do this regardless if they want or not.

93
00:06:12,820 --> 00:06:16,830
Now the color the border colors is going to depend on if they want or not.

94
00:06:16,870 --> 00:06:17,840
Right.

95
00:06:18,100 --> 00:06:24,730
So what we can do is just do a conditional And I think the easiest thing to do would be to use it.

96
00:06:24,730 --> 00:06:26,170
TURNER The operator.

97
00:06:26,470 --> 00:06:39,400
So let's go ahead and declare a variable called Color and then we're going to say if one is equal to

98
00:06:39,430 --> 00:06:46,320
true then we want that color to equal green.

99
00:06:47,410 --> 00:06:53,490
Else we want that color to equal red.

100
00:06:54,320 --> 00:06:56,910
OK so now we have our color variable.

101
00:06:57,040 --> 00:06:58,630
The message is being passed in.

102
00:06:58,630 --> 00:07:05,740
So let's go down here and let's change this to the color K which is defined here on whether we won or

103
00:07:05,740 --> 00:07:06,320
not.

104
00:07:06,520 --> 00:07:17,340
And then the message here is going to be passed in to set message like the so that way we can go back

105
00:07:17,340 --> 00:07:23,070
up here and we can replace all of this code with.

106
00:07:23,340 --> 00:07:25,430
Game over.

107
00:07:25,530 --> 00:07:26,640
They won.

108
00:07:26,640 --> 00:07:27,790
So it's true.

109
00:07:28,170 --> 00:07:38,400
And then the message actually looming I got to go back to get the message we want this as our message.

110
00:07:39,700 --> 00:07:40,570
So game over.

111
00:07:40,570 --> 00:07:41,070
True.

112
00:07:41,080 --> 00:07:52,080
And then when you are back ticks like that Christ that looks much neater.

113
00:07:52,190 --> 00:07:56,050
Now let's go down here to where the game over when we lost.

114
00:07:56,120 --> 00:07:57,510
I'm going to grab the message

115
00:08:01,120 --> 00:08:04,360
copy that and then I'm going to just get rid of all this.

116
00:08:04,390 --> 00:08:11,440
We're going to say game over and we're going to say false because we did not win and then paste in the

117
00:08:11,440 --> 00:08:14,140
message.

118
00:08:14,190 --> 00:08:17,620
All right so do you think that looks much neater.

119
00:08:18,460 --> 00:08:19,500
So let's try it.

120
00:08:19,510 --> 00:08:20,880
It should work the same way.

121
00:08:20,890 --> 00:08:23,740
Hopefully So if we put a one which is not right.

122
00:08:24,040 --> 00:08:25,530
OK that's not correct.

123
00:08:25,540 --> 00:08:27,660
Five is not correct.

124
00:08:27,730 --> 00:08:30,950
Six is not correct.

125
00:08:31,160 --> 00:08:31,900
Let's see.

126
00:08:31,900 --> 00:08:34,310
Game over is not defined.

127
00:08:39,860 --> 00:08:45,340
See already I put Gaymer over.

128
00:08:45,350 --> 00:08:45,670
All right.

129
00:08:45,680 --> 00:08:49,900
Let's try it again.

130
00:08:49,940 --> 00:08:50,960
Game over you lost.

131
00:08:50,960 --> 00:08:51,620
Good.

132
00:08:51,710 --> 00:08:52,590
Let's try to.

133
00:08:52,600 --> 00:08:55,610
Which is correct and you win.

134
00:08:55,610 --> 00:08:58,200
Now the color is not green.

135
00:08:58,250 --> 00:09:02,250
Let's see why so let's see.

136
00:09:02,250 --> 00:09:03,000
Game over.

137
00:09:03,000 --> 00:09:04,890
True.

138
00:09:05,940 --> 00:09:06,800
Game over.

139
00:09:06,810 --> 00:09:12,980
We're saying if one is equal to true color equals green Alf's color equals red

140
00:09:17,390 --> 00:09:19,260
oh I just set the border color.

141
00:09:19,280 --> 00:09:20,860
Didn't the text color.

142
00:09:21,290 --> 00:09:22,340
So what we'll do

143
00:09:26,070 --> 00:09:30,710
is we'll say set text color.

144
00:09:31,290 --> 00:09:40,150
So we want message Daut style dot color equals color.

145
00:09:40,680 --> 00:09:43,670
So now there we go.

146
00:09:46,620 --> 00:09:51,260
So what I want to do next is where does the user go from here.

147
00:09:51,270 --> 00:09:53,520
I mean it's not clear.

148
00:09:53,520 --> 00:10:01,110
So what I want to do is change is a button to say play again and then add an event listener on that

149
00:10:01,110 --> 00:10:08,610
so that we can click that play again and it'll base it'll reload the page we can use the location object

150
00:10:08,610 --> 00:10:12,300
and use the reload method to reload the entire page.

151
00:10:12,300 --> 00:10:14,470
All right so that's what we'll do in the next video.