Skip to content

Commit

Permalink
feat: notification toasts, fetch externals after UI startup
Browse files Browse the repository at this point in the history
  • Loading branch information
@zunderscore
zunderscore committed Jan 8, 2025
1 parent 30c4683 commit 13a42c0
Show file tree
Hide file tree
Showing 6 changed files with 99 additions and 47 deletions.
3 changes: 1 addition & 2 deletions src/backend/app-management/electron/events/when-ready.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -261,8 +261,7 @@ exports.whenReady = async () => {

windowManagement.updateSplashScreenStatus("Starting notification manager...");
const notificationManager = require("../../../notifications/notification-manager").default;
await notificationManager.loadAllNotifications();
notificationManager.startExternalNotificationCheck();
notificationManager.loadNotificationCache();

// get ui extension manager in memory
require("../../../ui-extensions/ui-extension-manager");
Expand Down
23 changes: 12 additions & 11 deletions src/backend/notifications/notification-manager.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,17 +61,21 @@ class NotificationManager {
};

constructor() {
frontendCommunicator.on("get-all-notifications", () => {
frontendCommunicator.on("notifications:get-all-notifications", () => {
return this.getNotifications();
});

frontendCommunicator.on("mark-notification-as-read", (id: string) => {
frontendCommunicator.on("notifications:mark-notification-as-read", (id: string) => {
this.markNotificationAsRead(id);
});

frontendCommunicator.on("delete-notification", (id: string) => {
frontendCommunicator.on("notifications:delete-notification", (id: string) => {
this.deleteNotification(id);
});

frontendCommunicator.on("notifications:start-external-notification-check", () => {
this.startExternalNotificationCheck();
});
}

private getNotificationDb(): JsonDB {
Expand Down Expand Up @@ -113,7 +117,7 @@ class NotificationManager {
};

this. _notificationCache.notifications.push(newNotification);
frontendCommunicator.send("new-notification", newNotification);
frontendCommunicator.send("notifications:new-notification", newNotification);
this.saveNotifications();

return newNotification;
Expand All @@ -134,7 +138,7 @@ class NotificationManager {

this.saveNotifications();

frontendCommunicator.send("notification-deleted", id);
frontendCommunicator.send("notifications:notification-deleted", id);
}

markNotificationAsRead(id: string): void {
Expand All @@ -145,7 +149,7 @@ class NotificationManager {
this.saveNotifications();
}

frontendCommunicator.send("notification-marked-as-read", id);
frontendCommunicator.send("notifications:notification-marked-as-read", id);
}

getNotification(id: string): Notification | null {
Expand Down Expand Up @@ -191,13 +195,10 @@ class NotificationManager {
}
}

async loadAllNotifications(): Promise<void> {
this.loadNotificationCache();
await this.loadExternalNotifications();
}

startExternalNotificationCheck(): void {
if (this._externalCheckInterval == null) {
this.loadExternalNotifications();

this._externalCheckInterval = setInterval(
() => this.loadExternalNotifications(), 5 * 60 * 1000);
}
Expand Down
24 changes: 2 additions & 22 deletions ...directives/controls/notificationCenter.js → ...irectives/controls/notification-center.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -119,27 +119,7 @@
}
};

const getIconClass = (type) => {
const NotificationType = notificationService.NotificationType;
let iconClass = "";
switch (type) {
case NotificationType.UPDATE:
iconClass = "download";
break;
case NotificationType.ALERT:
iconClass = "exclamation-circle";
break;
case NotificationType.TIP:
iconClass = "question-circle";
break;
case NotificationType.INFO:
default:
iconClass = "info-circle";
}
return `fa-${iconClass}`;
};

$scope.getIconClass = getIconClass;
$scope.getIconClass = notificationService.getIconClass;

ctrl.openNotification = (notification, index) => {
notificationService.markNotificationAsRead(notification.id);
Expand All @@ -149,7 +129,7 @@
resolveObj: {
notification: () => notification,
index: () => index,
iconClass: () => getIconClass(notification.type)
iconClass: () => notificationService.getIconClass(notification.type)
},
controllerFunc: (
$scope,
Expand Down
2 changes: 1 addition & 1 deletion src/gui/app/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -186,7 +186,7 @@
<script type="text/javascript" src="./directives/controls/firebot-radios.js"></script>
<script type="text/javascript" src="./directives/controls/firebot-select.js"></script>
<script type="text/javascript" src="./directives/controls/multiselect.js"></script>
<script type="text/javascript" src="./directives/controls/notificationCenter.js"></script>
<script type="text/javascript" src="./directives/controls/notification-center.js"></script>
<script type="text/javascript" src="./directives/controls/role-based/role-number.js"></script>
<script type="text/javascript" src="./directives/controls/role-based/role-numbers.js"></script>
<script type="text/javascript" src="./directives/controls/role-based/role-percentage.js"></script>
Expand Down
72 changes: 64 additions & 8 deletions src/gui/app/services/notification.service.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@

angular
.module("firebotApp")
.factory("notificationService", function(backendCommunicator) {
.factory("notificationService", function(backendCommunicator, ngToast) {
const service = {};
let notificationCache = [];

Expand All @@ -27,32 +27,88 @@
};

service.markNotificationAsRead = (id) => {
backendCommunicator.send("mark-notification-as-read", id);
backendCommunicator.send("notifications:mark-notification-as-read", id);
};

service.deleteNotification = (id) => {
backendCommunicator.send("delete-notification", id);
backendCommunicator.send("notifications:delete-notification", id);
};

service.loadAllNotifications = () => {
notificationCache = backendCommunicator.fireEventSync("get-all-notifications") ?? [];
notificationCache = backendCommunicator.fireEventSync("notifications:get-all-notifications") ?? [];
};

backendCommunicator.on("new-notification", (notification) => {
service.getIconClass = (type) => {
let iconClass = "";
switch (type) {
case NotificationType.UPDATE:
iconClass = "download";
break;
case NotificationType.ALERT:
iconClass = "exclamation-circle";
break;
case NotificationType.TIP:
iconClass = "question-circle";
break;
case NotificationType.INFO:
default:
iconClass = "info-circle";
}
return `fa-${iconClass}`;
};

backendCommunicator.on("notifications:new-notification", (notification) => {
notificationCache.push(notification);
let toastClass;

switch (notification.type) {
case NotificationType.ALERT:
toastClass = "danger";
break;

case NotificationType.UPDATE:
toastClass = "warn";
break;

case NotificationType.TIP:
toastClass = "success";
break;

case NotificationType.INFO:
default:
toastClass = "info";
}

const content = `<div class="rich-toast">
${notification.title?.length ? `<div class="rich-toast-header">${notification.title}</div>` : ``}
<div class="rich-toast-body">
<div class="modal-icon"><i class="fad ${service.getIconClass(notification.type)}" aria-hidden="true"></i></div>
<div class="rich-toast-body-content">${notification.message}</div>
</div>
</div>`;

ngToast.create({
className: toastClass,
content: content,
dismissOnTimeout: false,
dismissOnClick: false,
dismissButton: true
});
});

backendCommunicator.on("notification-marked-as-read", (id) => {
backendCommunicator.on("notifications:notification-marked-as-read", (id) => {
const notification = notificationCache.find(n => n.id === id);
if (notification != null) {
notification.read = true;
}
});

backendCommunicator.on("notification-deleted", (id) => {
backendCommunicator.on("notifications:notification-deleted", (id) => {
notificationCache = notificationCache.filter(n => n.id !== id);
});

backendCommunicator.send("notifications:start-external-notification-check");

return service;
});
}());
}());
22 changes: 19 additions & 3 deletions src/gui/scss/core/_title-bar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,24 @@
margin-top: 40px !important;
}

.rich-toast {
max-width: 400px !important;
}

.rich-toast-header {
font-size: 1.2em;
font-weight: bold;
margin-bottom: 10px;
}

.rich-toast-body {
display: flex;
}

.rich-toast-body-content {
text-align: left;
}

.cet-window-icon {
display: none !important;
}
Expand All @@ -24,6 +42,4 @@
.cet-menubar {
margin-right: auto;
}
}


}

0 comments on commit 13a42c0

Please sign in to comment.