This lesson, we're going to be setting up our game play variables, we're going to need one variable
that's going to hold our current card value.
This is going to be a global variable and it's going to be changing.
So we're going to make it a lot and also give it a name, current card value.
And currently we'll just set that at zero and we're going to use that throughout the script in order
to track what the current card is and what the current card value is.
We also need to track our score, set this up as score value because I already used the variable score.
So I need another variable.
So I'm setting this one up as score zero.
We also need to have some variables that are going to be holding the deck and this is going to be an
array.
We're going to build this out using JavaScript, also some default card settings.
So these actually can be const because they're not changing and we can call this the ranks.
So these are all of the card ranks that we potentially will have.
So we'll have some cards.
So starting at two, working all the way up to our jox.
So it's going to be a string value and this is how we're going to know what to output for the user.
So essentially, we're going to be using this for visual representation of the cards.
In addition to that, we know that our cards are going to have different suits.
Let's set up an array for the suits as well.
The suits that are going to be using are going to be also useful when we're using the AFSC characters.
So set one up as hearts diamonds.
So we're going to use a short format for that.
And I'll show you why later on in the upcoming lessons, why we're using that shorter format.
So clubs and lastly, spades.
And this is going to also help with the output of those values.
So now that we've set up basically our default variables, we're ready to build out our deck of cards
using these values and then also to keep track of what's happening during the gameplay with these to
we also need to make sure that the buttons are doing something.
So let's set that up where we're going to loop through all of the variable available buttons.
So set up a variable.
And you can do different loops for this, so we're just going to do a basic for loop and we're looping
through all of the button object and it's got a length because it's a node list and then increment I
so we can break out of our loop and then selecting a button.
And as we loop through first, I'll show you what we're going to be outputting as we're looping through
and as we loop through and we output these objects individually.
That means that we can work with those as well.
So you can see that we've got the start button that represented there.
We've got the first higher button and then the second button.
So it's all being represented there.
And we want to add event listeners to those buttons.
So as we iterate through them within the loop, this is where we can add an event listener adding an
event listener and the event listener that we want to add in is a click and we'll link it to a variable
called that or a function called that play game.
And then just below, let's set up our function.
So this is a default one that's just going to hold that console log.
And for now, we're just going to type clicked there.
So now that every time we click one of our buttons, we should see clicked showing up within the console.
And that we do.
And we can also get rid of this to avoid some of that confusing content that's being shown here within
the console.
So you see, we've got clicked.
So all of our buttons are now functional.
So we're ready to move on to the next step.
So go ahead and set up the variables.
Also set up the content for the card deck so that we can build out the deck in the next lesson.
And in the event listener for the buttons going through, looping through that node list and then set
up a default function that can house any of the clicks that can respond to any of the clicks.
And for now, we're going to keep console log clicked in there.
Go ahead and set that up in your own project.