JAVASCRIPT   68

Toastr js

Guest on 29th July 2022 01:40:11 PM

  1. /*
  2.  * Toastr
  3.  * Copyright
  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.  */*/* global define */*/
  13. ; (function (define) {
  14.     define(['jquery'], function ($) {
  15.         return (function () {
  16.             var $container;
  17.             var listener;
  18.             var toastId = 0;
  19.             var toastType = {
  20.                 primary: 'primary',
  21.                 error: 'error',
  22.                 info: 'info',
  23.                 success: 'success',
  24.                 warning: 'warning'
  25.             };
  26.  
  27.             var toastr = {
  28.                 clear: clear,
  29.                 remove: remove,
  30.                 primary: primary,
  31.                 error: error,
  32.                 getContainer: getContainer,
  33.                 info: info,
  34.                 options: {},
  35.                 subscribe: subscribe,
  36.                 success: success,
  37.                 version: '2.1.1',
  38.                 warning: warning
  39.             };
  40.  
  41.             var previousToast;
  42.  
  43.             return toastr;
  44.  
  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 primary(message, title, optionsOverride) {
  85.                return notify({
  86.                    type: toastType.primary,
  87.                    iconClass: getOptions().iconClasses.primary,
  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. s
  136.  
  137.             function clearContainer (options) {
  138.                 var toastsToClear = $container.children();
  139.                 for (var i = toastsToClear.length - 1; i >= 0; i--) {
  140.                     clearToast($(toastsToClear[i]), options);
  141.                 }
  142.             }
  143.  
  144.             function clearToast ($toastElement, options, clearOptions) {
  145.                 var force = clearOptions && clearOptions.force ? clearOptions.force : false;
  146.                 if ($toastElement && (force || $(':focus', $toastElement).length === 0)) {
  147.                     $toastElement[options.hideMethod]({
  148.                         duration: options.hideDuration,
  149.                         easing: options.hideEasing,
  150.                         complete: function () { removeToast($toastElement); }
  151.                     });
  152.                     return true;
  153.                 }
  154.                 return false;
  155.             }
  156.  
  157.             function createContainer(options) {
  158.                 $container = $('<div/>')
  159.                     .attr('id', options.containerId)
  160.                     .addClass(options.positionClass)
  161.                     .attr('aria-live', 'polite')
  162.                     .attr('role', 'alert');
  163.  
  164.                 $container.appendTo($(options.target));
  165.                 return $container;
  166.             }
  167.  
  168.             function getDefaults() {
  169.                 return {
  170.                     tapToDismiss: true,
  171.                     toastClass: 'toast',
  172.                     containerId: 'toast-container',
  173.                     debug: false,
  174.  
  175.                     showMethod: 'fadeIn'//fadeIn, slideDown, and show are built into jQuery
  176. y
  177.                     showDuration: 300,
  178.                     showEasing: 'swing'//swing and linear are built into jQuery
  179. y
  180.                     onShown: undefined,
  181.                     hideMethod: 'fadeOut',
  182.                     hideDuration: 1000,
  183.                     hideEasing: 'swing',
  184.                     onHidden: undefined,
  185.  
  186.                     extendedTimeOut: 1000,
  187.                     iconClasses: {
  188.                         primary: 'toast-primary',
  189.                         error: 'toast-error',
  190.                         info: 'toast-info',
  191.                         success: 'toast-success',
  192.                         warning: 'toast-warning'
  193.                     },
  194.                     iconClass: 'toast-info',
  195.                     positionClass: 'toast-top-right',
  196.                     timeOut: 5000// Set timeOut and extendedTimeOut to 0 to make it sticky
  197. y
  198.                     titleClass: 'toast-title',
  199.                     messageClass: 'toast-message',
  200.                     target: 'body',
  201.                     closeHtml: '<button type="button">&times;</button>',
  202.                     newestOnTop: true,
  203.                     preventDuplicates: false,
  204.                     progressBar: false
  205.                 };
  206.             }
  207.  
  208.             function publish(args) {
  209.                 if (!listener) { return; }
  210.                 listener(args);
  211.             }
  212.  
  213.             function notify(map) {
  214.                 var options = getOptions();
  215.                 var iconClass = map.iconClass || options.iconClass;
  216.  
  217.                 if (typeof (map.optionsOverride) !== 'undefined') {
  218.                     options = $.extend(options, map.optionsOverride);
  219.                     iconClass = map.optionsOverride.iconClass || iconClass;
  220.                 }
  221.  
  222.                 if (shouldExit(options, map)) { return; }
  223.  
  224.                 toastId++;
  225.  
  226.                 $container = getContainer(options, true);
  227.  
  228.                 var intervalId = null;
  229.                 var $toastElement = $('<div/>');
  230.                 var $titleElement = $('<div/>');
  231.                 var $messageElement = $('<div/>');
  232.                 var $progressElement = $('<div/>');
  233.                 var $closeElement = $(options.closeHtml);
  234.                 var progressBar = {
  235.                     intervalId: null,
  236.                     hideEta: null,
  237.                     maxHideTime: null
  238.                 };
  239.                 var response = {
  240.                     toastId: toastId,
  241.                     state: 'visible',
  242.                     startTime: new Date(),
  243.                     options: options,
  244.                     map: map
  245.                 };
  246.  
  247.                 personalizeToast();
  248.  
  249.                 displayToast();
  250.  
  251.                 handleEvents();
  252.  
  253.                 publish(response);
  254.  
  255.                 if (options.debug && console) {
  256.                     console.log(response);
  257.                 }
  258.  
  259.                 return $toastElement;
  260.  
  261.                 function personalizeToast() {
  262.                     setIcon();
  263.                     setTitle();
  264.                     setMessage();
  265.                     setCloseButton();
  266.                     setProgressBar();
  267.                     setSequence();
  268.                 }
  269.  
  270.                 function handleEvents() {
  271.                     $toastElement.hover(stickAround, delayedHideToast);
  272.                     if (!options.onclick && options.tapToDismiss) {
  273.                         $toastElement.click(hideToast);
  274.                     }
  275.  
  276.                     if (options.closeButton && $closeElement) {
  277.                         $closeElement.click(function (event) {
  278.                             if (event.stopPropagation) {
  279.                                 event.stopPropagation();
  280.                             } else if (event.cancelBubble !== undefined && event.cancelBubble !== true) {
  281.                                 event.cancelBubble = true;
  282.                             }
  283.                             hideToast(true);
  284.                         });
  285.                     }
  286.  
  287.                     if (options.onclick) {
  288.                         $toastElement.click(function () {
  289.                             options.onclick();
  290.                             hideToast();
  291.                         });
  292.                     }
  293.                 }
  294.  
  295.                 function displayToast() {
  296.                     $toastElement.hide();
  297.  
  298.                     $toastElement[options.showMethod](
  299.                         {duration: options.showDuration, easing: options.showEasing, complete: options.onShown}
  300.                     );
  301.  
  302.                     if (options.timeOut > 0) {
  303.                         intervalId = setTimeout(hideToast, options.timeOut);
  304.                         progressBar.maxHideTime = parseFloat(options.timeOut);
  305.                         progressBar.hideEta = new Date().getTime() + progressBar.maxHideTime;
  306.                         if (options.progressBar) {
  307.                             progressBar.intervalId = setInterval(updateProgress, 10);
  308.                         }
  309.                     }
  310.                 }
  311.  
  312.                 function setIcon() {
  313.                     if (map.iconClass) {
  314.                         $toastElement.addClass(options.toastClass).addClass(iconClass);
  315.                     }
  316.                 }
  317.  
  318.                 function setSequence() {
  319.                     if (options.newestOnTop) {
  320.                         $container.prepend($toastElement);
  321.                     } else {
  322.                         $container.append($toastElement);
  323.                     }
  324.                 }
  325.  
  326.                 function setTitle() {
  327.                     if (map.title) {
  328.                         $titleElement.append(map.title).addClass(options.titleClass);
  329.                         $toastElement.append($titleElement);
  330.                     }
  331.                 }
  332.  
  333.                 function setMessage() {
  334.                     if (map.message) {
  335.                         $messageElement.append(map.message).addClass(options.messageClass);
  336.                         $toastElement.append($messageElement);
  337.                     }
  338.                 }
  339.  
  340.                 function setCloseButton() {
  341.                     if (options.closeButton) {
  342.                         $closeElement.addClass('toast-close-button').attr('role', 'button');
  343.                         $toastElement.prepend($closeElement);
  344.                     }
  345.                 }
  346.  
  347.                 function setProgressBar() {
  348.                     if (options.progressBar) {
  349.                         $progressElement.addClass('toast-progress');
  350.                         $toastElement.prepend($progressElement);
  351.                     }
  352.                 }
  353.  
  354.                 function shouldExit(options, map) {
  355.                     if (options.preventDuplicates) {
  356.                         if (map.message === previousToast) {
  357.                             return true;
  358.                         } else {
  359.                             previousToast = map.message;
  360.                         }
  361.                     }
  362.                     return false;
  363.                 }
  364.  
  365.                 function hideToast(override) {
  366.                     if ($(':focus', $toastElement).length && !override) {
  367.                         return;
  368.                     }
  369.                     clearTimeout(progressBar.intervalId);
  370.                     return $toastElement[options.hideMethod]({
  371.                         duration: options.hideDuration,
  372.                         easing: options.hideEasing,
  373.                         complete: function () {
  374.                             removeToast($toastElement);
  375.                             if (options.onHidden && response.state !== 'hidden') {
  376.                                 options.onHidden();
  377.                             }
  378.                             response.state = 'hidden';
  379.                             response.endTime = new Date();
  380.                             publish(response);
  381.                         }
  382.                     });
  383.                 }
  384.  
  385.                 function delayedHideToast() {
  386.                     if (options.timeOut > 0 || options.extendedTimeOut > 0) {
  387.                         intervalId = setTimeout(hideToast, options.extendedTimeOut);
  388.                         progressBar.maxHideTime = parseFloat(options.extendedTimeOut);
  389.                         progressBar.hideEta = new Date().getTime() + progressBar.maxHideTime;
  390.                     }
  391.                 }
  392.  
  393.                 function stickAround() {
  394.                     clearTimeout(intervalId);
  395.                     progressBar.hideEta = 0;
  396.                     $toastElement.stop(true, true)[options.showMethod](
  397.                         {duration: options.showDuration, easing: options.showEasing}
  398.                     );
  399.                 }
  400.  
  401.                 function updateProgress() {
  402.                     var percentage = ((progressBar.hideEta - (new Date().getTime())) / progressBar.maxHideTime) * 100;
  403.                     $progressElement.width(percentage + ');
  404.                }
  405.            }
  406.  
  407.            function getOptions() {
  408.                return $.extend({}, getDefaults(), toastr.options);
  409.            }
  410.  
  411.            function removeToast($toastElement) {
  412.                if (!$container) { $container = getContainer(); }
  413.                if ($toastElement.is('(':visible')) {
  414.                     return;
  415.                 }
  416.                 $toastElement.remove();
  417.                 $toastElement = null;
  418.                 if ($container.children().length === 0) {
  419.                     $container.remove();
  420.                     previousToast = undefined;
  421.                 }
  422.             }
  423.  
  424.         })();
  425.     });
  426. }(typeof define === 'function' && define.amd ? define : function (deps, factory) {
  427.     if (typeof module !== 'undefined' && module.exports) //Node
  428. e
  429.         module.exports = factory(require('jquery'));
  430.     } else {
  431.         window['toastr'] = factory(window['jQuery']);
  432.     }
  433. })

Raw Paste


Login or Register to edit or fork this paste. It's free.