تماشای این درس نیاز به اشتراک حرفه‌ای دارد.

Install Flash Package0:00

Here's where we left off in the last lesson. So we'd like to display a flash message, but this flash function doesn't even exist yet. And then second, the message should be contingent upon whether the User is trusted or not, right? So if you're trusted, we can just say, hey, thanks for the contribution. If you're not, we'll say something like, okay, we'll approve it in a bit. All right, so we need to tackle all of these in this lesson. Let's begin by pulling in a package for this. composer require laracasts/flash. This is a very simple package, but it'll do the trick very nicely, and I think you'll like it.

Configure Provider and Test0:32

This is a very simple package, but it'll do the trick very nicely, and I think you'll like it. Okay, now, if we switch to the GitHub repo for this package, you'll see that, like most packages that have Laravel support, you need to update your providers array within the config/app.php file. So we'll do that, config/app.php. Scroll down to the list of providers right here, and then I'll paste it right here. So why don't we try this out? Let's go back to the controller, and then maybe even in the index method, I'm just going to say flash('testing testing').

Render Flash View0:59

Let's go back to the controller, and then maybe even in the index method, I'm just going to say flash testing testing. Okay, we're just about ready. But first, if we go back to the GitHub repo one more time, you can review some quick information on how to use it, but we do need to display the HTML, right? So we can see that you can write your own, of course, or we can include a view that the package provides. So why don't we do that? Let's go to app.blade.php, and maybe we'll put it right after the nav link. And you know what?

Let's go to app.blade.php, and maybe we'll put it right after the nav link. And you know what? We want it centered, so let's do this. Let's wrap it within a div with a class of container, and that'll set the margins, and maybe all content will be yielded within there as well. That means I can go back to community/index, and this container wrapper, yeah, we can get rid of that entirely. Okay, I think we're all set. So if we go back to Chrome and go to votinglesson.dev/community, there you go. We have a flash message.

So if we go back to Chrome and go to votinglesson.dev/community, there you go. We have a flash message. So just a quick overview of what you can do here. You can say flash just to flash a simple information message, or you can also set a level like success or danger or warning, like let's do warning. And what you're going to find is this is basically adding a class to the div, in this case alert warning. So for example, if I change this to danger, it'll add a class of alert danger. And if you're familiar with Twitter Bootstrap, that CSS library already comes with a bunch of styling for these classes, so it works together very, very easily.

Auto-Dismiss Flash Alerts3:31

Find any div with a class of alert, and let's give it a refresh. So you'll see that it has a class of alert, and then also, if you add that important flag, it'll add a class of alert important too. But we don't want to fade out this alert if it does have the important flag. Because we added it, that means, no, it should stay here until the user clicks it. So we're going to do this. Find any alerts, but not alert important. We can kind of filter those out. Then why don't we wait three seconds, and then fade it out over the course of 350 milliseconds. So yeah, simple jQuery.

Now, if you want it to be like Laracasts, what I do is I take that alert, and I position it absolutely with simple CSS in the bottom right corner. So it just sort of hovers over everything there. But yeah, any of these would be perfectly fine. So why don't we flash a success message? Now actually, you can write this in two ways. You can add basically the class here, or you could do something like this. Thanks for the contribution. And that will do the exact same thing. So flashSuccess, or flashWarning, or flashInfo, or info is the default.

And that will do the exact same thing. So flash success, or flash warning, or flash info, or info is the default. So that would be identical to just saying flash message. Yeah, either of these are fine. It's just what you want to do. Okay, so that takes care of the trusted path. But why don't we boot up php artisan tinker and find this User again? He's the latest one, so I should be able to do this. Yeah, there he is. All right, trusted is false.

Implement Overlay for Untrusted6:08

Yeah, there he is. All right, trusted is false. And save it. And now, it should do this. But remember how we said in the last lesson we want some kind of overlay, where it has a heading and then a body here? We can do this, flash overlay. And if we take a look at the method for that, yeah, you give it a message, you give it a title. And it should be reversed.

Enable Modal for Overlay6:50

Contribute it. But it didn't work. All right, let's go back to the documentation and see what we have here. So here's the documentation. Aha, this is only necessary if you do flashOverlay. So once again, you're just hooking into a jQuery plugin here. So if you want to do that, then at some point in your script, you have to call .modal on this flashOverlay. Okay, fair enough. So back to app.blade.php.

Okay, fair enough. So back to app.blade.php. Once again, you can put this code anywhere you want. I'm just putting it at the bottom of the file for now. Okay, so I think if we give this another shot, it should work. Final article and paste in a link. We contribute the link. They are not trusted, so we get a little modal here. Thanks. This contribution will be approved shortly.

دوست دارید گاهی خبرهای Laracasts را ایمیل کنیم؟