Notifications: proper display on selected screen

This commit is contained in:
quadbyte 2025-08-15 10:49:09 -04:00
parent 8afb71b114
commit 2abe7c9bd1
6 changed files with 260 additions and 255 deletions

View file

@ -19,6 +19,7 @@ Variants {
implicitHeight: Style.barHeight * scaling
color: "transparent"
// If no bar display activated in settings, then show them all
visible: modelData ? (Settings.data.bar.monitors.includes(modelData.name)
|| (Settings.data.bar.monitors.length === 0)) : false

View file

@ -40,7 +40,7 @@ NLoader {
PanelWindow {
id: dockWindow
// Dock works differently from bar, it is show only if toggled in Settings/Display
// Dock is only shown if explicitely toggled
visible: modelData ? Settings.data.dock.monitors.includes(modelData.name) : false
screen: modelData

View file

@ -8,34 +8,41 @@ import qs.Services
import qs.Widgets
// Simple notification popup - displays multiple notifications
Variants {
model: Quickshell.screens
PanelWindow {
id: root
required property ShellScreen modelData
readonly property real scaling: Scaling.scale(screen)
// Access the notification model from the service
property ListModel notificationModel: NotificationService.notificationModel
// Track notifications being removed for animation
property var removingNotifications: ({})
screen: modelData
color: "transparent"
visible: notificationService.notificationModel.count > 0
// If no notification display activated in settings, then show them all
visible: modelData ? (Settings.data.notifications.monitors.includes(modelData.name)
|| (Settings.data.notifications.monitors.length === 0))
&& (NotificationService.notificationModel.count > 0) : false
anchors.top: true
anchors.right: true
margins.top: (Style.barHeight + Style.marginMedium) * scaling
margins.right: Style.marginMedium * scaling
implicitWidth: 360 * scaling
implicitHeight: Math.min(notificationStack.implicitHeight, (notificationService.maxVisible * 120) * scaling)
implicitHeight: Math.min(notificationStack.implicitHeight, (NotificationService.maxVisible * 120) * scaling)
WlrLayershell.layer: WlrLayer.Overlay
WlrLayershell.exclusionMode: ExclusionMode.Ignore
// Use the notification service singleton
property var notificationService: NotificationService
// Access the notification model from the service
property ListModel notificationModel: notificationService.notificationModel
// Track notifications being removed for animation
property var removingNotifications: ({})
// Connect to animation signal from service
Component.onCompleted: {
notificationService.animateAndRemove.connect(function (notification, index) {
NotificationService.animateAndRemove.connect(function (notification, index) {
// Find the delegate and trigger its animation
if (notificationStack.children && notificationStack.children[index]) {
let delegate = notificationStack.children[index]
@ -95,7 +102,7 @@ PanelWindow {
interval: Style.animationSlow
repeat: false
onTriggered: {
notificationService.forceRemoveNotification(model.rawNotification)
NotificationService.forceRemoveNotification(model.rawNotification)
}
}
@ -147,7 +154,7 @@ PanelWindow {
Layout.fillWidth: true
}
NText {
text: notificationService.formatTimestamp(model.timestamp)
text: NotificationService.formatTimestamp(model.timestamp)
color: Colors.mOnSurface
font.pointSize: Style.fontSizeSmall * scaling
}
@ -190,3 +197,4 @@ PanelWindow {
}
}
}
}

View file

@ -47,6 +47,95 @@ Item {
color: Colors.mOnSurface
}
NText {
text: "By default, all bars are displayed. Select one or more below to narrow your view."
font.pointSize: Style.fontSize * scaling
color: Colors.mOnSurfaceVariant
}
Repeater {
model: Quickshell.screens || []
delegate: Rectangle {
Layout.fillWidth: true
radius: Style.radiusMedium * scaling
color: Colors.mSurface
border.color: Colors.mOutline
border.width: Math.max(1, Style.borderThin * scaling)
implicitHeight: contentCol.implicitHeight + Style.marginXL * 2 * scaling
ColumnLayout {
id: contentCol
anchors.fill: parent
anchors.margins: Style.marginLarge * scaling
spacing: Style.marginTiniest * scaling
NText {
text: (modelData.name || "Unknown")
font.pointSize: Style.fontSizeLarge * scaling
font.weight: Style.fontWeightBold
color: Colors.mSecondary
}
NText {
text: `Resolution: ${modelData.width}x${modelData.height} - Position: (${modelData.x}, ${modelData.y})`
font.pointSize: Style.fontSizeSmall * scaling
color: Colors.mOnSurface
}
ColumnLayout {
spacing: Style.marginLarge * scaling
NToggle {
label: "Bar"
description: "Enable the top bar on this monitor"
value: (Settings.data.bar.monitors || []).indexOf(modelData.name) !== -1
onToggled: function (newValue) {
if (newValue) {
Settings.data.bar.monitors = addMonitor(Settings.data.bar.monitors, modelData.name)
} else {
Settings.data.bar.monitors = removeMonitor(Settings.data.bar.monitors, modelData.name)
}
}
}
NToggle {
label: "Dock"
description: "Enable the dock on this monitor"
value: (Settings.data.dock.monitors || []).indexOf(modelData.name) !== -1
onToggled: function (newValue) {
if (newValue) {
Settings.data.dock.monitors = addMonitor(Settings.data.dock.monitors, modelData.name)
} else {
Settings.data.dock.monitors = removeMonitor(Settings.data.dock.monitors, modelData.name)
}
}
}
NToggle {
label: "Notifications"
description: "Enable notifications on this monitor"
value: (Settings.data.notifications.monitors || []).indexOf(modelData.name) !== -1
onToggled: function (newValue) {
if (newValue) {
Settings.data.notifications.monitors = addMonitor(Settings.data.notifications.monitors,
modelData.name)
} else {
Settings.data.notifications.monitors = removeMonitor(Settings.data.notifications.monitors,
modelData.name)
}
}
}
}
}
}
}
NDivider {
Layout.fillWidth: true
Layout.topMargin: Style.marginLarge * 2 * scaling
Layout.bottomMargin: Style.marginLarge * scaling
}
// Brightness Section
ColumnLayout {
spacing: Style.marginSmall * scaling
@ -92,89 +181,6 @@ Item {
}
}
NDivider {
Layout.fillWidth: true
Layout.topMargin: Style.marginLarge * 2 * scaling
Layout.bottomMargin: Style.marginLarge * scaling
}
Repeater {
model: Quickshell.screens || []
delegate: Rectangle {
Layout.fillWidth: true
radius: Style.radiusMedium * scaling
color: Colors.mSurface
border.color: Colors.mOutline
border.width: Math.max(1, Style.borderThin * scaling)
implicitHeight: contentCol.implicitHeight + Style.marginXL * 2 * scaling
ColumnLayout {
id: contentCol
anchors.fill: parent
anchors.margins: Style.marginLarge * scaling
spacing: Style.marginTiniest * scaling
NText {
text: (modelData.name || "Unknown")
font.pointSize: Style.fontSizeLarge * scaling
font.weight: Style.fontWeightBold
color: Colors.mSecondary
}
NText {
text: `Resolution: ${modelData.width}x${modelData.height} - Position: (${modelData.x}, ${modelData.y})`
font.pointSize: Style.fontSizeSmall * scaling
color: Colors.mOnSurface
}
ColumnLayout {
spacing: Style.marginLarge * scaling
NToggle {
label: "Bar"
description: "Display the top bar on this monitor"
value: (Settings.data.bar.monitors || []).indexOf(modelData.name) !== -1
onToggled: function (newValue) {
if (newValue) {
Settings.data.bar.monitors = addMonitor(Settings.data.bar.monitors, modelData.name)
} else {
Settings.data.bar.monitors = removeMonitor(Settings.data.bar.monitors, modelData.name)
}
}
}
NToggle {
label: "Dock"
description: "Display the dock on this monitor"
value: (Settings.data.dock.monitors || []).indexOf(modelData.name) !== -1
onToggled: function (newValue) {
if (newValue) {
Settings.data.dock.monitors = addMonitor(Settings.data.dock.monitors, modelData.name)
} else {
Settings.data.dock.monitors = removeMonitor(Settings.data.dock.monitors, modelData.name)
}
}
}
NToggle {
label: "Notifications"
description: "Display notifications on this monitor"
value: (Settings.data.notifications.monitors || []).indexOf(modelData.name) !== -1
onToggled: function (newValue) {
if (newValue) {
Settings.data.notifications.monitors = addMonitor(Settings.data.notifications.monitors,
modelData.name)
} else {
Settings.data.notifications.monitors = removeMonitor(Settings.data.notifications.monitors,
modelData.name)
}
}
}
}
}
}
}
Item {
Layout.fillHeight: true
}

View file

@ -339,15 +339,5 @@ NBox {
Layout.alignment: Qt.AlignHCenter
}
}
// CircularSpectrum {
// visible: Settings.data.audio.visualizerType == "radial"
// values: Cava.values
// innerRadius: 30 * scaling // Position just outside 60x60 album art
// outerRadius: 48 * scaling // Extend bars outward from album art
// fillColor: Colors.mPrimary
// strokeColor: Colors.mPrimary
// strokeWidth: 0 * scaling
// }
}
}