Add game show route0:00
Okay, let's make use of the API to pull information about a single game. So let's go to our code, let's go to our routes file. And for show, I'm going to make a new route here. Let's say games, and let's give it a parameter of the slug. And let's say GameController::show, and say games.show. And we don't need this anymore. And let's go to GamesController, show. And we are taking in the slug here, so let's say slug. And let's change this, slug, say string.
And let's change this, slug, say string. Okay. And let's just return the view here. So return, view, show. And for our games here on the main page, we want to link to that specific game. So I'm just going to do it for the popular games. So these two links here. But you have to do it for the rest of these as well, in these components. So let's do it for popular games. If we go here, we have a link here, which is the image link.
So let's do it for popular games. If we go here, we have a link here, which is the image link. And we have one for the title as well. So let's do it in both places. So let's do route. And the route name is games.show. And the param is game. And there is a slug associated with the game as well. Let's see if this works. And undefined index.
Let's see if this works. And undefined index. We might have to change our query. Popular games. Let's see. Yeah, we have to grab the slug as well. So let's do that. And now this should work, hopefully. And it does. If you look at the bottom left, you'll see the slug being appended to the URL.
And it does. If you look at the bottom left, you'll see the slug being appended to the URL. So let's go to one. Let's go to Animal Crossing. And it does show the hardcoded view that we have already. Okay, so let's work from here. Let's grab this. And let's go back to our GamesController. And let's work our way from here. So if you want, you can make it a Livewire component as well, and have Livewire loaded.
Query API by slug2:19
And let's work our way from here. So if you want, you can make it a Livewire component as well, and have Livewire loaded asynchronously. But I'm just going to do it the old-fashioned way, since it's only one request to the server. So let's do this. And let's save it into a variable named game. Okay. And let me just reinvent this. So to get just one game, let's say fields star for now. And we just have to make a WHERE clause and query the slug.
So to get just one game, let's say fields star for now. And we just have to make a WHERE clause and query the slug. So WHERE slug equals. And we have the slug coming into the URL. So we can just do slug like this. And let's escape the double quotes here. And let's go ahead and dump the game and see if we get something back. Is this right? Okay. Let's do this.
Okay. Let's do this. dump game. And then we'll pass it in if everything looks correct. Okay. So let me refresh this. Okay. You see that we get this array back of all the fields. And as you see, it's just an array with one item. So if we pass in an incorrect slug, let me just add an S there.
Handle missing game3:31
And as you see, it's just an array with one item. So if we pass in an incorrect slug, let me just add an S there. You'll see it's an empty array. So we can do here is just check against that. So we can do abort if the array is empty, or we can just do empty, which checks if the array is empty. And then we'll say 404 if that's the case. So in this case, it should be a 404. Cool. And in the correct case, that should work.
Cool. And in the correct case, that should work. Okay. Cool. So now we can pass in the game or the first game that comes in the array. So game is game. The first one. Cool. And now this should be available in our view. So see if this still works.
Populate show view data4:26
And now this should be available in our view. So see if this still works. And it does. And now we can start changing this data out. So let's go to our show.blade.php. And let's start with the title here. So this should be gameName. And that should change the title to Animal Crossing. Cool. And let's get the correct image in here.
So let's fix that. Yeah, so it doesn't work because we have to grab the covers. So back to our controller. And if you remember to get the cover, we can just do cover.whatever field you want. So in our case, we want url. And you have to do that multiple times for the other tables you want to join. So I'm going to spare you that and just paste everything that we need.
So let's continue to fill out this information. So let's start with the genres. So back to our show.blade.php. And the genres go here. So I'm just going to do a foreach in here. And I'm going to refactor this, I think, in the next video. So let's just do a foreach. And I'm not sure why it indented like that. There is a genres key. So if you look at the array coming back,
There is a genres key. So if you look at the array coming back, there are genres in here. So let's loop over that. Game genres as genre. And this is a genre name. OK. See if that works. Oh, let's put a comma at the end, too. OK, so we have simulator.
So let's do that. So that would be within this span here. So let's do that. It's going to be game involved companies. It's going to be the first one, so 0. And we have a key of company. And we have another one called name. Let's close that out, see if that works. Should be Nintendo in this case. Cool.
So it should be outside here. OK, cool. So let me grab this. And we can do the same thing for the criticScore. Let's get rid of this. And let's do an if. And this one's called aggregatedRating. And it should be the same thing, but it's for the criticScore. Cool. So is that right?
See if this works. And if you open it, it seems to work. OK. I'm not going to wait for that to load. Now let's work on the screenshots here. So if you look at what's coming back, there is a screenshots key. And each one of these has information about a screenshot. So let's loop over that. So let me get rid of these hard-coded ones. And let's just loop over them.
So let me get rid of these hard-coded ones. And let's just loop over them. So that would be for each one of these divs. So let's do foreach $gameScreenshots as $screenshot. And let's look for where we did the replace for the cover. So let's grab this. And let's move this up. OK. And let's move this up. OK.
Render similar games14:20
the similarGames section. So if you look at what's coming back, there should be a section here for similarGames. And there is right here. So all we have to do is loop over it and output the correct data. So let's do that. Let's go into our similarGames section. So that should be right here. And I'm going to
one now. OK. And let's loop over that. So for each game key is similar games as game. Let's move this in there.
And this is the rating right here. So we have to check if it's set, because some games don't have ratings. So again, if isset, $gameRating, move this down here, and let's indent this, and let's add that $rating.
OK. And this is the platforms, which I already have above. So let me grab this. And replace this. And let's see if this works. So I think sometimes the platforms are not defined, so we got to do an if.
I think sometimes the platforms are not defined, so we got to do an if. I'm just going to paste that in. And if, and again, I'm going to clean this up in the next video. So we got to check for platforms on the game. See if this works.
Test and fix edge cases17:16
filled in this information for a single game. So let's just click around and make sure that it works for other games as well. So let's check FF7. Seems to work. Let's check Doom. And as you see, there is an undefined index here.
OK, it's not that. Sorry, I meant the cover here is what I meant. So let's do that. And yeah, it's one of these covers here. So yeah, we got to check for that too. So let's just do another if here. array_key_exists.
removing a lot of the logic in the views and moving it somewhere else.
