Hey, I know what you're thinking.
How about a game while play a game of dice?
Well, you're going to have to create that game first and we're going to do that using what we've learned
in the earlier lessons about object oriented programming with JavaScript.
So, first of all, create an element on the page that can be clicked, then create a constructor function
to contain the game functions so you can call it day scheme.
And then within this game, add the option to roll the dice with math, random one to six, and then
the DICE scheme add an option to check the winner and then within the click events, give the ability
to roll.
Also add the ability to determine the winner of who is who has the highest roll of the dice and then
output that information as it's being clicked onto the page.
So just like the example here, it doesn't have to be anything fancy.
This is all just tax base.
And of course, we do want to focus on the JavaScript.
So this is all behind the scenes and we're just simply outputting player got a six versus computer.
One player wins.
So that's all the functionality that we're looking for in this challenge.
So you can pause the video and I'll walk you through how to construct this and how to build this coming
up.
So first thing that we wanted to do is create our basic game container.
So this is the object that we're going to use in order to create our game.
And this is calling out to this game function.
And that means that we do need to create that as we see that we throw an error, of course, if we don't
have that in existence and we try to access that function.
So now we've got the function called this game, and then this is where all the magic happens.
So we also need to create a few elements on the page.
So this is for the user to be able to have something to click.
So using document create elements and the element that we're creating.
So this is just a regular div and then within the the the dice.
Add in text context, and for now we can start out with the message that just says roll here.
So this is the starting point and then we need to append it.
So document body, append child, and we're spending the days to the body.
So we've got role here.
So that's it.
So now we've got we're almost ready to go to continue with the game.
So we need to make this clickable like roll here.
Doesn't do very much.
Just says roll here.
So let's create an action to that.
And we can do this by adding an event listener.
I can actually do this as a second line down here.
So for Dice, because we've got that subject that we created, so we always have access to it and add
event listener.
And the event that we're listening for is a click.
So anyone that clicks that is going to invoke the function.
This can just be an anonymous function within that odd event listener.
So now whenever we click it and let's just make sure that it's working.
So now when we click it, we got roll showing up within the console.
That's what we want.
So what we want to do is we want to have the ability to roll and all of this is going to actually happen
within the dice game.
So within this next game, we need to create a few methods.
And the first one is roll.
We need to have some type of action that the user can take.
And then we're going to call to these actions.
And this is all going to be contained within the game object.
So this is the one that we're constructing.
So using the function.
So whenever the user roles, what we want to do is return back a result.
So I'm going to use this results and using JavaScript math floor and then taking math random and we're
going to multiply the result by six.
And so we want a value that's being returned back from one to six.
So I'm going to add in a one to it.
So now our result is going to be resulting back with the value of one to six.
I had an extra bracket there, so let's throw in the error there.
And then all we're doing here is we're returning this result.
So we're turning back the result.
So that means that we can use game roll and we can roll anytime we want.
So how about how about we try that in game a rule so we get the game roll, we get a random value and
hopefully it's one to six.
That should be one to six.
So everything is good to go.
So now we can create the rules for the player as well as for the computer.
So the player rolls the dice and they're using game rule.
Also, we need a computer roll and you could add in as many as you want.
So in this case, we're only going to have the two.
But you can extend on this and create additional options to roll.
So we also need to do is check to see who the winner is and then output the results.
And we're going to do that in the upcoming lesson.
So go ahead, set this up and have the ability to roll and you're going to be ready to move on to the
next part where we're going to wrap this up and we're going to check to see who the winner is and then
output that information.
And actually, we're going to just put it right on top of the dice so that wherever we're clicking and
I know this doesn't look like dice, so it's just that input feel that field that we can click and initiate
the action of the game.
So go ahead, create this.
And coming up, we're going to wrap this up.