quickshell: notification daemon
This commit is contained in:
@@ -11,255 +11,241 @@ import qs.Modules.Bar.Misc
|
||||
import qs.Modules.Misc
|
||||
import qs.Services
|
||||
|
||||
Scope {
|
||||
id: rootScope
|
||||
|
||||
property var shell
|
||||
Variants {
|
||||
model: Quickshell.screens
|
||||
|
||||
Item {
|
||||
id: barRootItem
|
||||
property var modelData
|
||||
|
||||
anchors.fill: parent
|
||||
PanelWindow {
|
||||
id: panel
|
||||
|
||||
Variants {
|
||||
model: Quickshell.screens
|
||||
screen: modelData
|
||||
WlrLayershell.namespace: "quickshell-bar"
|
||||
color: Colors.transparent
|
||||
implicitHeight: Style.barHeight
|
||||
|
||||
Item {
|
||||
property var modelData
|
||||
anchors {
|
||||
left: true
|
||||
right: true
|
||||
top: true
|
||||
}
|
||||
|
||||
PanelWindow {
|
||||
id: panel
|
||||
Rectangle {
|
||||
id: barBackground
|
||||
|
||||
screen: modelData
|
||||
WlrLayershell.namespace: "quickshell-bar"
|
||||
color: Colors.transparent
|
||||
implicitHeight: Style.barHeight
|
||||
anchors.fill: parent
|
||||
color: Niri.noFocus ? null : Colors.base
|
||||
|
||||
anchors {
|
||||
left: true
|
||||
right: true
|
||||
top: true
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: barBackground
|
||||
|
||||
anchors.fill: parent
|
||||
color: Niri.noFocus ? null : Colors.base
|
||||
|
||||
gradient: Gradient {
|
||||
GradientStop {
|
||||
position: 0
|
||||
color: Qt.rgba(Colors.base.r, Colors.base.g, Colors.base.b, Niri.noFocus ? 0.8 : 1)
|
||||
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Style.animationSlowest
|
||||
easing.type: Easing.InOutCubic
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
GradientStop {
|
||||
position: 1
|
||||
color: Qt.rgba(Colors.base.r, Colors.base.g, Colors.base.b, Niri.noFocus ? 0 : 1)
|
||||
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Style.animationSlowest
|
||||
easing.type: Easing.InOutCubic
|
||||
}
|
||||
|
||||
}
|
||||
gradient: Gradient {
|
||||
GradientStop {
|
||||
position: 0
|
||||
color: Qt.rgba(Colors.base.r, Colors.base.g, Colors.base.b, Niri.noFocus ? 0.8 : 1)
|
||||
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Style.animationSlowest
|
||||
easing.type: Easing.InOutCubic
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: leftLayout
|
||||
GradientStop {
|
||||
position: 1
|
||||
color: Qt.rgba(Colors.base.r, Colors.base.g, Colors.base.b, Niri.noFocus ? 0 : 1)
|
||||
|
||||
height: parent.height - 10
|
||||
|
||||
anchors {
|
||||
left: parent.left
|
||||
verticalCenter: parent.verticalCenter
|
||||
leftMargin: 5
|
||||
}
|
||||
|
||||
SymbolButton {
|
||||
symbol: Icons.distro
|
||||
buttonColor: Colors.distroColor
|
||||
onClicked: {
|
||||
PanelService.getPanel("controlCenterPanel")?.toggle(this)
|
||||
}
|
||||
onRightClicked: {
|
||||
if (action.running) {
|
||||
action.signal(15);
|
||||
return ;
|
||||
}
|
||||
action.exec(["rofi", "-show", "drun"]);
|
||||
}
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Workspace {
|
||||
screen: modelData
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
CavaBar {
|
||||
count: 6
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
FocusedWindow {
|
||||
maxWidth: 400
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: middleLayout
|
||||
|
||||
height: parent.height - 10
|
||||
|
||||
anchors {
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
Time {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: rightLayout
|
||||
|
||||
height: parent.height - 10
|
||||
|
||||
anchors {
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
rightMargin: 5
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: monitorsLayout
|
||||
visible: !SettingsService.showLyricsBar
|
||||
|
||||
height: parent.height
|
||||
NetworkSpeed {
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
Ip {
|
||||
showCountryCode: true
|
||||
}
|
||||
|
||||
CpuTemp {
|
||||
}
|
||||
|
||||
MemUsage {
|
||||
}
|
||||
|
||||
CpuUsage {
|
||||
}
|
||||
|
||||
Battery {
|
||||
}
|
||||
|
||||
Brightness {
|
||||
screen: modelData
|
||||
}
|
||||
|
||||
Volume {
|
||||
}
|
||||
}
|
||||
|
||||
LyricsBar {
|
||||
id: lyricsBar
|
||||
visible: SettingsService.showLyricsBar
|
||||
width: 600
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 5
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 5
|
||||
}
|
||||
|
||||
TrayExpander {
|
||||
screen: modelData
|
||||
}
|
||||
|
||||
SymbolButton {
|
||||
symbol: Caffeine.isInhibited ? Icons.idleInhibitorActivated : Icons.idleInhibitorDeactivated
|
||||
buttonColor: Caffeine.isInhibited ? Colors.peach : Colors.yellow
|
||||
onClicked: {
|
||||
Caffeine.manualToggle();
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Style.animationSlowest
|
||||
easing.type: Easing.InOutCubic
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
SymbolButton {
|
||||
symbol: Icons.powerMenu
|
||||
buttonColor: Colors.red
|
||||
onClicked: {
|
||||
if (action.running) {
|
||||
action.signal(15);
|
||||
return ;
|
||||
}
|
||||
action.exec(["wlogout"]);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Process {
|
||||
id: action
|
||||
|
||||
running: false
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: leftLayout
|
||||
|
||||
height: parent.height - 10
|
||||
|
||||
anchors {
|
||||
left: parent.left
|
||||
verticalCenter: parent.verticalCenter
|
||||
leftMargin: 5
|
||||
}
|
||||
|
||||
SymbolButton {
|
||||
symbol: Icons.distro
|
||||
buttonColor: Colors.distroColor
|
||||
onClicked: {
|
||||
PanelService.getPanel("controlCenterPanel")?.toggle(this)
|
||||
}
|
||||
onRightClicked: {
|
||||
if (action.running) {
|
||||
action.signal(15);
|
||||
return ;
|
||||
}
|
||||
action.exec(["rofi", "-show", "drun"]);
|
||||
}
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Workspace {
|
||||
screen: modelData
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
CavaBar {
|
||||
count: 6
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
FocusedWindow {
|
||||
maxWidth: 400
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: middleLayout
|
||||
|
||||
height: parent.height - 10
|
||||
|
||||
anchors {
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
|
||||
Time {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: rightLayout
|
||||
|
||||
height: parent.height - 10
|
||||
|
||||
anchors {
|
||||
right: parent.right
|
||||
verticalCenter: parent.verticalCenter
|
||||
rightMargin: 5
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: monitorsLayout
|
||||
visible: !SettingsService.showLyricsBar
|
||||
|
||||
height: parent.height
|
||||
NetworkSpeed {
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 10
|
||||
}
|
||||
|
||||
Ip {
|
||||
showCountryCode: true
|
||||
}
|
||||
|
||||
CpuTemp {
|
||||
}
|
||||
|
||||
MemUsage {
|
||||
}
|
||||
|
||||
CpuUsage {
|
||||
}
|
||||
|
||||
Battery {
|
||||
}
|
||||
|
||||
Brightness {
|
||||
screen: modelData
|
||||
}
|
||||
|
||||
Volume {
|
||||
}
|
||||
}
|
||||
|
||||
LyricsBar {
|
||||
id: lyricsBar
|
||||
visible: SettingsService.showLyricsBar
|
||||
width: 600
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 5
|
||||
}
|
||||
|
||||
Separator {
|
||||
}
|
||||
|
||||
Item {
|
||||
width: 5
|
||||
}
|
||||
|
||||
TrayExpander {
|
||||
screen: modelData
|
||||
}
|
||||
|
||||
SymbolButton {
|
||||
symbol: Caffeine.isInhibited ? Icons.idleInhibitorActivated : Icons.idleInhibitorDeactivated
|
||||
buttonColor: Caffeine.isInhibited ? Colors.peach : Colors.yellow
|
||||
onClicked: {
|
||||
Caffeine.manualToggle();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
SymbolButton {
|
||||
symbol: Icons.powerMenu
|
||||
buttonColor: Colors.red
|
||||
onClicked: {
|
||||
if (action.running) {
|
||||
action.signal(15);
|
||||
return ;
|
||||
}
|
||||
Quickshell.execDetached(["wlogout"]);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Process {
|
||||
id: action
|
||||
|
||||
running: false
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import Quickshell.Io
|
||||
import Quickshell
|
||||
import Quickshell.Widgets
|
||||
import qs.Constants
|
||||
import qs.Services
|
||||
@@ -80,12 +80,6 @@ Item {
|
||||
font.family: Fonts.primary
|
||||
color: Colors.primary
|
||||
|
||||
Process {
|
||||
id: action
|
||||
|
||||
running: false
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: mouseArea
|
||||
|
||||
@@ -102,28 +96,20 @@ Item {
|
||||
windowTitle.x = 0;
|
||||
}
|
||||
onClicked: function(mouse) {
|
||||
if (mouse.button === Qt.MiddleButton) {
|
||||
action.command = ["niri", "msg", "action", "close-window"];
|
||||
action.startDetached();
|
||||
} else if (mouse.button === Qt.LeftButton) {
|
||||
action.command = ["niri", "msg", "action", "center-window"];
|
||||
action.startDetached();
|
||||
}
|
||||
if (mouse.button === Qt.MiddleButton)
|
||||
Quickshell.execDetached(["niri", "msg", "action", "close-window"]);
|
||||
else if (mouse.button === Qt.LeftButton)
|
||||
Quickshell.execDetached(["niri", "msg", "action", "center-window"]);
|
||||
}
|
||||
onWheel: function(wheel) {
|
||||
if (wheel.angleDelta.y > 0) {
|
||||
action.command = ["niri", "msg", "action", "set-column-width", "+10%"];
|
||||
action.startDetached();
|
||||
} else if (wheel.angleDelta.y < 0) {
|
||||
action.command = ["niri", "msg", "action", "set-column-width", "-10%"];
|
||||
action.startDetached();
|
||||
} else if (wheel.angleDelta.x > 0) {
|
||||
action.command = ["niri", "msg", "action", "focus-column-left"];
|
||||
action.startDetached();
|
||||
} else if (wheel.angleDelta.x < 0) {
|
||||
action.command = ["niri", "msg", "action", "focus-column-right"];
|
||||
action.startDetached();
|
||||
}
|
||||
if (wheel.angleDelta.y > 0)
|
||||
Quickshell.execDetached(["niri", "msg", "action", "set-column-width", "+10%"]);
|
||||
else if (wheel.angleDelta.y < 0)
|
||||
Quickshell.execDetached(["niri", "msg", "action", "set-column-width", "-10%"]);
|
||||
else if (wheel.angleDelta.x > 0)
|
||||
Quickshell.execDetached(["niri", "msg", "action", "focus-column-left"]);
|
||||
else if (wheel.angleDelta.x < 0)
|
||||
Quickshell.execDetached(["niri", "msg", "action", "focus-column-right"]);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -11,8 +11,12 @@ Text {
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: {
|
||||
PanelService.getPanel("calendarPanel")?.toggle(this)
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
onClicked: (mouse) => {
|
||||
if (mouse.button === Qt.LeftButton)
|
||||
PanelService.getPanel("calendarPanel")?.toggle(this)
|
||||
else if (mouse.button === Qt.RightButton)
|
||||
PanelService.getPanel("notificationHistoryPanel")?.toggle(this)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
439
quickshell/Modules/Misc/Notification.qml
Normal file
439
quickshell/Modules/Misc/Notification.qml
Normal file
@@ -0,0 +1,439 @@
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import Quickshell
|
||||
import Quickshell.Services.Notifications
|
||||
import Quickshell.Wayland
|
||||
import Quickshell.Widgets
|
||||
import qs.Constants
|
||||
import qs.Noctalia
|
||||
import qs.Services
|
||||
import qs.Utils
|
||||
|
||||
// Simple notification popup - displays multiple notifications
|
||||
Variants {
|
||||
// Force removal without animation as fallback
|
||||
|
||||
// If no notification display activated in settings, then show them all
|
||||
model: Quickshell.screens
|
||||
|
||||
delegate: Loader {
|
||||
id: root
|
||||
|
||||
required property ShellScreen modelData
|
||||
property real scaling: 1
|
||||
// Access the notification model from the service
|
||||
property ListModel notificationModel: NotificationService.activeList
|
||||
|
||||
// Loader is active when there are notifications
|
||||
active: notificationModel.count > 0 || delayTimer.running
|
||||
|
||||
// Keep loader active briefly after last notification to allow animations to complete
|
||||
Timer {
|
||||
id: delayTimer
|
||||
|
||||
interval: Style.animationSlow + 200 // Animation duration + buffer
|
||||
repeat: false
|
||||
}
|
||||
|
||||
// Start delay timer when last notification is removed
|
||||
Connections {
|
||||
function onCountChanged() {
|
||||
if (notificationModel.count === 0 && root.active)
|
||||
delayTimer.restart();
|
||||
|
||||
}
|
||||
|
||||
target: notificationModel
|
||||
}
|
||||
|
||||
sourceComponent: PanelWindow {
|
||||
readonly property string location: "top_right"
|
||||
readonly property bool isTop: (location === "top") || (location.length >= 3 && location.substring(0, 3) === "top")
|
||||
readonly property bool isBottom: (location === "bottom") || (location.length >= 6 && location.substring(0, 6) === "bottom")
|
||||
readonly property bool isLeft: location.indexOf("_left") >= 0
|
||||
readonly property bool isRight: location.indexOf("_right") >= 0
|
||||
readonly property bool isCentered: (location === "top" || location === "bottom")
|
||||
// Store connection for cleanup
|
||||
property var animateConnection: null
|
||||
|
||||
screen: modelData
|
||||
WlrLayershell.namespace: "noctalia-notifications"
|
||||
WlrLayershell.layer: WlrLayer.Overlay
|
||||
color: Color.transparent
|
||||
// Anchor selection based on location (window edges)
|
||||
anchors.top: isTop
|
||||
anchors.bottom: isBottom
|
||||
anchors.left: isLeft
|
||||
anchors.right: isRight
|
||||
// Margins depending on bar position and chosen location
|
||||
margins.top: Style.barHeight + Style.marginM
|
||||
margins.bottom: 0
|
||||
margins.left: 0
|
||||
margins.right: Style.marginM
|
||||
implicitWidth: 360
|
||||
implicitHeight: notificationStack.implicitHeight
|
||||
WlrLayershell.exclusionMode: ExclusionMode.Ignore
|
||||
// Connect to animation signal from service
|
||||
Component.onCompleted: {
|
||||
animateConnection = NotificationService.animateAndRemove.connect(function(notificationId) {
|
||||
// Find the delegate by notification ID
|
||||
var delegate = null;
|
||||
if (notificationStack && notificationStack.children && notificationStack.children.length > 0) {
|
||||
for (var i = 0; i < notificationStack.children.length; i++) {
|
||||
var child = notificationStack.children[i];
|
||||
if (child && child.notificationId === notificationId) {
|
||||
delegate = child;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (delegate && delegate.animateOut)
|
||||
delegate.animateOut();
|
||||
else
|
||||
NotificationService.dismissActiveNotification(notificationId);
|
||||
});
|
||||
}
|
||||
// Disconnect when destroyed to prevent memory leaks
|
||||
Component.onDestruction: {
|
||||
if (animateConnection) {
|
||||
NotificationService.animateAndRemove.disconnect(animateConnection);
|
||||
animateConnection = null;
|
||||
}
|
||||
}
|
||||
|
||||
// Main notification container
|
||||
ColumnLayout {
|
||||
id: notificationStack
|
||||
|
||||
// Anchor the stack inside the window based on chosen location
|
||||
anchors.top: parent.isTop ? parent.top : undefined
|
||||
anchors.bottom: parent.isBottom ? parent.bottom : undefined
|
||||
anchors.left: parent.isLeft ? parent.left : undefined
|
||||
anchors.right: parent.isRight ? parent.right : undefined
|
||||
anchors.horizontalCenter: parent.isCentered ? parent.horizontalCenter : undefined
|
||||
spacing: Style.marginS
|
||||
width: 360
|
||||
visible: true
|
||||
|
||||
// Multiple notifications display
|
||||
Repeater {
|
||||
model: notificationModel
|
||||
|
||||
delegate: Rectangle {
|
||||
id: card
|
||||
|
||||
// Store the notification ID and data for reference
|
||||
property string notificationId: model.id
|
||||
property var notificationData: model
|
||||
// Animation properties
|
||||
property real scaleValue: 0.8
|
||||
property real opacityValue: 0
|
||||
property bool isRemoving: false
|
||||
|
||||
// Animate out when being removed
|
||||
function animateOut() {
|
||||
if (isRemoving)
|
||||
return ;
|
||||
|
||||
// Prevent multiple animations
|
||||
isRemoving = true;
|
||||
scaleValue = 0.8;
|
||||
opacityValue = 0;
|
||||
}
|
||||
|
||||
Layout.preferredWidth: 360
|
||||
Layout.preferredHeight: notificationLayout.implicitHeight + (Style.marginL * 2)
|
||||
Layout.maximumHeight: Layout.preferredHeight
|
||||
radius: Style.radiusL
|
||||
border.color: Colors.overlay0
|
||||
border.width: Math.max(1, Style.borderS)
|
||||
color: Color.mSurface
|
||||
// Scale and fade-in animation
|
||||
scale: scaleValue
|
||||
opacity: opacityValue
|
||||
// Animate in when the item is created
|
||||
Component.onCompleted: {
|
||||
scaleValue = 1;
|
||||
opacityValue = 1;
|
||||
}
|
||||
// Check if this notification is being removed
|
||||
onIsRemovingChanged: {
|
||||
if (isRemoving)
|
||||
removalTimer.start();
|
||||
|
||||
}
|
||||
|
||||
// Optimized progress bar container
|
||||
Rectangle {
|
||||
id: progressBarContainer
|
||||
|
||||
// Pre-calculate available width for the progress bar
|
||||
readonly property real availableWidth: parent.width - (2 * parent.radius)
|
||||
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: 2
|
||||
color: Color.transparent
|
||||
|
||||
// Actual progress bar - centered and symmetric
|
||||
Rectangle {
|
||||
id: progressBar
|
||||
|
||||
height: parent.height
|
||||
// Center the bar and make it shrink symmetrically
|
||||
x: parent.parent.radius + (parent.availableWidth * (1 - model.progress)) / 2
|
||||
width: parent.availableWidth * model.progress
|
||||
color: {
|
||||
if (model.urgency === NotificationUrgency.Critical || model.urgency === 2)
|
||||
return Colors.red;
|
||||
else if (model.urgency === NotificationUrgency.Low || model.urgency === 0)
|
||||
return Colors.green;
|
||||
else
|
||||
return Colors.primary;
|
||||
}
|
||||
antialiasing: true
|
||||
|
||||
// Smooth progress animation
|
||||
Behavior on width {
|
||||
enabled: !card.isRemoving // Disable during removal animation
|
||||
|
||||
NumberAnimation {
|
||||
duration: 100 // Quick but smooth
|
||||
easing.type: Easing.Linear
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Behavior on x {
|
||||
enabled: !card.isRemoving
|
||||
|
||||
NumberAnimation {
|
||||
duration: 100
|
||||
easing.type: Easing.Linear
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Right-click to dismiss
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.RightButton
|
||||
onClicked: (mouse) => {
|
||||
if (mouse.button === Qt.RightButton)
|
||||
animateOut();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// Timer for delayed removal after animation
|
||||
Timer {
|
||||
id: removalTimer
|
||||
|
||||
interval: Style.animationSlow
|
||||
repeat: false
|
||||
onTriggered: {
|
||||
NotificationService.dismissActiveNotification(notificationId);
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
id: notificationLayout
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
anchors.rightMargin: (Style.marginM + 32) // Leave space for close button
|
||||
spacing: Style.marginM
|
||||
|
||||
// Main content section
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginM
|
||||
|
||||
ColumnLayout {
|
||||
// For real-time notification always show the original image
|
||||
// as the cached version is most likely still processing.
|
||||
NImageCircled {
|
||||
Layout.preferredWidth: 40
|
||||
Layout.preferredHeight: 40
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.topMargin: 30
|
||||
imagePath: model.originalImage || ""
|
||||
borderColor: Color.transparent
|
||||
borderWidth: 0
|
||||
fallbackIcon: "bell"
|
||||
fallbackIconSize: 24
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Text content
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginS
|
||||
|
||||
// Header section with app name and timestamp
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginS
|
||||
|
||||
Rectangle {
|
||||
Layout.preferredWidth: 6
|
||||
Layout.preferredHeight: 6
|
||||
radius: Style.radiusXS
|
||||
color: {
|
||||
if (model.urgency === NotificationUrgency.Critical || model.urgency === 2)
|
||||
return Color.mError;
|
||||
else if (model.urgency === NotificationUrgency.Low || model.urgency === 0)
|
||||
return Color.mOnSurface;
|
||||
else
|
||||
return Color.mPrimary;
|
||||
}
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: `${model.appName || I18n.tr("system.unknown-app")} · ${Time.formatRelativeTime(model.timestamp)}`
|
||||
color: Color.mSecondary
|
||||
pointSize: Style.fontSizeXS
|
||||
family: Fonts.sans
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
NText {
|
||||
text: model.summary || I18n.tr("general.no-summary")
|
||||
pointSize: Style.fontSizeL
|
||||
font.weight: Style.fontWeightMedium
|
||||
color: Color.mOnSurface
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
Layout.fillWidth: true
|
||||
maximumLineCount: 3
|
||||
elide: Text.ElideRight
|
||||
family: Fonts.sans
|
||||
visible: text.length > 0
|
||||
}
|
||||
|
||||
NText {
|
||||
text: model.body || ""
|
||||
pointSize: Style.fontSizeM
|
||||
color: Color.mOnSurface
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
Layout.fillWidth: true
|
||||
maximumLineCount: 5
|
||||
elide: Text.ElideRight
|
||||
family: Fonts.sans
|
||||
visible: text.length > 0
|
||||
}
|
||||
|
||||
// Notification actions
|
||||
Flow {
|
||||
// Store the notification ID for access in button delegates
|
||||
property string parentNotificationId: notificationId
|
||||
// Parse actions from JSON string
|
||||
property var parsedActions: {
|
||||
try {
|
||||
return model.actionsJson ? JSON.parse(model.actionsJson) : [];
|
||||
} catch (e) {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginS
|
||||
Layout.topMargin: Style.marginM
|
||||
flow: Flow.LeftToRight
|
||||
layoutDirection: Qt.LeftToRight
|
||||
visible: parsedActions.length > 0
|
||||
|
||||
Repeater {
|
||||
model: parent.parsedActions
|
||||
|
||||
delegate: NButton {
|
||||
property var actionData: modelData
|
||||
|
||||
text: {
|
||||
var actionText = actionData.text || "Open";
|
||||
// If text contains comma, take the part after the comma (the display text)
|
||||
if (actionText.includes(","))
|
||||
return actionText.split(",")[1] || actionText;
|
||||
|
||||
return actionText;
|
||||
}
|
||||
fontFamily: Fonts.sans
|
||||
fontSize: Style.fontSizeS
|
||||
backgroundColor: Color.mPrimary
|
||||
textColor: hovered ? Color.mOnTertiary : Color.mOnPrimary
|
||||
hoverColor: Color.mTertiary
|
||||
outlined: false
|
||||
implicitHeight: 24
|
||||
onClicked: {
|
||||
NotificationService.invokeAction(parent.parentNotificationId, actionData.identifier);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Close button positioned absolutely
|
||||
NIconButton {
|
||||
icon: "close"
|
||||
baseSize: Style.baseWidgetSize * 0.6
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: Style.marginM
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: Style.marginM
|
||||
onClicked: {
|
||||
animateOut();
|
||||
}
|
||||
}
|
||||
|
||||
// Animation behaviors
|
||||
Behavior on scale {
|
||||
NumberAnimation {
|
||||
duration: Style.animationNormal
|
||||
easing.type: Easing.OutExpo
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Behavior on opacity {
|
||||
NumberAnimation {
|
||||
duration: Style.animationNormal
|
||||
easing.type: Easing.OutQuad
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@@ -75,7 +75,7 @@ NPanel {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
icon: weatherReady ? LocationService.weatherSymbolFromCode(LocationService.data.weather.current_weather.weathercode) : "cloud"
|
||||
pointSize: Style.fontSizeXXL
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
}
|
||||
|
||||
NText {
|
||||
@@ -91,7 +91,7 @@ NPanel {
|
||||
}
|
||||
pointSize: Style.fontSizeM
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
}
|
||||
|
||||
}
|
||||
@@ -103,7 +103,7 @@ NPanel {
|
||||
text: Time.date.getDate()
|
||||
pointSize: Style.fontSizeXXXL * 1.5
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
}
|
||||
|
||||
Item {
|
||||
@@ -123,7 +123,7 @@ NPanel {
|
||||
text: Qt.locale().monthName(grid.month, Locale.LongFormat).toUpperCase()
|
||||
pointSize: Style.fontSizeXL * 1.2
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
Layout.alignment: Qt.AlignBaseline
|
||||
Layout.maximumWidth: 150
|
||||
elide: Text.ElideRight
|
||||
@@ -133,7 +133,7 @@ NPanel {
|
||||
text: ` ${grid.year}`
|
||||
pointSize: Style.fontSizeL
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Qt.alpha(Color.mOnSurfaceVariant, 0.7)
|
||||
color: Qt.alpha(Colors.text, 0.7)
|
||||
Layout.alignment: Qt.AlignBaseline
|
||||
}
|
||||
|
||||
@@ -152,7 +152,7 @@ NPanel {
|
||||
}
|
||||
pointSize: Style.fontSizeM
|
||||
font.weight: Style.fontWeightMedium
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
Layout.maximumWidth: 150
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
@@ -161,7 +161,7 @@ NPanel {
|
||||
text: weatherReady ? ` (${LocationService.data.weather.timezone_abbreviation})` : ""
|
||||
pointSize: Style.fontSizeXS
|
||||
font.weight: Style.fontWeightMedium
|
||||
color: Qt.alpha(Color.mOnSurfaceVariant, 0.7)
|
||||
color: Qt.alpha(Colors.text, 0.7)
|
||||
}
|
||||
|
||||
}
|
||||
@@ -197,13 +197,13 @@ NPanel {
|
||||
ctx.beginPath();
|
||||
ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI);
|
||||
ctx.lineWidth = 2.5;
|
||||
ctx.strokeStyle = Qt.alpha(Color.mOnSurfaceVariant, 0.15);
|
||||
ctx.strokeStyle = Qt.alpha(Colors.text, 0.15);
|
||||
ctx.stroke();
|
||||
// Progress arc
|
||||
ctx.beginPath();
|
||||
ctx.arc(centerX, centerY, radius, -Math.PI / 2, -Math.PI / 2 + progress * 2 * Math.PI);
|
||||
ctx.lineWidth = 2.5;
|
||||
ctx.strokeStyle = Color.mOnSurfaceVariant;
|
||||
ctx.strokeStyle = Colors.text;
|
||||
ctx.lineCap = "round";
|
||||
ctx.stroke();
|
||||
}
|
||||
@@ -230,7 +230,7 @@ NPanel {
|
||||
}
|
||||
pointSize: Style.fontSizeXS
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
family: Fonts.sans
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
@@ -239,7 +239,7 @@ NPanel {
|
||||
text: Qt.formatTime(Time.date, "mm")
|
||||
pointSize: Style.fontSizeXXS
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
family: Fonts.sans
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
@@ -298,7 +298,7 @@ NPanel {
|
||||
return `${max}°/${min}°`;
|
||||
}
|
||||
pointSize: Style.fontSizeXS
|
||||
color: Color.mOnSurfaceVariant
|
||||
color: Colors.text
|
||||
font.weight: Style.fontWeightMedium
|
||||
}
|
||||
|
||||
|
||||
344
quickshell/Modules/Panel/NotificationHistoryPanel.qml
Normal file
344
quickshell/Modules/Panel/NotificationHistoryPanel.qml
Normal file
@@ -0,0 +1,344 @@
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
import Quickshell
|
||||
import Quickshell.Services.Notifications
|
||||
import Quickshell.Wayland
|
||||
import qs.Constants
|
||||
import qs.Noctalia
|
||||
import qs.Services
|
||||
import qs.Utils
|
||||
|
||||
// Notification History panel
|
||||
NPanel {
|
||||
id: root
|
||||
|
||||
preferredWidth: 380
|
||||
preferredHeight: 480
|
||||
onOpened: function() {
|
||||
SettingsService.notifications.lastSeenTs = Time.timestamp * 1000;
|
||||
}
|
||||
|
||||
panelContent: Rectangle {
|
||||
id: notificationRect
|
||||
|
||||
color: Color.transparent
|
||||
|
||||
ColumnLayout {
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginL
|
||||
spacing: Style.marginM
|
||||
|
||||
// Header section
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginM
|
||||
|
||||
NIcon {
|
||||
icon: "bell"
|
||||
pointSize: Style.fontSizeXXL
|
||||
color: Color.mPrimary
|
||||
}
|
||||
|
||||
NText {
|
||||
text: "Notifications"
|
||||
pointSize: Style.fontSizeL
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurface
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
NIconButton {
|
||||
icon: SettingsService.notifications.doNotDisturb ? "bell-off" : "bell"
|
||||
baseSize: Style.baseWidgetSize * 0.8
|
||||
onClicked: SettingsService.notifications.doNotDisturb = !SettingsService.notifications.doNotDisturb
|
||||
colorFg: SettingsService.notifications.doNotDisturb ? Colors.base : Colors.green
|
||||
colorBg: SettingsService.notifications.doNotDisturb ? Colors.green : Color.transparent
|
||||
colorFgHover: Colors.base
|
||||
colorBgHover: Colors.green
|
||||
}
|
||||
|
||||
NIconButton {
|
||||
icon: "trash"
|
||||
baseSize: Style.baseWidgetSize * 0.8
|
||||
onClicked: {
|
||||
NotificationService.clearHistory();
|
||||
// Close panel as there is nothing more to see.
|
||||
root.close();
|
||||
}
|
||||
colorFg: Colors.red
|
||||
colorBg: Color.transparent
|
||||
colorFgHover: Colors.base
|
||||
colorBgHover: Colors.red
|
||||
}
|
||||
|
||||
NIconButton {
|
||||
icon: "close"
|
||||
baseSize: Style.baseWidgetSize * 0.8
|
||||
onClicked: root.close()
|
||||
colorFg: Colors.blue
|
||||
colorBg: Color.transparent
|
||||
colorFgHover: Colors.base
|
||||
colorBgHover: Colors.blue
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
NDivider {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
// Empty state when no notifications
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
visible: NotificationService.historyList.count === 0
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "bell-off"
|
||||
pointSize: 64
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: "No Notifications"
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Notification list
|
||||
NListView {
|
||||
id: notificationList
|
||||
|
||||
// Track which notification is expanded
|
||||
property string expandedId: ""
|
||||
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
horizontalPolicy: ScrollBar.AlwaysOff
|
||||
verticalPolicy: ScrollBar.AsNeeded
|
||||
model: NotificationService.historyList
|
||||
spacing: Style.marginM
|
||||
clip: true
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
visible: NotificationService.historyList.count > 0
|
||||
|
||||
delegate: NBox {
|
||||
property string notificationId: model.id
|
||||
property bool isExpanded: notificationList.expandedId === notificationId
|
||||
|
||||
width: notificationList.width
|
||||
height: notificationLayout.implicitHeight + (Style.marginM * 2)
|
||||
|
||||
// Click to expand/collapse
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
// Don't capture clicks on the delete button
|
||||
anchors.rightMargin: 48
|
||||
enabled: (summaryText.truncated || bodyText.truncated)
|
||||
onClicked: {
|
||||
if (notificationList.expandedId === notificationId)
|
||||
notificationList.expandedId = "";
|
||||
else
|
||||
notificationList.expandedId = notificationId;
|
||||
}
|
||||
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: notificationLayout
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginM
|
||||
|
||||
ColumnLayout {
|
||||
NImageCircled {
|
||||
Layout.preferredWidth: 40
|
||||
Layout.preferredHeight: 40
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.topMargin: 20
|
||||
imagePath: model.cachedImage || model.originalImage || ""
|
||||
borderColor: Color.transparent
|
||||
borderWidth: 0
|
||||
fallbackIcon: "bell"
|
||||
fallbackIconSize: 24
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Notification content column
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignTop
|
||||
spacing: Style.marginXS
|
||||
Layout.rightMargin: -(Style.marginM + Style.baseWidgetSize * 0.6)
|
||||
|
||||
// Header row with app name and timestamp
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginS
|
||||
|
||||
// Urgency indicator
|
||||
Rectangle {
|
||||
Layout.preferredWidth: 6
|
||||
Layout.preferredHeight: 6
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
radius: 3
|
||||
visible: model.urgency !== 1
|
||||
color: {
|
||||
if (model.urgency === 2)
|
||||
return Color.mError;
|
||||
else if (model.urgency === 0)
|
||||
return Color.mOnSurfaceVariant;
|
||||
else
|
||||
return Color.transparent;
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: model.appName || "Unknown App"
|
||||
pointSize: Style.fontSizeXS
|
||||
color: Color.mSecondary
|
||||
family: Fonts.sans
|
||||
}
|
||||
|
||||
NText {
|
||||
text: Time.formatRelativeTime(model.timestamp)
|
||||
pointSize: Style.fontSizeXS
|
||||
color: Color.mSecondary
|
||||
family: Fonts.sans
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Summary
|
||||
NText {
|
||||
id: summaryText
|
||||
|
||||
text: model.summary || "No Summary"
|
||||
pointSize: Style.fontSizeM
|
||||
font.weight: Font.Medium
|
||||
color: Color.mOnSurface
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.Wrap
|
||||
Layout.fillWidth: true
|
||||
maximumLineCount: isExpanded ? 999 : 2
|
||||
family: Fonts.sans
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
// Body
|
||||
NText {
|
||||
id: bodyText
|
||||
|
||||
text: model.body || ""
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.Wrap
|
||||
Layout.fillWidth: true
|
||||
maximumLineCount: isExpanded ? 999 : 3
|
||||
elide: Text.ElideRight
|
||||
family: Fonts.sans
|
||||
visible: text.length > 0
|
||||
}
|
||||
|
||||
// Spacer for expand indicator
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: (!isExpanded && (summaryText.truncated || bodyText.truncated)) ? (Style.marginS) : 0
|
||||
}
|
||||
|
||||
// Expand indicator
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
visible: !isExpanded && (summaryText.truncated || bodyText.truncated)
|
||||
spacing: Style.marginXS
|
||||
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
NText {
|
||||
text: "Click to expand"
|
||||
pointSize: Style.fontSizeXS
|
||||
color: Color.mPrimary
|
||||
family: Fonts.sans
|
||||
font.weight: Font.Medium
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "chevron-down"
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mPrimary
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Delete button
|
||||
NIconButton {
|
||||
icon: "trash"
|
||||
baseSize: Style.baseWidgetSize * 0.7
|
||||
Layout.alignment: Qt.AlignTop
|
||||
onClicked: {
|
||||
// Remove from history using the service API
|
||||
NotificationService.removeFromHistory(notificationId);
|
||||
}
|
||||
colorFg: Colors.red
|
||||
colorBg: Color.transparent
|
||||
colorFgHover: Colors.base
|
||||
colorBgHover: Colors.red
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Behavior on height {
|
||||
NumberAnimation {
|
||||
duration: Style.animationNormal
|
||||
easing.type: Easing.InOutQuad
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Smooth color transition on hover
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
duration: Style.animationFast
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user