From 4d89159568a354088fcf3f13c06005c324a65722 Mon Sep 17 00:00:00 2001 From: KOSASIH Date: Tue, 3 Dec 2024 22:26:35 +0700 Subject: [PATCH] Create notifications.js --- src/ui/notifications.js | 50 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 src/ui/notifications.js diff --git a/src/ui/notifications.js b/src/ui/notifications.js new file mode 100644 index 000000000..859d42b04 --- /dev/null +++ b/src/ui/notifications.js @@ -0,0 +1,50 @@ +// notifications.js + +class Notifications { + constructor() { + this.notifications = []; + this.init(); + } + + // Initialize the notification system + init() { + this.render(); + } + + // Add a new notification + addNotification(message) { + const notification = { + id: this.notifications.length + 1, + message, + timestamp: new Date(), + }; + this.notifications.push(notification); + this.renderNotification(notification); + } + + // Render the notification area + render() { + const notificationContainer = document.createElement('div'); + notificationContainer.id = 'notifications'; + notificationContainer.innerHTML = ` +

Notifications

+ + `; + document.body.appendChild(notificationContainer); + } + + // Render a single notification + renderNotification(notification) { + const notificationList = document.getElementById('notification-list'); + const notificationElement = document.createElement('li'); + notificationElement.innerText = `${notification.timestamp.toLocaleTimeString()}: ${notification.message}`; + notificationList.appendChild(notificationElement); + } +} + +// Example usage +const notifications = new Notifications(); +notifications.addNotification("Transaction of $200 completed."); +notifications.addNotification("New alert: Your account balance is low."); + +export default Notifications;