Wallogit.com
2017 © Pedro Peláez
An easy-to-use alert helper for your Laravel projects.
![Software License][ico-license]
![Total Downloads][ico-downloads], (*1)
An easy-to-use notification utility for your Laravel projects., (*2)
LaraToaster uses the Laravel Session class to create a Flash message from your controllers. When a message is detected, it will inject a Buefy Toast object and alert the user of your message., (*3)
This package requires that you have Vue, Bulma and Buefy installed in your Laravel project., (*4)
``` bash $ composer require theorythree/laratoaster, (*5)
### Step 2: Define the service provider and alias in your Laravel project This package takes advantage of the new _auto-discovery_ feature found in Laravel 5.5+. If you're using that version of Laravel, then you may skip this step and move on to Step 3. Add LaraToaster Service Provider to `config/app.php`. ``` php 'providers' => [ /* * Application Service Providers... */ TheoryThree\LaraToaster\LaraToasterServiceProvider::class, ];
Define the LaraToaster Alias in config/app.php., (*6)
'aliases' => [ /* * Aliases */ 'Toaster' => TheoryThree\LaraToaster\LaraToasterFacade::class, ];
Publish the configuration file to override the package defaults and install the LaraToaster.vue component., (*7)
$ php artisan vendor:publish --tag=laratoaster, (*8)
This command will generate a config file
config/laratoaster.phpand it will install the LaraToaster Vue componentresources/assets/js/components/LaraToaster.vue., (*9)
If you haven't already, install Buefy. Doing so will also install Bulma.
$ yarn add buefy, (*10)
Register the LaraToaster Vue Component in resources/assets/js/app.js., (*11)
// import BUEFY import Buefy from 'buefy' // Use Buefy Vue.use(Buefy) // Register LaraToast Vue Component Vue.component('laratoaster', require('./components/LaraToaster.vue').default); // Make sure to have a New Vue instance setup const app = new Vue({ el: '#app' });
Don't forget to run your compiler script to update your js files.
$ yarn run dev or $ yarn run watch, (*12)
LaraToaster can be used in your project whenever you need to notify the user of an event. Most commonly, in your CRUD controllers. LaraToaster uses the Session::flash method to set a Flash message., (*13)
Vue.component('laratoaster', require('./components/LaraToaster.vue')); in resources/assets/js/app.js
{!! Toaster::toast() !!} in your Blade templateString make( String $type, String $message ), (*14)
This method can be used in your Blade template in cases when you wish to show an alert message every time the view is loaded. This method does not rely on a Session so it will trigger the alert instantly upon page load., (*15)
Important, (*16)
The method returns a Vue component named
<laratoastert>, so you must make sure that you use{!! !!}instead of{{ }}to bracket the method in your Blade template or the returned string will be escaped., (*17)Also, you must put the tag within an instantiated Vue element. In the examples we're using a div with an id of #app., (*18)
String: The type of message to be displayed. Accepts any class name supported by Buefy (do not include is- in your type name). (Options: success, warning, danger, black,white, dark, light, info), (*19)
String: The alert message to be displayed., (*20)
``` js // resources/js/app.js // make sure the Vue component is registered Vue.component('laratoaster', require('./components/LaraToaster.vue'));, (*21)
// make sure the Vue is set to the HTML element contained in your Blade template // In this example, we're assuming a div with an id of #app. const app = new Vue({ el: '#app' });, (*22)
``` html{!! Toaster::make("success","Instant toast, made right in the template!") !!}
String toast(), (*23)
LaraToaster can also be used to rely on Session and this is more likely the setup you'll want to have in your projects. There are two parts to the setup. (1) the
toast()method call in your Blade templates (which serves as a placeholder for where the<laratoaster>element will be injected into your template) and (2) the use of one of the many method calls in your controllers., (*24)Below, we're using the
success()method because we're optimists., (*25)
Important, (*26)
The method returns a Vue component named
<laratoastert>, so you must make sure that you use{!! !!}instead of{{ }}to bracket the method in your Blade template or the returned string will be escaped., (*27)Also, you must put the tag within an instantiated Vue element. In the examples we're using a div with an id of #app., (*28)
``` js // resources/js/app.js // make sure the Vue component is registered Vue.component('laratoaster', require('./components/LaraToaster.vue'));, (*29)
// make sure the Vue is set to the HTML element contained in your Blade template // In this example, we're assuming a div with an id of #app. const app = new Vue({ el: '#app' });, (*30)
``` html{!! Toaster::toast() !!}
<?php
// controller example
namespace App\Http\Controllers;
use Toaster; // (1) include Toaster
use Session;
use Illuminate\Http\Request;
class ItemController extends Controller
{
// ...
public function store(Request $request)
{
// your store() method code
// (2) Call Toaster
Toaster::success("Your item was saved.");
return redirect()->route('items.show',$item->id);
}
}
String [success, warning, danger]( String $message ), (*31)
These methods can be used in your controller files to set the type of alert message you wish to trigger. In all cases the a Session Flash message will be set with the message you provide., (*32)
Important, (*33)
Do not forget to include
{!! Toaster::toast() !!}in your Blade template within an instantiated Vue element., (*34)
String: The alert message to be displayed., (*35)
``` html , (*36)
```php <?php /* Somewhere in your code probably a store(), update(), or destroy() method. */ Toaster::success("Success feels good!"); Toaster::warning("I got bad feeling about this."); Toaster::danger("I imagined that working out differently."); /* You can also use any of the other named functions that correspond with the Bulma status class names. */ Toaster::white("I don't see the world in black and white."); Toaster::black("Who turned out the lights?"); Toaster::light("I probably should be used on a dark background."); Toaster::dark("I probably should be used on a light background."); Toaster::info("I'm cool either way.");
Please see CHANGELOG for more information on what has changed recently., (*37)
All contributors welcome. If you would like to contribute to this package please feel to submit a pull request, submit an issue, or request a feature., (*38)
See our CONTRIBUTING and CODE_OF_CONDUCT for more details., (*39)
Want to get in touch to discuss this package, or another one you'd like us to build? Feel free to reach out to the maintainer of this package by emailing me at dan@theorythree.com, follow or @ me on Twitter @dmerfeld. I'd really like to hear from you. Honest., (*40)
The MIT License (MIT). Please see License File for more information., (*41)
An easy-to-use alert helper for your Laravel projects.
MIT
theorythree laratoaster
An easy-to-use alert helper for your Laravel projects.
MIT
theorythree laratoaster