feat: on hover only show actions if available on notifications (#396)
* feat: on hover only show actions if available on notifications * feat: on hover only show actions if available on notifications * fix: make the change configurable * fix: remove unneeded op
This commit is contained in:
@@ -12,7 +12,7 @@ import { filterNotifications } from 'lib/shared/notifications.js';
|
||||
import Scrollable from 'types/widgets/scrollable.js';
|
||||
import { Attribute, Child } from 'lib/types/widget.js';
|
||||
|
||||
const { displayedTotal, ignore } = options.notifications;
|
||||
const { displayedTotal, ignore, showActionsOnHover } = options.notifications;
|
||||
|
||||
const NotificationCard = (notifs: Notifications, curPage: Variable<number>): Scrollable<Child, Attribute> => {
|
||||
return Widget.Scrollable({
|
||||
@@ -30,8 +30,9 @@ const NotificationCard = (notifs: Notifications, curPage: Variable<number>): Scr
|
||||
curPage.bind('value'),
|
||||
displayedTotal.bind('value'),
|
||||
ignore.bind('value'),
|
||||
showActionsOnHover.bind('value'),
|
||||
],
|
||||
(notifications, currentPage, dispTotal, ignoredNotifs) => {
|
||||
(notifications, currentPage, dispTotal, ignoredNotifs, showActions) => {
|
||||
const filteredNotifications = filterNotifications(notifications, ignoredNotifs);
|
||||
|
||||
const sortedNotifications = filteredNotifications.sort((a, b) => b.time - a.time);
|
||||
@@ -45,27 +46,49 @@ const NotificationCard = (notifs: Notifications, curPage: Variable<number>): Scr
|
||||
return (self.children = sortedNotifications
|
||||
.slice(pageStart, pageEnd)
|
||||
.map((notif: Notification) => {
|
||||
return Widget.Box({
|
||||
class_name: 'notification-card-content-container',
|
||||
children: [
|
||||
Widget.Box({
|
||||
class_name: 'notification-card menu',
|
||||
vpack: 'start',
|
||||
hexpand: true,
|
||||
vexpand: false,
|
||||
children: [
|
||||
Image(notif),
|
||||
Widget.Box({
|
||||
vpack: 'center',
|
||||
vertical: true,
|
||||
hexpand: true,
|
||||
class_name: `notification-card-content ${!notifHasImg(notif) ? 'noimg' : ' menu'}`,
|
||||
children: [Header(notif), Body(notif), Actions(notif, notifs)],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
CloseButton(notif, notifs),
|
||||
],
|
||||
const actionsbox =
|
||||
notif.actions.length > 0
|
||||
? Widget.Revealer({
|
||||
transition: 'slide_down',
|
||||
reveal_child: showActions ? false : true,
|
||||
child: Widget.EventBox({
|
||||
child: Actions(notif, notifs),
|
||||
}),
|
||||
})
|
||||
: null;
|
||||
|
||||
return Widget.EventBox({
|
||||
on_hover() {
|
||||
if (actionsbox && showActions) actionsbox.reveal_child = true;
|
||||
},
|
||||
on_hover_lost() {
|
||||
if (actionsbox && showActions) actionsbox.reveal_child = false;
|
||||
},
|
||||
child: Widget.Box({
|
||||
class_name: 'notification-card-content-container',
|
||||
children: [
|
||||
Widget.Box({
|
||||
class_name: 'notification-card menu',
|
||||
vpack: 'start',
|
||||
hexpand: true,
|
||||
vexpand: false,
|
||||
children: [
|
||||
Image(notif),
|
||||
Widget.Box({
|
||||
vpack: 'center',
|
||||
vertical: true,
|
||||
hexpand: true,
|
||||
class_name: `notification-card-content ${!notifHasImg(notif) ? 'noimg' : ' menu'}`,
|
||||
|
||||
children: actionsbox
|
||||
? [Header(notif), Body(notif), actionsbox]
|
||||
: [Header(notif), Body(notif)],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
CloseButton(notif, notifs),
|
||||
],
|
||||
}),
|
||||
});
|
||||
}));
|
||||
},
|
||||
|
||||
@@ -14,7 +14,8 @@ import Box from 'types/widgets/box.js';
|
||||
import { Attribute, Child } from 'lib/types/widget.js';
|
||||
const hyprland = await Service.import('hyprland');
|
||||
|
||||
const { position, timeout, cache_actions, monitor, active_monitor, displayedTotal, ignore } = options.notifications;
|
||||
const { position, timeout, cache_actions, monitor, active_monitor, displayedTotal, ignore, showActionsOnHover } =
|
||||
options.notifications;
|
||||
|
||||
const curMonitor = Variable(monitor.value);
|
||||
|
||||
@@ -50,15 +51,32 @@ export default (): Window<Box<Child, Attribute>, unknown> => {
|
||||
hexpand: true,
|
||||
setup: (self) => {
|
||||
Utils.merge(
|
||||
[notifs.bind('popups'), ignore.bind('value')],
|
||||
(notifications: Notification[], ignoredNotifs: string[]) => {
|
||||
[notifs.bind('popups'), ignore.bind('value'), showActionsOnHover.bind('value')],
|
||||
(notifications: Notification[], ignoredNotifs: string[], showActions: boolean) => {
|
||||
const filteredNotifications = filterNotifications(notifications, ignoredNotifs);
|
||||
|
||||
return (self.children = filteredNotifications.slice(0, displayedTotal.value).map((notif) => {
|
||||
const actionsbox =
|
||||
notif.actions.length > 0
|
||||
? Widget.Revealer({
|
||||
transition: 'slide_down',
|
||||
reveal_child: showActions ? false : true,
|
||||
child: Widget.EventBox({
|
||||
child: Action(notif, notifs),
|
||||
}),
|
||||
})
|
||||
: null;
|
||||
|
||||
return Widget.EventBox({
|
||||
on_secondary_click: () => {
|
||||
notifs.CloseNotification(notif.id);
|
||||
},
|
||||
on_hover() {
|
||||
if (actionsbox && showActions) actionsbox.reveal_child = true;
|
||||
},
|
||||
on_hover_lost() {
|
||||
if (actionsbox && showActions) actionsbox.reveal_child = false;
|
||||
},
|
||||
child: Widget.Box({
|
||||
class_name: 'notification-card',
|
||||
vpack: 'start',
|
||||
@@ -70,7 +88,9 @@ export default (): Window<Box<Child, Attribute>, unknown> => {
|
||||
vertical: true,
|
||||
hexpand: true,
|
||||
class_name: `notification-card-content ${!notifHasImg(notif) ? 'noimg' : ''}`,
|
||||
children: [Header(notif), Body(notif), Action(notif, notifs)],
|
||||
children: actionsbox
|
||||
? [Header(notif), Body(notif), actionsbox]
|
||||
: [Header(notif), Body(notif)],
|
||||
}),
|
||||
CloseButton(notif, notifs),
|
||||
],
|
||||
|
||||
Reference in New Issue
Block a user