130 lines
4.3 KiB
JavaScript
130 lines
4.3 KiB
JavaScript
const notifs = await Service.import("notifications");
|
|
|
|
export default () => {
|
|
notifs.popupTimeout = 7000;
|
|
|
|
return Widget.Window({
|
|
name: "notifications-window",
|
|
class_name: "notifications-window",
|
|
layer: "overlay",
|
|
anchor: ["top","right"],
|
|
monitor: 2,
|
|
exclusivity: "ignore",
|
|
child: Widget.Box({
|
|
vertical: true,
|
|
class_name: "notification-card-container",
|
|
setup: (self) => {
|
|
self.hook(notifs, () => {
|
|
if (notifs.dnd) {
|
|
return;
|
|
}
|
|
|
|
const imageContainer = (notif) => {
|
|
if (notif.image !== undefined) {
|
|
return [
|
|
Widget.Box({
|
|
class_name: "notification-card-image-container",
|
|
hpack: "center",
|
|
vpack: "center",
|
|
vexpand: false,
|
|
child: Widget.Box({
|
|
hpack: "center",
|
|
vexpand: false,
|
|
class_name: "notification-card-image",
|
|
css: `background-image: url("${notif.image}")`,
|
|
}),
|
|
}),
|
|
];
|
|
}
|
|
|
|
return [];
|
|
};
|
|
|
|
const actionsContainer = (notif) => {
|
|
if (notif.actions !== undefined && notif.actions.length > 0) {
|
|
return [
|
|
Widget.Box({
|
|
class_name: "notification-card-actions",
|
|
hpack: "start",
|
|
children: notif.actions.map((action) => {
|
|
return Widget.Button({
|
|
class_name: "notification-action-buttons",
|
|
on_primary_click: () => {
|
|
notif.invoke(action.id);
|
|
},
|
|
child: Widget.Box({
|
|
hpack: "center",
|
|
children: [
|
|
Widget.Label({
|
|
class_name: "notification-action-buttons-label",
|
|
label: action.label,
|
|
}),
|
|
],
|
|
}),
|
|
});
|
|
}),
|
|
}),
|
|
];
|
|
}
|
|
|
|
return [];
|
|
};
|
|
|
|
return (self.children = notifs.popups.map((notif, index) => {
|
|
// FIX: Bottom part of notification gets cut of... need to find and fix culprit
|
|
return Widget.Box({
|
|
class_name: "notification-card",
|
|
children: [
|
|
...imageContainer(notif),
|
|
Widget.Box({
|
|
vertical: true,
|
|
class_name: "notification-card-content",
|
|
children: [
|
|
Widget.Box({
|
|
class_name: "notification-card-header",
|
|
children: [
|
|
Widget.Label({
|
|
class_name: "notification-card-header-label",
|
|
truncate: "end",
|
|
wrap: true,
|
|
label: notif["summary"],
|
|
}),
|
|
],
|
|
}),
|
|
Widget.Box({
|
|
class_name: "notification-card-body",
|
|
children: [
|
|
Widget.Label({
|
|
class_name: "notification-card-body-label",
|
|
useMarkup: true,
|
|
lines: 2,
|
|
wrap: true,
|
|
maxWidthChars: 30,
|
|
truncate: "end",
|
|
label: notif["body"],
|
|
}),
|
|
],
|
|
}),
|
|
...actionsContainer(notif),
|
|
Widget.Box({
|
|
class_name: "notification-card-appname",
|
|
children: [
|
|
Widget.Label({
|
|
class_name: "notification-card-appname-label",
|
|
truncate: "end",
|
|
wrap: true,
|
|
label: notif["app-name"].toUpperCase(),
|
|
}),
|
|
],
|
|
}),
|
|
],
|
|
}),
|
|
],
|
|
});
|
|
}));
|
|
});
|
|
},
|
|
}),
|
|
});
|
|
};
|