quickshell/NotificationOverlay.qml


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121

import Quickshell
import Quickshell.Services.Notifications
import Quickshell.Wayland
import QtQuick

PanelWindow {
  id: root

  anchors {
    top: true
    left: true
  }

  margins {
    top: 15
    left: 15
  }

  implicitWidth: 360
  implicitHeight: notificationColumn.implicitHeight

  color: "transparent"
  exclusiveZone: 0

  WlrLayershell.layer: WlrLayer.Overlay

  NotificationServer {
    id: server

    bodySupported: true
    imageSupported: true
    actionsSupported: true

    onNotification: notification => {
      notification.tracked = true
    }
  }

  Column {
    id: notificationColumn

    spacing: 10

    Repeater {
      model: server.trackedNotifications

      Rectangle {
        id: notification

        width: 360
        height: Math.max(content.implicitHeight + 24, 80)

        color: "#000000"

        border.width: 1
        border.color: "#404040"

        opacity: 0

        Behavior on y {
          NumberAnimation {
            duration: 200
            easing.type: Easing.OutCubic
          }
        }

        Behavior on opacity {
          NumberAnimation {
            duration: 150
          }
        }

        Component.onCompleted: opacity = 0.8

        Timer {
          interval: 2000
          running: true
          repeat: false

          onTriggered: {
            notification.opacity = 0
            destroyTimer.start()
          }
        }

        Timer {
          id: destroyTimer

          interval: 150
          running: false
          repeat: false

          onTriggered: {
            modelData.dismiss()
          }
        }

        Column {
          id: content

          anchors.fill: parent
          anchors.margins: 12

          spacing: 4

          Text {
            text: modelData.summary
            color: "white"
            font.bold: true
          }

          Text {
            text: modelData.body
            color: "white"
            wrapMode: Text.Wrap
          }
        }
      }
    }
  }
}