1
00:00:00,860 --> 00:00:07,340
This lesson, we're going to continue to build out our word scramble application, we need to set up

2
00:00:07,340 --> 00:00:12,110
an array with some words, and this is going to be where we're going to get the words from that we're

3
00:00:12,110 --> 00:00:14,540
going to use a lowercase, all of them.

4
00:00:14,870 --> 00:00:18,800
And these are just string values and I'm just creating some random words.

5
00:00:18,960 --> 00:00:19,400
So we go.

6
00:00:19,430 --> 00:00:20,570
So we've got five words.

7
00:00:20,570 --> 00:00:25,460
So we're going to make this dynamic so we can add more words if we want to, and it's not going to break

8
00:00:25,460 --> 00:00:26,430
any of the application.

9
00:00:26,810 --> 00:00:34,010
So now we've got the button gets clicked and we need to check to see if the button was clicked and we're

10
00:00:34,010 --> 00:00:35,300
going to create a variable.

11
00:00:35,300 --> 00:00:36,480
We can call that in place.

12
00:00:37,010 --> 00:00:38,380
So that's to false.

13
00:00:39,080 --> 00:00:45,560
And when the button gets clicked the first time, we're going to check to see if in play and if there's

14
00:00:45,560 --> 00:00:47,540
no inplay, then we're going to put it in play.

15
00:00:47,900 --> 00:00:50,090
So we're gonna to check to see if inplay is false.

16
00:00:50,480 --> 00:00:56,120
And if it is false, then we're going to update in play to be true so that we can't click it another

17
00:00:56,120 --> 00:00:56,390
time.

18
00:00:56,840 --> 00:01:01,280
And selecting that button object, we're going to update the inner HTML.

19
00:01:01,280 --> 00:01:02,930
We can also do in text as well.

20
00:01:03,200 --> 00:01:08,710
So updating HTML to be guess and it's going to be a string value.

21
00:01:09,440 --> 00:01:13,020
So this is what the user is going to press in order to make their guess.

22
00:01:13,310 --> 00:01:17,000
We also have to unhide the hidden element there.

23
00:01:17,360 --> 00:01:26,090
So let's select our input area so we have our guests input area applying a style to it and the style

24
00:01:26,090 --> 00:01:29,570
property is display and setting display to none.

25
00:01:30,050 --> 00:01:34,190
We could do this and that will overwrite that class.

26
00:01:34,550 --> 00:01:42,470
But another way to do that is to select that and use class lists and class list toggle and setting up

27
00:01:42,470 --> 00:01:45,560
the toggle to indicate which class we want to toggle.

28
00:01:45,680 --> 00:01:47,510
And that's the class of hidden.

29
00:01:47,520 --> 00:01:50,000
Let's try that out and refresh hit start.

30
00:01:50,210 --> 00:01:51,860
And there we've got our input.

31
00:01:51,860 --> 00:01:53,090
We've got our guess.

32
00:01:53,360 --> 00:01:58,850
The next thing that we need to do is actually output the message or the word that the player needs to

33
00:01:58,850 --> 00:01:59,580
unscramble.

34
00:01:59,870 --> 00:02:02,990
So it's going to come up in the next lesson and we can do that.

35
00:02:02,990 --> 00:02:08,750
And then also we need to handle the selection and the guests to check to see if it's been correct.

36
00:02:08,900 --> 00:02:16,490
And that way we can simply compare what the selected string value is that we've scrambled compared to

37
00:02:16,490 --> 00:02:17,090
the input.

38
00:02:17,240 --> 00:02:18,890
So all of that is still yet to come.

39
00:02:19,250 --> 00:02:26,240
Add in the ability to update that start button and to start the game, adding in and updating the contents

40
00:02:26,240 --> 00:02:32,300
of the button, as well as toggling the class hidden, removing it from the text area.

41
00:02:32,300 --> 00:02:33,050
So it's visible.