LaracastsFlash, per informare al meglio gli utenti della nostra applicazione!

0
112

Ti ritrovi spesso nella posizione di dover informare gli utenti, in risposta a qualche azione o evento particolare?

Oggi vedremo insieme un nuovo strumento a nostra disposizione, il package laracastsflash.

Installazione

Per prima cosa aggiungi il package al file composer.json, ed esegui composer update:

“require”: {
“laracasts/flash”: “~1.0”
}

Successivamente, dopo aver eseguito da terminale il comando composer update, aggiungiamo il service provider all’interno dell’array providers del file app.php:

‘providers’ => [
‘LaracastsFlashFlashServiceProvider’
];

Per convenienza, inoltre, aggiungi la facades associata al package così:

‘aliases’ => [
‘Flash’ => ‘LaracastsFlashFlash’
];

Uso

Supponiamo di aver creato un controller per gestire le registrazioni degli utenti al nostro sito.

All’interno del metodo store, prima di eseguire il redirect, aggiungiamo:

class RegisterController {
public function store()
{
Flash::message(‘Welcome Aboard!’);

return Redirect::home();
}
}

Oltre al metodo Flash::message hai a disposizione altri metodi. Vediamoli:

Flash::info(‘Message’)
Flash::success(‘Message’)
Flash::error(‘Message’)
Flash::warning(‘Message’)

Ed un metodo speciale (lo vedrai in azione a fine articolo):

Flash::overlay(‘Modal Message’, ‘Modal Title’)

Ogni metodo visto, memorizza in sessione, le seguenti chiavi:

  • flash_notification.message – Il messaggio che vogliamo mostrare all’utente
  • flash_notification.level – Una stringa rappresentante il tipo di avviso (utile per applicare una classe css al codice HTML)

Nota: Servendosi di Twitter Bottstrap ‘flash_notification.level’ assumerà i seguenti valori: alert-info, alert-success, alert-danger e alert-warning, che rappresentano le classi di default per la visualizzazione di box di alert.

Una volta memorizzato nella sessione il messaggio, siamo pronti a visualizzarlo all’interno delle nostre view.

Il template utilizzato di default è il seguente:

@if (Session::has(‘flash_notification.message’))

{{ Session::get(‘flash_notification.message’) }}

@endif

Nota: questo package è ottimizzato per Twitter Bootstrap.

Poichè i messaggi di avviso sono comuni in un applicazione web, che interagisce con gli utenti, anziché riscrivere ogni volta il codice appena visto, puoi usare (o modificare) il template che questo package offre.

Basta includerlo nelle view in questo modo:

@include(‘flash::message’)

Non stai usando Bootstrap ? Ahia! Allora non puoi usare questo package…

… scherzo! Se non ancora usi Twitter Bootstrap, puoi modificare i layouts dei messaggi.

Per farlo digita da console :

php artisan view:publish laracasts/flash

In questo modo avrai a disposizione le views utilizzate, e potrai facilmente modificarne il codice html. Ad maiora!

Esempio

Vediamo insieme un esempio pratico di utilizzo di questo package.

Creiamo una view per la registrazione di utenti al nostro sito. Aggiungiamo un campo per l’username e l’email, ed uno per la password, in questo modo:

{{ Form::open() }}




{{ Form::close() }}

Il nostro controller avrà un metodo destinato alla gestione della registrazione:

public function register()
{
// validazione dati
$validator = Validator::make(Input::all(), [‘username’ => ‘required’, ‘email’ => ‘required’, ‘password’ => ‘required]);

if ($validator->fails())
{
// Impostare il messaggio di errore
return Redirect::back()->withInput()->withErrors($validator);
}

// Impostare il messaggio di registrazione effettuata
return Redirect::back();
}

Ora, come ti ho spiegato ad inizio articolo, dobbiamo inserire il nostro messaggio per l’utente, prima del redirect.

Per prima cosa aggiungi il messaggio in caso la validazione fallisca:

if ($validator->fails())
{
// Impostare il messaggio di errore
Flash::error(‘Attenzione i dati inseriti non sono validi !’);

return Redirect::back()->withInput()->withErrors($validator);
}

Non abbiamo ancora finito. C’è da sistemare il caso in cui i dati inseriti sono corretti.

Hai due scelte in questo caso.

Puoi usare il metodo Flash::message o Flash::info oppure Flash::success.

// Impostare il messaggio di registrazione effettuata
Flash::success(‘Yuppy! Benvenuto nella mia fantastica applicazione!’);

return Redirect::back();

Sistemato il nostro controller, andiamo a modificare la nostra view.

Aggiungiamo il template (per evitare ripetizioni di codice HTML), in questo modo:

@include(‘flash::message’)

{{ Form::open() }}




{{ Form::close() }}

Ti dirò di più, non abbiamo ancora finito. È rimasto un altro metodo da esaminare in dettaglio. Sto parlando di Flash::overlay.

L’utilizzo di questo metodo prevede obbligatoriamente l’uso di jquery e delle librerie js di Twitter Boostrap.

Tutto quello che dovrai fare sarà aggiungere questa riga di codice nel tuo template.

Et voilà! Il gioco è fatto. Abbiamo il nostro bel modal che ci avvisa se qualcosa è andata male oppure no.

Spero che questo package possa esserti utile: se hai qualche osservazione, feedback o semplice parere commenta qui sotto!