1
00:00:00,520 --> 00:00:07,420
In the earlier lessons, we built out a way to run different sequences, we can start at two items within

2
00:00:07,420 --> 00:00:12,970
the sequence, go in, refresh our game, and it's always a good idea to try out your game and make

3
00:00:12,970 --> 00:00:15,150
sure that it is functioning as needed.

4
00:00:15,430 --> 00:00:18,430
So we go we have press start button.

5
00:00:18,610 --> 00:00:24,730
We clicked the start button and we matched two items, building out an array that we're using for the

6
00:00:24,730 --> 00:00:25,600
computer array.

7
00:00:25,870 --> 00:00:32,590
And now it's up to the player to match that array by clicking the different values of the boxes.

8
00:00:32,620 --> 00:00:37,120
So if we were to click blue and green, then we've built out that same array.

9
00:00:37,130 --> 00:00:41,670
So we've got that colors and we've got the values within that same order.

10
00:00:41,680 --> 00:00:45,900
Unfortunately, we can still keep clicking and continue to build out our array.

11
00:00:46,210 --> 00:00:52,030
So let's take care of that in this lesson where we're going to put a stop to the having the user or

12
00:00:52,030 --> 00:00:57,050
given the user the ability to continuously click and we're going to end the game at some point.

13
00:00:57,310 --> 00:00:59,610
So going into where we're checking answer.

14
00:00:59,620 --> 00:01:05,320
And this is the ideal spot to add that in, because this is where the user is taking an action and we

15
00:01:05,320 --> 00:01:11,470
want to stop the user's ability from taking that action once the user clicks length, matches the game

16
00:01:11,860 --> 00:01:12,280
length.

17
00:01:12,710 --> 00:01:14,980
So go ahead and add that condition in.

18
00:01:15,190 --> 00:01:19,180
And this is all happening within the inplay function.

19
00:01:19,570 --> 00:01:23,290
So we're going to do our check and we've got the two arrays.

20
00:01:23,290 --> 00:01:25,360
So we've got our user clicks length.

21
00:01:25,540 --> 00:01:31,920
And each array, of course, has its own length and we're checking to see if the game CLECs length.

22
00:01:32,290 --> 00:01:38,770
So if they are equal, then this is where we're going to end the game because we know that they're matching

23
00:01:38,770 --> 00:01:44,770
in length and we're going to take the inplay variable and set it to false.

24
00:01:44,770 --> 00:01:49,620
So boolean to false and we're going to create a new function that's going to end the game.

25
00:01:49,630 --> 00:01:51,940
And so going in here function.

26
00:01:52,210 --> 00:01:54,960
And this is where we can create our end game function.

27
00:01:54,970 --> 00:02:01,060
And right now we'll just console logout game over, go out and test everything, make sure that it's

28
00:02:01,090 --> 00:02:02,560
working as intended.

29
00:02:02,890 --> 00:02:07,200
So now what's happening is when we start, we're going to see two colors blink.

30
00:02:07,450 --> 00:02:13,420
The objective as the user has to kick the same two colors and we see that both those colors clicked.

31
00:02:13,420 --> 00:02:14,650
So it was blue and green.

32
00:02:14,830 --> 00:02:20,380
But in this case, I'll click to a click blue and green and we see that we can't click anymore.

33
00:02:20,530 --> 00:02:23,160
The game is not allowing us to add to that array.

34
00:02:23,350 --> 00:02:25,930
So this is where we've got our game over.

35
00:02:25,930 --> 00:02:31,840
Function needs to be firing off and we see that the game over did, in fact fire off and get invoked.

36
00:02:32,050 --> 00:02:37,240
So we are ready to move on to the next step where these two match in length.

37
00:02:37,480 --> 00:02:43,030
We ended the gameplay and we've got our game over function and that's where we can take care of any

38
00:02:43,030 --> 00:02:46,090
of the game functionality that we need to handle.

39
00:02:46,480 --> 00:02:50,770
We've got our button value and we have button disabled.

40
00:02:51,340 --> 00:02:55,150
So what we want to do is enable it so we do false.

41
00:02:55,180 --> 00:02:56,590
That's going to enable that button.

42
00:02:56,800 --> 00:03:02,320
So that's going to allow the player to start again and start that next sequence.

43
00:03:02,320 --> 00:03:08,620
So we've got button disabled, so we enable the button and we also need to add in a check to see if

44
00:03:08,620 --> 00:03:09,700
it was correct.

45
00:03:10,390 --> 00:03:15,820
So let's take that value and we're going to add in the value of user clicks.

46
00:03:16,150 --> 00:03:19,740
So from that function using to string.

47
00:03:20,680 --> 00:03:26,470
So this is JavaScript method allowing us to transform an array into a string.

48
00:03:26,770 --> 00:03:34,810
We're also going to take our game CLECs array and transform that into string as well so that we have

49
00:03:34,810 --> 00:03:37,780
essentially two strings that we're comparing against each other.

50
00:03:38,200 --> 00:03:43,750
And if the strings do match, then our play num increases by one.

51
00:03:44,170 --> 00:03:52,660
And if they don't match, then essentially they didn't get it correct and over here will console log.

52
00:03:52,660 --> 00:03:53,110
Correct.

53
00:03:53,560 --> 00:03:55,900
So one more time, let's go ahead and try that out.

54
00:03:56,320 --> 00:03:57,850
So refresh hit start.

55
00:03:58,300 --> 00:03:59,860
We see it went green, blue.

56
00:04:00,100 --> 00:04:01,360
We go green, blue.

57
00:04:01,510 --> 00:04:02,740
We see that it was correct.

58
00:04:02,980 --> 00:04:04,210
Try that one more time.

59
00:04:04,210 --> 00:04:04,860
So start.

60
00:04:05,560 --> 00:04:06,220
So it was blue.

61
00:04:06,220 --> 00:04:06,610
Green.

62
00:04:06,610 --> 00:04:08,680
Let's this time we're going to do it wrong.

63
00:04:08,680 --> 00:04:09,850
So we got incorrect.

64
00:04:10,030 --> 00:04:11,020
So that's working.

65
00:04:11,770 --> 00:04:15,310
And you want to find out more about how to string works.

66
00:04:15,490 --> 00:04:17,080
Mozilla Developer Network.

67
00:04:17,110 --> 00:04:21,490
Once again, we've got some great examples here of how to string works.

68
00:04:21,790 --> 00:04:28,810
And we can see that this is a way to turn a math value into a string, a hex string.

69
00:04:28,990 --> 00:04:31,960
So we run that, we get E six.

70
00:04:32,150 --> 00:04:34,330
So we get a hex value within the string.

71
00:04:34,630 --> 00:04:40,990
And there's some more examples of how that works down below within the examples area where we're turning

72
00:04:41,650 --> 00:04:45,070
a number into a string, a decimal point into a string.

73
00:04:45,340 --> 00:04:48,610
And there's a bunch of examples here, how we're turning hexes into strings.

74
00:04:48,790 --> 00:04:54,280
So go ahead and try that out for yourself, turn your arrays into strings, and then you can compare

75
00:04:54,280 --> 00:04:57,730
them to see if the user got the correct answer or not.

76
00:04:58,270 --> 00:04:59,950
And coming up, we're going to do some.

77
00:05:00,040 --> 00:05:05,290
More tweaks and adjustments to the gameplay to make sure that it is functioning as expected and needed.