Once you have all of the core functionality that you originally set out to produce within the game,
you're ready to customize it and add in some additional functionality to enhance the gameplay.
So we have all of the core functionality where we can grab the elements.
We've got a bunch of elements that are moving and we can use our keyboard in order to move our player
element in order to collide with the ones that are on the screen.
So we also wanted to create a little bit more interesting where when we do reach the bottom, that we
have a random exposition so we can use the same formula that we used when we were creating those bad
guys and we were setting their position randomly using this formula.
We can do that as well and we can copy that and go down to here.
And instead of div, this is going to be easy because the element is within the E object and then all
we need to do is just do a quick update.
So this is actually going to randomize where they're falling from.
So you can see that once they drop, they're not necessarily showing up in that same slot all the time.
Now there's a randomized effect to wherever it is positioned, and we also need to update it as well.
So we do have its left position, but we need to update that as well.
So instead of top, we'll update its X position accordingly.
So now as they drop, they're not always showing up within the same slot.
So a little bit more randomized.
And you can see this one is dropping in different spots.
Also, we can customize the way they look as we're creating them.
So we've got our function here where we're generating them.
We can generate different background colors.
So updating style and there's a quick formula that I'll show you in order to generate a random color.
So this is a hex value that we're expecting and we need to generate this random color so we can use
math random in order to accomplish that.
And that's what the formula is.
And it's going to be just one statement using math and string method in order to convert into a hex
value.
So we do math, random.
So math, random returns back are random values.
So zero decimal and a whole bunch of digits after that.
And if we use to string and two string 16, this is now returning back a string value.
But you can see it's within the hexadecimal format.
So then lastly, what we need to do is substring and this is going to substract part of the string that
we want.
And we want to only return back the last six characters so that we always have a six character hexadecimal
value that's being returned back and this is all generated randomly.
So now we can use that formula and place it within the background color.
So when we start the game, you're going to see that they're all randomized in color.
We can also randomize the height as well of the elements.
So that was another option that we have where we can set.
So we have a predefined height and using style height, we can update that value as well.
So let's set a random height of the element we can use math once again, Samantha's our goal to think
to create random values.
So we multiply it by 50.
Let's add 20 to that so that we have a minimum of at least 20 in height and actually change that to
50.
And I'm going to put it into a variable called Rande.
So that's more flexible and how we output it, as we can put it, into height as well as style line
height.
So when we adjust the line height, we've got random picks.
So we've got random heights for each one of the elements as they're dropping down.
So you can adjust this as needed.
So if you want to have it a minimum of 50, this is the way to set that as a minimum of 50.
So play through the game a few times, make sure that it's functioning as needed.
And coming up next with the Quick Code Review.