Make Admin Template Documentation

## Notifications & Alert Message

Template use noty plugin, which is one of the most trusted notification plugins.

For more informations about options and methods, please visit plugin website:

Noty Documentation

## How to use Notification?

### 1. Add specific javascript

Add inside `body` at the end of your page, before main template scripts:

    <script src="assets/plugins/noty/jquery.noty.packaged.min.js"></script>

### 2. Create your notification via Javascript

All notification are made via javascript. It will permit you to define position, type of notification, your message... One example below:

    var n = noty({
        text        : '<div class="alert alert-success"><p><strong>Your message.</p></div>',
        layout      : 'top', //or left, right, bottom-right...
        theme       : 'made',
        maxVisible  : 10,
        animation   : {
            open  : 'animated bounceInLeft',
            close : 'animated bounceOutLeft'
        },
        timeout: 3000,
    });

Layouts available: top, bottom, left, right, center, topLeft, topRight, bottomLeft, bottomRight, centerLeft and centerRight.

Animation effects: you can choose all effects you want available here Animate CSS.

## Notification inside a Panel

If you want to have your notification inside a specific panel, you will have to indicate the notification container.

For example, if you want a notification inside a panel with an id `panel-notif`, your js code will be like:

    var n = $('#panel-notif').noty({
        text        : '<div class="alert alert-success media fade in"><p>Your message.</p></div>',
        layout      : 'top',
        theme       : 'made',
        animation   : {
            open  : 'animated bounceInLeft',
            close : 'animated bounceOutLeft'
        },
        timeout: 3000,
    });

## Notification Hiding Methods

There are 3 hiding methods: after a delay that you want, on click and with user confirmation (button).

1. After a Delay: just add your delay for timeout in milliseconds. For example 3000 for 3 seconds, like here:

    var n = noty({
        text   : '<div class="alert alert-success media fade in"><p>Your message.</p></div>',
        timeout: 3000,
    });

2. On click on notification: Just set timeout to false. It will be hide only onclick.

    var n = noty({
        text   : '<div class="alert alert-success media fade in"><p>Your message.</p></div>',
        timeout: false,
    });

3. With Button Confirmation: it could be interesting to ask for user confirmation. For example, are you sure you want to remove this? Here is an example:

    var n = noty({
        text   : '<div class="alert alert-success media fade in"><p>Your message.</p></div>',
        timeout: false,
        buttons: [{
                    addClass: 'btn btn-primary', text: 'Ok', onClick: function ($noty) {
                        $noty.close();
                    }
                },{
                    addClass: 'btn btn-danger', text: 'Cancel', onClick: function ($noty) {
                        $noty.close();
                    }
                }
            ],
    });