1 |
95b003ff
|
Origo
|
/*
|
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 |
48fcda6b
|
Origo
|
warning: 'warning',
|
25 |
|
|
alert: 'alert'
|
26 |
95b003ff
|
Origo
|
};
|
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 |
48fcda6b
|
Origo
|
alert: alert,
|
38 |
95b003ff
|
Origo
|
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 |
48fcda6b
|
Origo
|
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 |
95b003ff
|
Origo
|
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 |
48fcda6b
|
Origo
|
warning: 'toast-warning',
|
189 |
|
|
alert: 'toast-alert'
|
190 |
95b003ff
|
Origo
|
},
|
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 |
|
|
}));
|