Notifications n shi

Panes/Launcher.qml

@@ -52,7 +52,7 @@ Item {
             onCursorPositionChanged: cursorPosition = text.length
             Keys.onPressed: (event) => { switch (event.key) {
                 case Qt.Key_Escape:
-                    root.close();
+                    background.index = 0;
                     break;
                 case Qt.Key_Return:
                     list.currentItem.execute();

Panes/NotificationCenter.qml

@@ -0,0 +1,153 @@
+import QtQuick
+import Quickshell
+import Quickshell.Widgets
+import Quickshell.Services.Mpris
+import Quickshell.Services.Notifications
+import "../Widgets" as Widgets
+
+Item {
+    anchors {
+        top: parent.top
+        horizontalCenter: parent.horizontalCenter
+    }
+    width: childrenRect.width + 12
+    height: childrenRect.height + 12
+    Row {
+        spacing: 6
+        x: 6
+        y: 6
+        Rectangle {
+            width: 400
+            height: 300
+            color: "#181818"
+            radius: 10
+            Column {
+                anchors.centerIn: parent
+                spacing: 2
+                opacity: !notifServer.trackedNotifications.values.length
+                Behavior on opacity {NumberAnimation {duration: 150}}
+                Image {
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    source: Quickshell.shellPath("assets/notif.svg")
+                    width: 24
+                    height: 24
+                    sourceSize {width: width; height: height}
+                    opacity: 0.5
+                }
+                Text {
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    color: "#888"
+                    text: "No notifications"
+                }
+            }
+            ListView {
+                anchors.fill: parent
+                clip: true
+                spacing: 4
+                header: Item {height: 4; width: 1}
+                model: Array.from(notifServer.trackedNotifications.values)
+                delegate: Widgets.Notification {
+                    color: "#222"
+                    anchors {
+                        left: parent.left
+                        right: parent.right
+                        margins: 4
+                    }
+                }
+            }
+        }
+        Item {
+            id: player
+            property var modelData: Mpris.players.values[0]
+            height: 300
+            width: 250
+            Column {
+                anchors.centerIn: parent
+                spacing: 2
+                Image {
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    source: Quickshell.shellPath("assets/player-symbolic.svg")
+                    width: 24
+                    height: 24
+                    sourceSize {width: width; height: height}
+                    opacity: 0.5
+                }
+                Text {
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    color: "#888"
+                    text: "Nothing playing"
+                }
+            }
+            Column {
+                anchors.centerIn: parent
+                opacity: Mpris.players.values.length
+                ClippingRectangle {
+                    color: "transparent"
+                    width: 180
+                    height: 180
+                    radius: height/2
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    Image {
+                        anchors.fill: parent
+                        source: player.modelData?.trackArtUrl ?? source
+                    }
+                    NumberAnimation on rotation {
+                        id: spin
+                        paused: !player.modelData?.isPlaying || !root.up || background.index !== 3
+                        duration: 30000
+                        loops: Animation.Infinite
+                        from: 0
+                        to: 360
+                    }
+                }
+                Item {width: 1; height: 10}
+                Text {
+                    color: "white"
+                    text: player.modelData?.trackTitle ?? ""
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    font.pixelSize: 16
+                }
+                Text {
+                    color: "white"
+                    text: player.modelData?.trackArtist ?? ""
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    font.pixelSize: 12
+                }
+                Item {width: 1; height: 8}
+                Row {
+                    height: childrenRect.height
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    component Button: Rectangle {
+                        id: button
+                        property var action
+                        property var clicked
+                        radius: 12
+                        color: hover.hovered ? "#11ffffff" : "#00ffffff"
+                        property var hover: HoverHandler {}
+                        width: 40
+                        height: width
+                        Image {
+                            anchors.fill: parent
+                            anchors.margins: 8
+                            sourceSize {width: width; height: height}
+                            source: Quickshell.shellPath(`assets/lazer-${action}-symbolic.svg`)
+                        }
+                        TapHandler {onTapped: button.clicked()}
+                    }
+                    Button {
+                        action: "previous"
+                        clicked: player.modelData?.previous
+                    }
+                    Button {
+                        action: player.modelData?.isPlaying ? "pause" : "play"
+                        clicked: player.modelData?.togglePlaying
+                    }
+                    Button {
+                        action: "next"
+                        clicked: player.modelData?.next
+                    }
+                }
+            }
+        }
+    }
+}

Panes/Notifications.qml

@@ -0,0 +1,28 @@
+import Quickshell
+import QtQuick
+import Quickshell.Services.Notifications
+import "../Widgets" as Widgets
+
+Item {
+    anchors {
+        top: parent.top
+        horizontalCenter: parent.horizontalCenter
+    }
+    width: 350
+    height: childrenRect.height
+    Connections {
+        target: notifServer
+        function onNotification(notif) {
+            if (root.up) return
+            background.index = 4
+            notifPopup.modelData = notif
+            root.open()
+        }
+    }
+    Widgets.Notification {
+        id: notifPopup
+        anchors.margins: 6
+        modelData: notifServer.trackedNotifications.values[0] ?? undefined
+        color: "transparent"
+    }
+}

Panes/Status.qml

@@ -3,7 +3,7 @@ import QtQuick
 import "../Widgets" as Widgets
 
 Item {
-    width: 800
+    width: 900
     height: 42
     anchors {
         top: parent.top
@@ -14,7 +14,6 @@ Item {
             top: parent.top
             left: parent.left
             bottom: parent.bottom
-            leftMargin: 0
         }
         Widgets.Battery {}
     }
@@ -31,13 +30,7 @@ Item {
             top: parent.top
             right: parent.right
             bottom: parent.bottom
-            rightMargin: 12
-        }
-        Text {
-            anchors.verticalCenter: parent.verticalCenter
-            property var clock: SystemClock {}
-            color: "white"
-            text: Qt.formatDateTime(clock.date, "ddd MMM dd · hh:mm")
         }
+        Widgets.Time {}
     }
 }