Implement persistent toast messages and ability to hide them manually (…

…#26)

* Implement persistent toast messages and ability to hide them manually

Signed-off-by: Julius Härtl <jus@bitgrid.net>

* Update version to 1.5.0

README.md

@@ -3,7 +3,7 @@
 ![forthebadge](https://forthebadge.com/images/badges/made-with-javascript.svg)
 ![forthebadge](https://forthebadge.com/images/badges/built-with-love.svg)
 
-[![toastify-js](https://img.shields.io/badge/toastify--js-1.4.0-brightgreen.svg)](https://www.npmjs.com/package/toastify-js)
+[![toastify-js](https://img.shields.io/badge/toastify--js-1.5.0-brightgreen.svg)](https://www.npmjs.com/package/toastify-js)
 
 Toastify is a lightweight, vanilla JS toast notification library.
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "toastify-js",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description":
     "Toastify is a lightweight, vanilla JS toast notification library.",
   "main": "./src/toastify.js",

src/toastify.css

@@ -1,5 +1,5 @@
 /*!
- * Toastify js 1.4.0
+ * Toastify js 1.5.0
  * https://github.com/apvarun/toastify-js
  * @license MIT licensed
  *
@@ -67,4 +67,4 @@
         right: 0;
         max-width: fit-content;
     }
-}
+}

src/toastify.js

@@ -1,5 +1,5 @@
 /*!
- * Toastify js 1.4.0
+ * Toastify js 1.5.0
  * https://github.com/apvarun/toastify-js
  * @license MIT licensed
  *
@@ -18,7 +18,7 @@
       return new Toastify.lib.init(options);
     },
     // Library version
-    version = "1.4.0";
+    version = "1.5.0";
 
   // Defining the prototype of the object
   Toastify.lib = Toastify.prototype = {
@@ -36,6 +36,8 @@
       // Creating the options object
       this.options = {};
 
+      this.toastElement = null;
+
       // Validating the options
       this.options.text = options.text || "Hi there!"; // Display message
       this.options.duration = options.duration || 3000; // Display duration
@@ -117,7 +119,7 @@
         );
 
         // Clear timeout while toast is focused
-        if (this.options.stopOnFocus) {
+        if (this.options.stopOnFocus && this.options.duration > 0) {
           const self = this;
           // stop countdown
           divElement.addEventListener(
@@ -177,7 +179,7 @@
     // Displaying the toast
     showToast: function() {
       // Creating the DOM object for the toast
-      var toastElement = this.buildToast();
+      this.toastElement = this.buildToast();
 
       // Getting the root element to with the toast needs to be added
       var rootElement;
@@ -193,23 +195,32 @@
       }
 
       // Adding the DOM element
-      rootElement.insertBefore(toastElement, rootElement.firstChild);
+      rootElement.insertBefore(this.toastElement, rootElement.firstChild);
 
       // Repositioning the toasts in case multiple toasts are present
       Toastify.reposition();
 
-      toastElement.timeOutValue = window.setTimeout(
-        function() {
-          // Remove the toast from DOM
-          this.removeElement(toastElement);
-        }.bind(this),
-        this.options.duration
-      ); // Binding `this` for function invocation
+      if (this.options.duration > 0) {
+        this.toastElement.timeOutValue = window.setTimeout(
+          function() {
+            // Remove the toast from DOM
+            this.removeElement(this.toastElement);
+          }.bind(this),
+          this.options.duration
+        ); // Binding `this` for function invocation
+      }
 
       // Supporting function chaining
       return this;
     },
 
+    hideToast: function() {
+      if (this.toastElement.timeOutValue) {
+        clearTimeout(this.toastElement.timeOutValue);
+      }
+      this.removeElement(this.toastElement);
+    },
+
     // Removing the element from the DOM
     removeElement: function(toastElement) {
       // Hiding the element