Fix closeClass; New method: onCloseClickNoOnHidden

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "editor.tabSize": 4,
+}

README.md

@@ -44,7 +44,7 @@ npm install --save toastr
 
 ## Breaking Changes
 
-####Animation Changes
+#### Animation Changes
 The following animations options have been deprecated and should be replaced:
 
  - Replace `options.fadeIn` with `options.showDuration`
@@ -129,10 +129,17 @@ toastr.options.onclick = function() { console.log('clicked'); }
 toastr.options.onCloseClick = function() { console.log('close button clicked'); }
 ```
 
+#### Prevent onHidden from onCloseClick
+```
+toastr.options.onCloseClickNoOnHidden = true;
+```
+
+When true, prevents the execution of `onHidden`. This is useful when you have a different flow when user manually clicks on the close button and when the toastr fades away automatically.
+
 ### Animation Options
 Toastr will supply default animations, so you do not have to provide any of these settings. However you have the option to override the animations if you like.
 
-####Easings
+#### Easings
 Optionally override the animation easing to show or hide the toasts. Default is swing. swing and linear are built into jQuery.
 ```js
 toastr.options.showEasing = 'swing';
@@ -147,29 +154,29 @@ toastr.options.hideEasing = 'easeInBack';
 toastr.options.closeEasing = 'easeInBack';
 ```
 
-####Animation Method
+#### Animation Method
 Use the jQuery show/hide method of your choice. These default to fadeIn/fadeOut. The methods fadeIn/fadeOut, slideDown/slideUp, and show/hide are built into jQuery.
 ```js
 toastr.options.showMethod = 'slideDown';
 toastr.options.hideMethod = 'slideUp';
 toastr.options.closeMethod = 'slideUp';
 ```
 
-###Prevent Duplicates
+### Prevent Duplicates
 Rather than having identical toasts stack, set the preventDuplicates property to true. Duplicates are matched to the previous toast based on their message content.
 ```js
 toastr.options.preventDuplicates = true;
 ```
 
-###Timeouts
+### Timeouts
 Control how toastr interacts with users by setting timeouts appropriately. Timeouts can be disabled by setting them to 0.
 ```js
 toastr.options.timeOut = 30; // How long the toast will display without user interaction
 toastr.options.extendedTimeOut = 60; // How long the toast will display after a user hovers over it
 ```
 
 
-###Progress Bar
+### Progress Bar
 Visually indicate how long before a toast expires.
 ```js
 toastr.options.progressBar = true;
@@ -178,7 +185,7 @@ toastr.options.progressBar = true;
 ### rtl
 Flip the toastr to be displayed properly for right-to-left languages.
 ```js
-toastr.options.rtl = true; 
+toastr.options.rtl = true;
 ```
 
 ## Building Toastr

toastr.js

@@ -17,6 +17,8 @@
             var $container;
             var listener;
             var toastId = 0;
+            var closeClass = 'toast-close-button';
+            var userClickedCloseBtn = false;
             var toastType = {
                 error: 'error',
                 info: 'info',
@@ -121,14 +123,14 @@
 
             // internal functions
 
-            function clearContainer (options) {
+            function clearContainer(options) {
                 var toastsToClear = $container.children();
                 for (var i = toastsToClear.length - 1; i >= 0; i--) {
                     clearToast($(toastsToClear[i]), options);
                 }
             }
 
-            function clearToast ($toastElement, options, clearOptions) {
+            function clearToast($toastElement, options, clearOptions) {
                 var force = clearOptions && clearOptions.force ? clearOptions.force : false;
                 if ($toastElement && (force || $(':focus', $toastElement).length === 0)) {
                     $toastElement[options.hideMethod]({
@@ -185,7 +187,7 @@
                     escapeHtml: false,
                     target: 'body',
                     closeHtml: '<button type="button">&times;</button>',
-                    closeClass: 'toast-close-button',
+                    closeClass: closeClass,
                     newestOnTop: true,
                     preventDuplicates: false,
                     progressBar: false,
@@ -233,6 +235,8 @@
                     map: map
                 };
 
+                resetDefaults();
+
                 personalizeToast();
 
                 displayToast();
@@ -260,6 +264,10 @@
                         .replace(/>/g, '&gt;');
                 }
 
+                function resetDefaults() {
+                    userClickedCloseBtn = false;
+                }
+
                 function personalizeToast() {
                     setIcon();
                     setTitle();
@@ -276,7 +284,7 @@
                     switch (map.iconClass) {
                         case 'toast-success':
                         case 'toast-info':
-                            ariaValue =  'polite';
+                            ariaValue = 'polite';
                             break;
                         default:
                             ariaValue = 'assertive';
@@ -303,6 +311,7 @@
 
                             if (options.onCloseClick) {
                                 options.onCloseClick(event);
+                                userClickedCloseBtn = true;
                             }
 
                             hideToast(true);
@@ -321,7 +330,7 @@
                     $toastElement.hide();
 
                     $toastElement[options.showMethod](
-                        {duration: options.showDuration, easing: options.showEasing, complete: options.onShown}
+                        { duration: options.showDuration, easing: options.showEasing, complete: options.onShown }
                     );
 
                     if (options.timeOut > 0) {
@@ -372,7 +381,7 @@
 
                 function setCloseButton() {
                     if (options.closeButton) {
-                        $closeElement.addClass(options.closeClass).attr('role', 'button');
+                        $closeElement.addClass(closeClass).attr('role', 'button');
                         $toastElement.prepend($closeElement);
                     }
                 }
@@ -416,7 +425,7 @@
                         complete: function () {
                             removeToast($toastElement);
                             clearTimeout(intervalId);
-                            if (options.onHidden && response.state !== 'hidden') {
+                            if (options.onHidden && response.state !== 'hidden' && !(options.onCloseClickNoOnHidden && userClickedCloseBtn)) {
                                 options.onHidden();
                             }
                             response.state = 'hidden';
@@ -438,7 +447,7 @@
                     clearTimeout(intervalId);
                     progressBar.hideEta = 0;
                     $toastElement.stop(true, true)[options.showMethod](
-                        {duration: options.showDuration, easing: options.showEasing}
+                        { duration: options.showDuration, easing: options.showEasing }
                     );
                 }