function addNotification(notificationText, notificationLevel) {
let notificationContainer = document.querySelector('.notifications');
// Set the different icons for the different notification levels
let successIcon = '';
let criticalIcon = '';
let warningIcon = '';
let infoIcon = '';
// Create notification element
let notification = document.createElement('div');
notification.classList.add('sniffle__notification');
notification.onclick = function() {
if (notification) {
notification.classList.add('hide');
setTimeout(function() {
notificationContainer.removeChild(notification);
}, 500);
}
};
// Create icon element and append to notification
let iconElement = document.createElement('span');
iconElement.classList.add('sniffle__notification-icon');
notification.appendChild(iconElement);
// Set the icon based on the notification level, not pretty but it works :3
if (notificationLevel === 1) {
notification.classList.add('success');
iconElement.innerHTML = successIcon;
} else if (notificationLevel === 2) {
notification.classList.add('critical');
iconElement.innerHTML = criticalIcon;
} else if (notificationLevel === 3) {
notification.classList.add('warning');
iconElement.innerHTML = warningIcon;
} else {
notification.classList.add('info');
iconElement.innerHTML = infoIcon;
}
// Create text element and append to notification
let description = document.createElement('span');
description.classList.add('sniffle__notification-text');
description.innerHTML = notificationText;
notification.appendChild(description);
// Append notification to container
notificationContainer.appendChild(notification);
setTimeout(function() { notification.classList.add('show'); }, 5);
// Remove notification after 5 seconds
setTimeout(function() {
if (notification) {
notification.classList.add('hide');
setTimeout(function() {
notificationContainer.removeChild(notification);
}, 500);
}
}, 5000);
}