vanillatoasts
Advanced tools
Comparing version 1.3.0 to 1.4.0
{ | ||
"name": "vanillatoasts", | ||
"main": "vanillatoasts.js", | ||
"main": [ | ||
"vanillatoasts.js", | ||
"vanillatoasts.css" | ||
], | ||
"version": "1.0.1", | ||
@@ -5,0 +8,0 @@ "authors": [ |
{ | ||
"name": "vanillatoasts", | ||
"version": "1.3.0", | ||
"version": "1.4.0", | ||
"description": "Agnostic Javascript Library for Website Notifications", | ||
@@ -5,0 +5,0 @@ "main": "vanillatoasts.js", |
@@ -42,1 +42,22 @@ ![VanillaToasts](http://puu.sh/iwxpd/eeee838c88.png) | ||
``` | ||
## Positioning the toast | ||
To set a different position for the toast, use the `positionClass` property on the options of VanillaToast. | ||
``` | ||
// Create a toast | ||
let toast = VanillaToasts.create({ | ||
title: 'Welcome to my site', | ||
text: 'This toast will hide after 5000ms or when you click it', | ||
positionClass: 'bottomLeft' | ||
}); | ||
``` | ||
You can use any of the following values for the `positionClass` property: | ||
* topRight | ||
* topLeft | ||
* topCenter | ||
* bottomRight | ||
* bottomLeft | ||
* bottomCenter |
@@ -1,2 +0,2 @@ | ||
(function(root, factory) { | ||
(function (root, factory) { | ||
try { | ||
@@ -6,10 +6,10 @@ // commonjs | ||
module.exports = factory(); | ||
// global | ||
// global | ||
} else { | ||
root.VanillaToasts = factory(); | ||
} | ||
} catch(error) { | ||
} catch (error) { | ||
console.log('Isomorphic compatibility is not supported at this time for VanillaToasts.') | ||
} | ||
})(this, function() { | ||
})(this, function () { | ||
@@ -26,3 +26,3 @@ // We need DOM to be ready | ||
// In case toast creation is attempted before dom has finished loading! | ||
create: function() { | ||
create: function () { | ||
console.error([ | ||
@@ -34,3 +34,3 @@ 'DOM has not finished loading.', | ||
//function to manually set timeout after create | ||
setTimeout: function() { | ||
setTimeout: function () { | ||
console.error([ | ||
@@ -54,3 +54,3 @@ 'DOM has not finished loading.', | ||
// Replace create method when DOM has finished loading | ||
VanillaToasts.create = function(options) { | ||
VanillaToasts.create = function (options) { | ||
var toast = document.createElement('div'); | ||
@@ -85,2 +85,28 @@ toast.id = ++autoincrement; | ||
// position | ||
var position = options.positionClass | ||
switch (position) { | ||
case 'topLeft': | ||
container.classList.add('toasts-top-left'); | ||
break; | ||
case 'bottomLeft': | ||
container.classList.add('toasts-bottom-left'); | ||
break; | ||
case 'bottomRight': | ||
container.classList.add('toasts-bottom-right'); | ||
break; | ||
case 'topRight': | ||
container.classList.add('toasts-top-right'); | ||
break; | ||
case 'topCenter': | ||
container.classList.add('toasts-top-center'); | ||
break; | ||
case 'bottomCenter': | ||
container.classList.add('toasts-bottom-center'); | ||
break; | ||
default: | ||
container.classList.add('toasts-top-right'); | ||
break; | ||
} | ||
// click callback | ||
@@ -92,3 +118,3 @@ if (typeof options.callback === 'function') { | ||
// toast api | ||
toast.hide = function() { | ||
toast.hide = function () { | ||
toast.className += ' vanillatoasts-fadeOut'; | ||
@@ -129,4 +155,4 @@ toast.addEventListener('animationend', removeToast, false); | ||
*/ | ||
VanillaToasts.setTimeout = function(toastid, val) { | ||
if(VanillaToasts.toasts[toastid]){ | ||
VanillaToasts.setTimeout = function (toastid, val) { | ||
if (VanillaToasts.toasts[toastid]) { | ||
setTimeout(VanillaToasts.toasts[toastid].hide, val); | ||
@@ -133,0 +159,0 @@ } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
17103
283
62