|
1
|
/*
|
|
2
|
* Toastr
|
|
3
|
* Copyright 2012-2015
|
|
4
|
* Authors: John Papa, Hans Fjällemark, and Tim Ferrell.
|
|
5
|
* All Rights Reserved.
|
|
6
|
* Use, reproduction, distribution, and modification of this code is subject to the terms and
|
|
7
|
* conditions of the MIT license, available at http://www.opensource.org/licenses/mit-license.php
|
|
8
|
*
|
|
9
|
* ARIA Support: Greta Krafsig
|
|
10
|
*
|
|
11
|
* Project: https://github.com/CodeSeven/toastr
|
|
12
|
*/
|
|
13
|
/* global define */
|
|
14
|
; (function (define) {
|
|
15
|
define(['jquery'], function ($) {
|
|
16
|
return (function () {
|
|
17
|
var $container;
|
|
18
|
var listener;
|
|
19
|
var toastId = 0;
|
|
20
|
var toastType = {
|
|
21
|
error: 'error',
|
|
22
|
info: 'info',
|
|
23
|
success: 'success',
|
|
24
|
warning: 'warning',
|
|
25
|
alert: 'alert'
|
|
26
|
};
|
|
27
|
|
|
28
|
var toastr = {
|
|
29
|
clear: clear,
|
|
30
|
remove: remove,
|
|
31
|
error: error,
|
|
32
|
getContainer: getContainer,
|
|
33
|
info: info,
|
|
34
|
options: {},
|
|
35
|
subscribe: subscribe,
|
|
36
|
success: success,
|
|
37
|
alert: alert,
|
|
38
|
version: '2.1.1',
|
|
39
|
warning: warning
|
|
40
|
};
|
|
41
|
|
|
42
|
var previousToast;
|
|
43
|
|
|
44
|
return toastr;
|
|
45
|
|
|
46
|
////////////////
|
|
47
|
|
|
48
|
function error(message, title, optionsOverride) {
|
|
49
|
return notify({
|
|
50
|
type: toastType.error,
|
|
51
|
iconClass: getOptions().iconClasses.error,
|
|
52
|
message: message,
|
|
53
|
optionsOverride: optionsOverride,
|
|
54
|
title: title
|
|
55
|
});
|
|
56
|
}
|
|
57
|
|
|
58
|
function getContainer(options, create) {
|
|
59
|
if (!options) { options = getOptions(); }
|
|
60
|
$container = $('#' + options.containerId);
|
|
61
|
if ($container.length) {
|
|
62
|
return $container;
|
|
63
|
}
|
|
64
|
if (create) {
|
|
65
|
$container = createContainer(options);
|
|
66
|
}
|
|
67
|
return $container;
|
|
68
|
}
|
|
69
|
|
|
70
|
function info(message, title, optionsOverride) {
|
|
71
|
return notify({
|
|
72
|
type: toastType.info,
|
|
73
|
iconClass: getOptions().iconClasses.info,
|
|
74
|
message: message,
|
|
75
|
optionsOverride: optionsOverride,
|
|
76
|
title: title
|
|
77
|
});
|
|
78
|
}
|
|
79
|
|
|
80
|
function subscribe(callback) {
|
|
81
|
listener = callback;
|
|
82
|
}
|
|
83
|
|
|
84
|
function alert(message, title, optionsOverride) {
|
|
85
|
return notify({
|
|
86
|
type: toastType.alert,
|
|
87
|
iconClass: "toast-alert",
|
|
88
|
message: message,
|
|
89
|
optionsOverride: optionsOverride,
|
|
90
|
title: title
|
|
91
|
});
|
|
92
|
}
|
|
93
|
|
|
94
|
function success(message, title, optionsOverride) {
|
|
95
|
return notify({
|
|
96
|
type: toastType.success,
|
|
97
|
iconClass: getOptions().iconClasses.success,
|
|
98
|
message: message,
|
|
99
|
optionsOverride: optionsOverride,
|
|
100
|
title: title
|
|
101
|
});
|
|
102
|
}
|
|
103
|
|
|
104
|
function warning(message, title, optionsOverride) {
|
|
105
|
return notify({
|
|
106
|
type: toastType.warning,
|
|
107
|
iconClass: getOptions().iconClasses.warning,
|
|
108
|
message: message,
|
|
109
|
optionsOverride: optionsOverride,
|
|
110
|
title: title
|
|
111
|
});
|
|
112
|
}
|
|
113
|
|
|
114
|
function clear($toastElement, clearOptions) {
|
|
115
|
var options = getOptions();
|
|
116
|
if (!$container) { getContainer(options); }
|
|
117
|
if (!clearToast($toastElement, options, clearOptions)) {
|
|
118
|
clearContainer(options);
|
|
119
|
}
|
|
120
|
}
|
|
121
|
|
|
122
|
function remove($toastElement) {
|
|
123
|
var options = getOptions();
|
|
124
|
if (!$container) { getContainer(options); }
|
|
125
|
if ($toastElement && $(':focus', $toastElement).length === 0) {
|
|
126
|
removeToast($toastElement);
|
|
127
|
return;
|
|
128
|
}
|
|
129
|
if ($container.children().length) {
|
|
130
|
$container.remove();
|
|
131
|
}
|
|
132
|
}
|
|
133
|
|
|
134
|
// internal functions
|
|
135
|
|
|
136
|
function clearContainer (options) {
|
|
137
|
var toastsToClear = $container.children();
|
|
138
|
for (var i = toastsToClear.length - 1; i >= 0; i--) {
|
|
139
|
clearToast($(toastsToClear[i]), options);
|
|
140
|
}
|
|
141
|
}
|
|
142
|
|
|
143
|
function clearToast ($toastElement, options, clearOptions) {
|
|
144
|
var force = clearOptions && clearOptions.force ? clearOptions.force : false;
|
|
145
|
if ($toastElement && (force || $(':focus', $toastElement).length === 0)) {
|
|
146
|
$toastElement[options.hideMethod]({
|
|
147
|
duration: options.hideDuration,
|
|
148
|
easing: options.hideEasing,
|
|
149
|
complete: function () { removeToast($toastElement); }
|
|
150
|
});
|
|
151
|
return true;
|
|
152
|
}
|
|
153
|
return false;
|
|
154
|
}
|
|
155
|
|
|
156
|
function createContainer(options) {
|
|
157
|
$container = $('<div/>')
|
|
158
|
.attr('id', options.containerId)
|
|
159
|
.addClass(options.positionClass)
|
|
160
|
.attr('aria-live', 'polite')
|
|
161
|
.attr('role', 'alert');
|
|
162
|
|
|
163
|
$container.appendTo($(options.target));
|
|
164
|
return $container;
|
|
165
|
}
|
|
166
|
|
|
167
|
function getDefaults() {
|
|
168
|
return {
|
|
169
|
tapToDismiss: true,
|
|
170
|
toastClass: 'toast',
|
|
171
|
containerId: 'toast-container',
|
|
172
|
debug: false,
|
|
173
|
|
|
174
|
showMethod: 'fadeIn', //fadeIn, slideDown, and show are built into jQuery
|
|
175
|
showDuration: 300,
|
|
176
|
showEasing: 'swing', //swing and linear are built into jQuery
|
|
177
|
onShown: undefined,
|
|
178
|
hideMethod: 'fadeOut',
|
|
179
|
hideDuration: 1000,
|
|
180
|
hideEasing: 'swing',
|
|
181
|
onHidden: undefined,
|
|
182
|
|
|
183
|
extendedTimeOut: 1000,
|
|
184
|
iconClasses: {
|
|
185
|
error: 'toast-error',
|
|
186
|
info: 'toast-info',
|
|
187
|
success: 'toast-success',
|
|
188
|
warning: 'toast-warning',
|
|
189
|
alert: 'toast-alert'
|
|
190
|
},
|
|
191
|
iconClass: 'toast-info',
|
|
192
|
positionClass: 'toast-top-right',
|
|
193
|
timeOut: 5000, // Set timeOut and extendedTimeOut to 0 to make it sticky
|
|
194
|
titleClass: 'toast-title',
|
|
195
|
messageClass: 'toast-message',
|
|
196
|
target: 'body',
|
|
197
|
closeHtml: '<button type="button">×</button>',
|
|
198
|
newestOnTop: true,
|
|
199
|
preventDuplicates: false,
|
|
200
|
progressBar: false
|
|
201
|
};
|
|
202
|
}
|
|
203
|
|
|
204
|
function publish(args) {
|
|
205
|
if (!listener) { return; }
|
|
206
|
listener(args);
|
|
207
|
}
|
|
208
|
|
|
209
|
function notify(map) {
|
|
210
|
var options = getOptions();
|
|
211
|
var iconClass = map.iconClass || options.iconClass;
|
|
212
|
|
|
213
|
if (typeof (map.optionsOverride) !== 'undefined') {
|
|
214
|
options = $.extend(options, map.optionsOverride);
|
|
215
|
iconClass = map.optionsOverride.iconClass || iconClass;
|
|
216
|
}
|
|
217
|
|
|
218
|
if (shouldExit(options, map)) { return; }
|
|
219
|
|
|
220
|
toastId++;
|
|
221
|
|
|
222
|
$container = getContainer(options, true);
|
|
223
|
|
|
224
|
var intervalId = null;
|
|
225
|
var $toastElement = $('<div/>');
|
|
226
|
var $titleElement = $('<div/>');
|
|
227
|
var $messageElement = $('<div/>');
|
|
228
|
var $progressElement = $('<div/>');
|
|
229
|
var $closeElement = $(options.closeHtml);
|
|
230
|
var progressBar = {
|
|
231
|
intervalId: null,
|
|
232
|
hideEta: null,
|
|
233
|
maxHideTime: null
|
|
234
|
};
|
|
235
|
var response = {
|
|
236
|
toastId: toastId,
|
|
237
|
state: 'visible',
|
|
238
|
startTime: new Date(),
|
|
239
|
options: options,
|
|
240
|
map: map
|
|
241
|
};
|
|
242
|
|
|
243
|
personalizeToast();
|
|
244
|
|
|
245
|
displayToast();
|
|
246
|
|
|
247
|
handleEvents();
|
|
248
|
|
|
249
|
publish(response);
|
|
250
|
|
|
251
|
if (options.debug && console) {
|
|
252
|
console.log(response);
|
|
253
|
}
|
|
254
|
|
|
255
|
return $toastElement;
|
|
256
|
|
|
257
|
function personalizeToast() {
|
|
258
|
setIcon();
|
|
259
|
setTitle();
|
|
260
|
setMessage();
|
|
261
|
setCloseButton();
|
|
262
|
setProgressBar();
|
|
263
|
setSequence();
|
|
264
|
}
|
|
265
|
|
|
266
|
function handleEvents() {
|
|
267
|
$toastElement.hover(stickAround, delayedHideToast);
|
|
268
|
if (!options.onclick && options.tapToDismiss) {
|
|
269
|
$toastElement.click(hideToast);
|
|
270
|
}
|
|
271
|
|
|
272
|
if (options.closeButton && $closeElement) {
|
|
273
|
$closeElement.click(function (event) {
|
|
274
|
if (event.stopPropagation) {
|
|
275
|
event.stopPropagation();
|
|
276
|
} else if (event.cancelBubble !== undefined && event.cancelBubble !== true) {
|
|
277
|
event.cancelBubble = true;
|
|
278
|
}
|
|
279
|
hideToast(true);
|
|
280
|
});
|
|
281
|
}
|
|
282
|
|
|
283
|
if (options.onclick) {
|
|
284
|
$toastElement.click(function () {
|
|
285
|
options.onclick();
|
|
286
|
hideToast();
|
|
287
|
});
|
|
288
|
}
|
|
289
|
}
|
|
290
|
|
|
291
|
function displayToast() {
|
|
292
|
$toastElement.hide();
|
|
293
|
|
|
294
|
$toastElement[options.showMethod](
|
|
295
|
{duration: options.showDuration, easing: options.showEasing, complete: options.onShown}
|
|
296
|
);
|
|
297
|
|
|
298
|
if (options.timeOut > 0) {
|
|
299
|
intervalId = setTimeout(hideToast, options.timeOut);
|
|
300
|
progressBar.maxHideTime = parseFloat(options.timeOut);
|
|
301
|
progressBar.hideEta = new Date().getTime() + progressBar.maxHideTime;
|
|
302
|
if (options.progressBar) {
|
|
303
|
progressBar.intervalId = setInterval(updateProgress, 10);
|
|
304
|
}
|
|
305
|
}
|
|
306
|
}
|
|
307
|
|
|
308
|
function setIcon() {
|
|
309
|
if (map.iconClass) {
|
|
310
|
$toastElement.addClass(options.toastClass).addClass(iconClass);
|
|
311
|
}
|
|
312
|
}
|
|
313
|
|
|
314
|
function setSequence() {
|
|
315
|
if (options.newestOnTop) {
|
|
316
|
$container.prepend($toastElement);
|
|
317
|
} else {
|
|
318
|
$container.append($toastElement);
|
|
319
|
}
|
|
320
|
}
|
|
321
|
|
|
322
|
function setTitle() {
|
|
323
|
if (map.title) {
|
|
324
|
$titleElement.append(map.title).addClass(options.titleClass);
|
|
325
|
$toastElement.append($titleElement);
|
|
326
|
}
|
|
327
|
}
|
|
328
|
|
|
329
|
function setMessage() {
|
|
330
|
if (map.message) {
|
|
331
|
$messageElement.append(map.message).addClass(options.messageClass);
|
|
332
|
$toastElement.append($messageElement);
|
|
333
|
}
|
|
334
|
}
|
|
335
|
|
|
336
|
function setCloseButton() {
|
|
337
|
if (options.closeButton) {
|
|
338
|
$closeElement.addClass('toast-close-button').attr('role', 'button');
|
|
339
|
$toastElement.prepend($closeElement);
|
|
340
|
}
|
|
341
|
}
|
|
342
|
|
|
343
|
function setProgressBar() {
|
|
344
|
if (options.progressBar) {
|
|
345
|
$progressElement.addClass('toast-progress');
|
|
346
|
$toastElement.prepend($progressElement);
|
|
347
|
}
|
|
348
|
}
|
|
349
|
|
|
350
|
function shouldExit(options, map) {
|
|
351
|
if (options.preventDuplicates) {
|
|
352
|
if (map.message === previousToast) {
|
|
353
|
return true;
|
|
354
|
} else {
|
|
355
|
previousToast = map.message;
|
|
356
|
}
|
|
357
|
}
|
|
358
|
return false;
|
|
359
|
}
|
|
360
|
|
|
361
|
function hideToast(override) {
|
|
362
|
if ($(':focus', $toastElement).length && !override) {
|
|
363
|
return;
|
|
364
|
}
|
|
365
|
clearTimeout(progressBar.intervalId);
|
|
366
|
return $toastElement[options.hideMethod]({
|
|
367
|
duration: options.hideDuration,
|
|
368
|
easing: options.hideEasing,
|
|
369
|
complete: function () {
|
|
370
|
removeToast($toastElement);
|
|
371
|
if (options.onHidden && response.state !== 'hidden') {
|
|
372
|
options.onHidden();
|
|
373
|
}
|
|
374
|
response.state = 'hidden';
|
|
375
|
response.endTime = new Date();
|
|
376
|
publish(response);
|
|
377
|
}
|
|
378
|
});
|
|
379
|
}
|
|
380
|
|
|
381
|
function delayedHideToast() {
|
|
382
|
if (options.timeOut > 0 || options.extendedTimeOut > 0) {
|
|
383
|
intervalId = setTimeout(hideToast, options.extendedTimeOut);
|
|
384
|
progressBar.maxHideTime = parseFloat(options.extendedTimeOut);
|
|
385
|
progressBar.hideEta = new Date().getTime() + progressBar.maxHideTime;
|
|
386
|
}
|
|
387
|
}
|
|
388
|
|
|
389
|
function stickAround() {
|
|
390
|
clearTimeout(intervalId);
|
|
391
|
progressBar.hideEta = 0;
|
|
392
|
$toastElement.stop(true, true)[options.showMethod](
|
|
393
|
{duration: options.showDuration, easing: options.showEasing}
|
|
394
|
);
|
|
395
|
}
|
|
396
|
|
|
397
|
function updateProgress() {
|
|
398
|
var percentage = ((progressBar.hideEta - (new Date().getTime())) / progressBar.maxHideTime) * 100;
|
|
399
|
$progressElement.width(percentage + '%');
|
|
400
|
}
|
|
401
|
}
|
|
402
|
|
|
403
|
function getOptions() {
|
|
404
|
return $.extend({}, getDefaults(), toastr.options);
|
|
405
|
}
|
|
406
|
|
|
407
|
function removeToast($toastElement) {
|
|
408
|
if (!$container) { $container = getContainer(); }
|
|
409
|
if ($toastElement.is(':visible')) {
|
|
410
|
return;
|
|
411
|
}
|
|
412
|
$toastElement.remove();
|
|
413
|
$toastElement = null;
|
|
414
|
if ($container.children().length === 0) {
|
|
415
|
$container.remove();
|
|
416
|
previousToast = undefined;
|
|
417
|
}
|
|
418
|
}
|
|
419
|
|
|
420
|
})();
|
|
421
|
});
|
|
422
|
}(typeof define === 'function' && define.amd ? define : function (deps, factory) {
|
|
423
|
if (typeof module !== 'undefined' && module.exports) { //Node
|
|
424
|
module.exports = factory(require('jquery'));
|
|
425
|
} else {
|
|
426
|
window['toastr'] = factory(window['jQuery']);
|
|
427
|
}
|
|
428
|
}));
|