forked from Shinonome/dots-hyprland
end-4
344 lines
13 KiB
QML
344 lines
13 KiB
QML
import "root:/modules/common"
|
|
import "root:/services"
|
|
import Qt5Compat.GraphicalEffects
|
|
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Layouts
|
|
import Quickshell
|
|
import Quickshell.Widgets
|
|
import Quickshell.Services.Notifications
|
|
import "./notification_utils.js" as NotificationUtils
|
|
|
|
Item {
|
|
id: root
|
|
property var notificationObject
|
|
property bool expanded: false
|
|
property bool enableAnimation: true
|
|
property int notificationListSpacing: 5
|
|
property bool ready: false
|
|
|
|
Layout.fillWidth: true
|
|
clip: true
|
|
|
|
implicitHeight: ready ? notificationColumnLayout.implicitHeight + notificationListSpacing : 0
|
|
Behavior on implicitHeight {
|
|
enabled: enableAnimation
|
|
NumberAnimation {
|
|
duration: Appearance.animation.elementDecel.duration
|
|
easing.type: Appearance.animation.elementDecel.type
|
|
}
|
|
}
|
|
|
|
Component.onCompleted: {
|
|
root.ready = true
|
|
}
|
|
|
|
function destroyWithAnimation() {
|
|
notificationRowWrapper.anchors.left = undefined
|
|
notificationRowWrapper.anchors.right = undefined
|
|
notificationRowWrapper.anchors.fill = undefined
|
|
notificationBackground.anchors.left = undefined
|
|
notificationBackground.anchors.right = undefined
|
|
notificationBackground.anchors.fill = undefined
|
|
notificationRowWrapper.x = width
|
|
notificationBackground.x = width
|
|
destroyTimer1.start()
|
|
}
|
|
|
|
Timer {
|
|
id: destroyTimer1
|
|
interval: Appearance.animation.elementDecel.duration / 2
|
|
repeat: false
|
|
onTriggered: {
|
|
notificationRowWrapper.anchors.top = undefined
|
|
notificationRowWrapper.anchors.bottom = root.bottom
|
|
implicitHeight = 0
|
|
destroyTimer2.start()
|
|
}
|
|
}
|
|
|
|
Timer {
|
|
id: destroyTimer2
|
|
interval: Appearance.animation.elementDecel.duration
|
|
repeat: false
|
|
onTriggered: {
|
|
root.destroy()
|
|
}
|
|
}
|
|
|
|
MouseArea { // Middle click to close
|
|
anchors.fill: parent
|
|
acceptedButtons: Qt.MiddleButton | Qt.RightButton
|
|
onClicked: (mouse) => {
|
|
if (mouse.button == Qt.MiddleButton)
|
|
Notifications.discardNotification(notificationObject.id);
|
|
else if (mouse.button == Qt.RightButton)
|
|
root.expanded = !root.expanded;
|
|
}
|
|
}
|
|
|
|
// Background
|
|
Item {
|
|
id: notificationBackgroundWrapper
|
|
|
|
anchors.fill: parent
|
|
implicitHeight: notificationColumnLayout.implicitHeight
|
|
anchors.topMargin: notificationListSpacing
|
|
|
|
Rectangle {
|
|
id: notificationBackground
|
|
anchors.fill: parent
|
|
anchors.bottom: parent.bottom
|
|
|
|
color: (notificationObject.urgency == NotificationUrgency.Critical) ?
|
|
Appearance.mix(Appearance.m3colors.m3secondaryContainer, Appearance.colors.colLayer2, 0.35) : Appearance.colors.colLayer2
|
|
radius: Appearance.rounding.normal
|
|
|
|
Behavior on x {
|
|
enabled: enableAnimation
|
|
NumberAnimation {
|
|
duration: Appearance.animation.elementDecel.duration
|
|
easing.type: Appearance.animation.elementDecel.type
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
Item {
|
|
id: notificationRowWrapper
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
anchors.top: parent.top
|
|
implicitHeight: notificationColumnLayout.implicitHeight + notificationListSpacing
|
|
|
|
Behavior on x {
|
|
enabled: enableAnimation
|
|
NumberAnimation {
|
|
duration: Appearance.animation.elementDecel.duration
|
|
easing.type: Appearance.animation.elementDecel.type
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
id: notificationColumnLayout
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
anchors.bottom: parent.bottom
|
|
RowLayout {
|
|
id: notificationRowLayout
|
|
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle { // App icon
|
|
id: iconRectangle
|
|
implicitWidth: 47
|
|
implicitHeight: 47
|
|
Layout.leftMargin: 10
|
|
Layout.topMargin: 10
|
|
Layout.bottomMargin: 10
|
|
Layout.alignment: Qt.AlignTop
|
|
Layout.fillWidth: false
|
|
radius: Appearance.rounding.full
|
|
color: Appearance.m3colors.m3secondaryContainer
|
|
MaterialSymbol {
|
|
visible: notificationObject.appIcon == ""
|
|
text: (notificationObject.urgency == NotificationUrgency.Critical) ? "release_alert" :
|
|
NotificationUtils.guessMessageType(notificationObject.summary)
|
|
anchors.fill: parent
|
|
color: (notificationObject.urgency == NotificationUrgency.Critical) ?
|
|
Appearance.mix(Appearance.m3colors.m3onSecondary, Appearance.m3colors.m3onSecondaryContainer, 0.1) :
|
|
Appearance.m3colors.m3onSecondaryContainer
|
|
font.pixelSize: 27
|
|
horizontalAlignment: Text.AlignHCenter
|
|
verticalAlignment: Text.AlignVCenter
|
|
}
|
|
IconImage {
|
|
visible: notificationObject.image == "" && notificationObject.appIcon != ""
|
|
anchors.centerIn: parent
|
|
implicitSize: 33
|
|
asynchronous: true
|
|
source: Quickshell.iconPath(notificationObject.appIcon)
|
|
}
|
|
Item {
|
|
anchors.fill: parent
|
|
visible: notificationObject.image != ""
|
|
Image {
|
|
id: notifImage
|
|
|
|
anchors.fill: parent
|
|
readonly property int size: parent.width
|
|
|
|
source: notificationObject?.image
|
|
fillMode: Image.PreserveAspectCrop
|
|
cache: false
|
|
antialiasing: true
|
|
asynchronous: true
|
|
|
|
width: size
|
|
height: size
|
|
sourceSize.width: size
|
|
sourceSize.height: size
|
|
|
|
layer.enabled: true
|
|
layer.effect: OpacityMask {
|
|
maskSource: Rectangle {
|
|
width: notifImage.size
|
|
height: notifImage.size
|
|
radius: Appearance.rounding.full
|
|
}
|
|
}
|
|
}
|
|
IconImage {
|
|
visible: notificationObject.appIcon != ""
|
|
anchors.bottom: parent.bottom
|
|
anchors.right: parent.right
|
|
implicitSize: 23
|
|
asynchronous: true
|
|
source: Quickshell.iconPath(notificationObject.appIcon)
|
|
}
|
|
}
|
|
}
|
|
ColumnLayout { // Notification content
|
|
spacing: 0
|
|
Layout.fillWidth: true
|
|
|
|
RowLayout { // Row of summary, time and expand button
|
|
Layout.topMargin: 10
|
|
Layout.leftMargin: 10
|
|
Layout.rightMargin: 10
|
|
Layout.fillWidth: true
|
|
|
|
StyledText { // Summary
|
|
Layout.fillWidth: true
|
|
horizontalAlignment: Text.AlignLeft
|
|
font.pixelSize: Appearance.font.pixelSize.normal
|
|
color: Appearance.colors.colOnLayer2
|
|
text: notificationObject.summary
|
|
wrapMode: expanded ? Text.Wrap : Text.NoWrap
|
|
elide: Text.ElideRight
|
|
}
|
|
|
|
Item { Layout.fillWidth: true }
|
|
|
|
StyledText { // Time
|
|
id: notificationTimeText
|
|
Layout.fillWidth: false
|
|
wrapMode: Text.Wrap
|
|
horizontalAlignment: Text.AlignLeft
|
|
font.pixelSize: Appearance.font.pixelSize.smaller
|
|
color: Appearance.m3colors.m3outline
|
|
text: NotificationUtils.getFriendlyNotifTimeString(notificationObject.time)
|
|
|
|
Connections {
|
|
target: DateTime
|
|
function onTimeChanged() {
|
|
notificationTimeText.text = NotificationUtils.getFriendlyNotifTimeString(notificationObject.time)
|
|
}
|
|
}
|
|
}
|
|
|
|
Button { // Expand button
|
|
Layout.alignment: Qt.AlignVCenter
|
|
id: expandButton
|
|
implicitWidth: 22
|
|
implicitHeight: 22
|
|
|
|
PointingHandInteraction{}
|
|
onClicked: {
|
|
root.enableAnimation = true
|
|
root.expanded = !root.expanded
|
|
}
|
|
|
|
background: Rectangle {
|
|
anchors.fill: parent
|
|
radius: Appearance.rounding.full
|
|
color: (expandButton.down) ? Appearance.colors.colLayer2Active : (expandButton.hovered ? Appearance.colors.colLayer2Hover : Appearance.transparentize(Appearance.colors.colLayer2, 1))
|
|
|
|
Behavior on color {
|
|
ColorAnimation {
|
|
duration: Appearance.animation.elementDecel.duration
|
|
easing.type: Appearance.animation.elementDecel.type
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
contentItem: MaterialSymbol {
|
|
anchors.centerIn: parent
|
|
text: expanded ? "keyboard_arrow_up" : "keyboard_arrow_down"
|
|
horizontalAlignment: Text.AlignHCenter
|
|
verticalAlignment: Text.AlignVCenter
|
|
font.pixelSize: Appearance.font.pixelSize.normal
|
|
color: Appearance.colors.colOnLayer2
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
StyledText { // Notification body
|
|
Layout.fillWidth: true
|
|
Layout.leftMargin: 10
|
|
Layout.rightMargin: 10
|
|
Layout.bottomMargin: 10
|
|
clip: true
|
|
|
|
wrapMode: expanded ? Text.Wrap : Text.NoWrap
|
|
elide: Text.ElideRight
|
|
font.pixelSize: Appearance.font.pixelSize.small
|
|
horizontalAlignment: Text.AlignLeft
|
|
color: Appearance.m3colors.m3outline
|
|
// textFormat: Text.MarkdownText
|
|
text: notificationObject.body
|
|
}
|
|
}
|
|
}
|
|
|
|
// Actions
|
|
Flickable {
|
|
id: actionsFlickable
|
|
Layout.fillWidth: true
|
|
Layout.topMargin: -5
|
|
Layout.leftMargin: 10
|
|
Layout.rightMargin: 10
|
|
Layout.bottomMargin: 10
|
|
implicitHeight: actionRowLayout.implicitHeight
|
|
contentWidth: actionRowLayout.implicitWidth
|
|
clip: true
|
|
|
|
visible: expanded
|
|
|
|
RowLayout {
|
|
id: actionRowLayout
|
|
|
|
Repeater {
|
|
id: actionRepeater
|
|
model: notificationObject.actions
|
|
NotificationActionButton {
|
|
Layout.fillWidth: true
|
|
buttonText: modelData.text
|
|
urgency: notificationObject.urgency
|
|
onClicked: {
|
|
Notifications.attemptInvokeAction(notificationObject.id, modelData.identifier);
|
|
}
|
|
}
|
|
}
|
|
|
|
NotificationActionButton {
|
|
Layout.fillWidth: true
|
|
buttonText: "Close"
|
|
urgency: notificationObject.urgency
|
|
implicitWidth: (notificationObject.actions.length == 0) ? (actionsFlickable.width) :
|
|
(contentItem.implicitWidth + leftPadding + rightPadding)
|
|
onClicked: {
|
|
Notifications.discardNotification(notificationObject.id);
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|