Instructor: Let's finally set up our project
and take a look at the game that we will code.
As well as the rules of that game that we will need
to implement in order to make it work.
So I have the starter code here on my desktop, once again.
So this code here, that is available for download.
So I'm going to go to my text editor now
and open up that project.
And by now you already know how it works, right?
So I go to my desktop and then hit open.
And this text editor, so brackets creates a new working
project for me.
OK so this time, the stater project includes a little bit
more than just a bare bones HTML structure.
So this time, we have a real user interface
that I coded for this game here in HTML
as well as the CSS code for this project.
And you can of course take a deep look at it
if you want to know exactly how I coded it up.
But on this project I want to focus fully on javascript
and not how the HTML and CSS works in the background.
OK so let's now take a look at the interface that I coded
for this and now as you see I have the text editor here
in full screen because now I need all the screen size
that I can get.
And I have the interface here on this side.
So this is a beautiful interface that I created
for our small little game, which is this one.
So we have two players on left side and right side.
And the goal of the game is to get to 100 points first.
So I want to actually first take a look at the rules with
you before I show it to you in action.
So let's go back and open our javascript file.
Which is this one.
And once again, I already connected it for you.
So down here we have the script, where we include
the app.js file.
Ok so this is the file which is empty
except this comment here which includes the game rules.
So as I mentioned there are two players and the game
is played in rounds.
And in each turn, a player rolls a dice as many times as
he wishes and each result gets added to his round score.
But if the player rolls a 1, then all his round score
gets lost and after that then it's the next player's turn.
But in order to avoid that, the player can choose to hold.
Which means that his round score gets added
to his global score.
And after that, it's again the next player's turn.
And the first player to then reach 100 points on the
global score wins the game.
So let's now see the game in action very quickly.
So player 1 starts the game and I'm going to start
rolling the dice.
All right, so I rolled a 4.
So down here on my round score, I now have a 4.
And I'm going to choose to hold and then the 4 points
get transferred to my global score, which we have up here
in this big size.
And now it's player 2's turn which we can see by this
gray background and this red dot.
And I'm going to roll a dice as well and now I have 5.
And I'm going to choose to roll again and I rolled a 3.
So 3 plus the 5 that I had before is now 8.
And I'm going to choose hold as well.
So now player 2 here is in the lead.
All right, player 1 once again.
Now I'm going to roll the dice all the way until I roll
a 1 which as you know will make me lose all of the score.
So just to show you what happens.
All right so I apparently rolled a 1 and lost all of my
round score and nothing got added here, right?
So I will now play with this one here, choose hold.
And let's play this game until the end.
And we have a winner here.
Player 1 won the game.
All right so this is how this game works,
super fun right?
I think it's really cool for a first real project.
So let's go straight to the next lecture and start
coding this.