157 lines
4.3 KiB
QML
157 lines
4.3 KiB
QML
import Quickshell
|
|
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Layouts
|
|
import "NotificationBox.qml"
|
|
|
|
PanelWindow {
|
|
id: root
|
|
anchors {
|
|
top: true
|
|
right: true
|
|
bottom: true
|
|
}
|
|
visible: false
|
|
exclusionMode: ExclusionMode.Normal
|
|
implicitWidth: 500
|
|
color: "transparent"
|
|
|
|
function open() {
|
|
root.visible = true;
|
|
}
|
|
function close() {
|
|
exitAnim.start();
|
|
}
|
|
function toggle() {
|
|
if (exitAnim.running) return;
|
|
if (root.visible) close();
|
|
else open();
|
|
}
|
|
|
|
required property var tracked
|
|
|
|
Rectangle {
|
|
color: "#222"
|
|
anchors.fill: parent
|
|
Text {
|
|
id: title
|
|
anchors {
|
|
left: parent.left
|
|
top: parent.top
|
|
leftMargin: 12
|
|
topMargin: 12
|
|
}
|
|
text: "Notifications"
|
|
font.pixelSize: 20
|
|
font.family: "Comfortaa"
|
|
font.bold: true
|
|
color: "white"
|
|
}
|
|
Button {
|
|
anchors {
|
|
top: parent.top
|
|
right: parent.right
|
|
}
|
|
width: clearAllText.width + 32
|
|
height: clearAllText.height + 30
|
|
Text {
|
|
id: clearAllText
|
|
anchors {
|
|
right: parent.right
|
|
top: parent.top
|
|
topMargin: 14
|
|
rightMargin: 16
|
|
}
|
|
color: "white"
|
|
font.pixelSize: 16
|
|
font.family: "Comfortaa"
|
|
text: "Clear All"
|
|
}
|
|
onClicked: {while (root.tracked.values.length) {
|
|
root.tracked.values[0].tracked = false;
|
|
}}
|
|
property var hover: HoverHandler { }
|
|
background: Rectangle {
|
|
anchors {
|
|
fill: parent
|
|
topMargin: 6
|
|
leftMargin: 8
|
|
bottomMargin: 6
|
|
rightMargin: 8
|
|
}
|
|
radius: 12
|
|
color: parent.hover.hovered ? "#333" : "#222"
|
|
Behavior on color { PropertyAnimation {
|
|
duration: 150
|
|
}}
|
|
}
|
|
}
|
|
ListView {
|
|
anchors {
|
|
fill: parent
|
|
topMargin: 48
|
|
}
|
|
spacing: 10
|
|
|
|
add: Transition { NumberAnimation {
|
|
property: "translateX"
|
|
from: root.width
|
|
to: 0
|
|
duration: 300
|
|
easing.type: Easing.OutBack
|
|
easing.overshoot: 0.7
|
|
}}
|
|
remove: Transition { NumberAnimation {
|
|
property: "translateX"
|
|
from: 0
|
|
to: root.width
|
|
duration: 150
|
|
easing.type: Easing.InQuint
|
|
}}
|
|
displaced: Transition { NumberAnimation {
|
|
property: "y"
|
|
duration: 300
|
|
easing.type: Easing.InOutCubic
|
|
}}
|
|
|
|
model: root.tracked
|
|
delegate: Button {
|
|
anchors {
|
|
left: parent.left
|
|
right: parent.right
|
|
}
|
|
height: notifBox.height
|
|
background: NotificationBox {
|
|
id: notifBox
|
|
notification: modelData
|
|
anchors {
|
|
left: parent.left
|
|
right: parent.right
|
|
leftMargin: 12
|
|
rightMargin: 12
|
|
}
|
|
}
|
|
onClicked: modelData.tracked = false
|
|
property real translateX: 0
|
|
transform: Translate { x: translateX }
|
|
}
|
|
}
|
|
transform: Translate {
|
|
NumberAnimation on x {
|
|
running: root.visible
|
|
from: root.implicitWidth
|
|
to: 0
|
|
duration: 300
|
|
easing.type: Easing.OutQuint
|
|
}
|
|
NumberAnimation on x {
|
|
id: exitAnim
|
|
to: root.implicitWidth
|
|
duration: 300
|
|
easing.type: Easing.InQuint
|
|
onFinished: root.visible = false
|
|
}
|
|
}
|
|
}
|
|
}
|