parent
4dd2f9dd57
commit
f2d70137ea
@ -1,35 +1,25 @@
|
|||||||
const button = document.getElementById('button')
|
const button = document.getElementById('button')
|
||||||
const toasts = document.getElementById('toasts')
|
const toasts = document.getElementById('toasts')
|
||||||
|
|
||||||
const messages = [
|
const messages = ['Message One', 'Message Two', 'Message Three', 'Message Four']
|
||||||
'Message One',
|
|
||||||
'Message Two',
|
|
||||||
'Message Three',
|
|
||||||
'Message Four',
|
|
||||||
]
|
|
||||||
|
|
||||||
const types = ['info', 'success', 'error']
|
const types = ['info', 'success', 'error']
|
||||||
|
|
||||||
|
// pick a random item from an array
|
||||||
|
const getRandomItem = (array) => array[Math.floor(Math.random() * array.length)]
|
||||||
|
|
||||||
button.addEventListener('click', () => createNotification())
|
button.addEventListener('click', () => createNotification())
|
||||||
|
|
||||||
function createNotification(message = null, type = null) {
|
function createNotification(message = null, type = null) {
|
||||||
const notif = document.createElement('div')
|
const notif = document.createElement('div')
|
||||||
notif.classList.add('toast')
|
notif.classList.add('toast')
|
||||||
notif.classList.add(type ? type : getRandomType())
|
notif.classList.add(type ? type : getRandomItem(types))
|
||||||
|
|
||||||
notif.innerText = message ? message : getRandomMessage()
|
|
||||||
|
|
||||||
toasts.appendChild(notif)
|
notif.innerText = message ? message : getRandomItem(messages)
|
||||||
|
|
||||||
setTimeout(() => {
|
toasts.appendChild(notif)
|
||||||
notif.remove()
|
|
||||||
}, 3000)
|
|
||||||
}
|
|
||||||
|
|
||||||
function getRandomMessage() {
|
|
||||||
return messages[Math.floor(Math.random() * messages.length)]
|
|
||||||
}
|
|
||||||
|
|
||||||
function getRandomType() {
|
setTimeout(() => {
|
||||||
return types[Math.floor(Math.random() * types.length)]
|
notif.remove()
|
||||||
|
}, 3000)
|
||||||
}
|
}
|
Loading…
Reference in new issue