You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
2.1 KiB
47 lines
2.1 KiB
4 years ago
|
$(function () {
|
||
|
|
$('.jsdemo-notification-button button').on('click', function () {
|
||
|
|
var placementFrom = $(this).data('placement-from');
|
||
|
|
var placementAlign = $(this).data('placement-align');
|
||
|
|
var animateEnter = $(this).data('animate-enter');
|
||
|
|
var animateExit = $(this).data('animate-exit');
|
||
|
|
var colorName = $(this).data('color-name');
|
||
|
|
|
||
|
|
showNotification(colorName, null, placementFrom, placementAlign, animateEnter, animateExit);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
function showNotification(colorName, text, placementFrom, placementAlign, animateEnter, animateExit) {
|
||
|
|
if (colorName === null || colorName === '') { colorName = 'bg-black'; }
|
||
|
|
if (text === null || text === '') { text = 'Turning standard Bootstrap alerts'; }
|
||
|
|
if (animateEnter === null || animateEnter === '') { animateEnter = 'animated fadeInDown'; }
|
||
|
|
if (animateExit === null || animateExit === '') { animateExit = 'animated fadeOutUp'; }
|
||
|
|
var allowDismiss = true;
|
||
|
|
|
||
|
|
$.notify({
|
||
|
|
message: text
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: colorName,
|
||
|
|
allow_dismiss: allowDismiss,
|
||
|
|
newest_on_top: true,
|
||
|
|
timer: 1000,
|
||
|
|
placement: {
|
||
|
|
from: placementFrom,
|
||
|
|
align: placementAlign
|
||
|
|
},
|
||
|
|
animate: {
|
||
|
|
enter: animateEnter,
|
||
|
|
exit: animateExit
|
||
|
|
},
|
||
|
|
template: '<div data-notify="container" class="bootstrap-notify-container alert alert-dismissible {0} ' + (allowDismiss ? "p-r-35" : "") + '" role="alert">' +
|
||
|
|
'<button type="button" aria-hidden="true" class="close" data-notify="dismiss">×</button>' +
|
||
|
|
'<span data-notify="icon"></span> ' +
|
||
|
|
'<span data-notify="title">{1}</span> ' +
|
||
|
|
'<span data-notify="message">{2}</span>' +
|
||
|
|
'<div class="progress" data-notify="progressbar">' +
|
||
|
|
'<div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>' +
|
||
|
|
'</div>' +
|
||
|
|
'<a href="{3}" target="{4}" data-notify="url"></a>' +
|
||
|
|
'</div>'
|
||
|
|
});
|
||
|
|
}
|