New update to current version

bar/Bar.qml

@@ -6,93 +6,94 @@ import qs.common
 import qs.common.widgets
 
 Scope {
-  Variants {
-    model: Quickshell.screens;
-    PanelWindow {
-      required property var modelData
-      screen: modelData
-      WlrLayershell.layer: WlrLayer.Bottom
-      color: "transparent"
-      
-      Rectangle {
-        id: barBackground
-        anchors {
-          fill: parent
-          margins: Config.options.bar.cornerStyle === 1 ? (Appearance.sizes.hyprlandGapsOut) : 0
-        }
-        color: Config.options.bar.showBackground ? Appearance.colors.colLayer1 : "transparent"
-      }
-      
-      anchors {
-        top: true
-        left: true
-        right: true
-      }
+    Variants {
+        model: Quickshell.screens
+        PanelWindow {
+            required property var modelData
+            screen: modelData
+            WlrLayershell.layer: WlrLayer.Bottom
+            color: "transparent"
 
-      implicitHeight: Config.options.bar.height
+            Rectangle {
+                id: barBackground
+                anchors {
+                    fill: parent
+                    margins: Config.options.bar.cornerStyle === 1 ? (Appearance.sizes.hyprlandGapsOut) : 0
+                }
+                color: Config.options.bar.showBackground ? Appearance.colors.colLayer1 : "transparent"
+            }
 
-      RowLayout { // Left Section
-        id: leftSection
-        anchors {
-          verticalCenter: parent.verticalCenter
-          left: parent.left
-          leftMargin: 5
-        }
-        spacing: Config.options?.bar.borderless ? 4 : 8
-        Workspaces {}
-      }
+            anchors {
+                top: true
+                left: true
+                right: true
+            }
 
-      RowLayout { // Middle section
-        id: middleSection
-        anchors.centerIn: parent
-        spacing: Config.options?.bar.borderless ? 4 : 8
+            implicitHeight: Config.options.bar.height
 
-        Media {
-          visible: true
-          Layout.fillWidth: true
-        }
-      }
+            RowLayout { // Left Section
+                id: leftSection
+                anchors {
+                    verticalCenter: parent.verticalCenter
+                    left: parent.left
+                    leftMargin: 5
+                }
+                spacing: Config.options?.bar.borderless ? 4 : 8
+                Workspaces {}
+            }
 
-      RowLayout { // Right Section
-        id: rightSection
-        anchors {
-          verticalCenter: parent.verticalCenter
-          right: parent.right
-          rightMargin: 5
+            RowLayout { // Middle section
+                id: middleSection
+                anchors.centerIn: parent
+                spacing: Config.options?.bar.borderless ? 4 : 8
+
+                Media {
+                    visible: true
+                    Layout.fillWidth: true
+                }
+            }
+
+            RowLayout { // Right Section
+                id: rightSection
+                anchors {
+                    verticalCenter: parent.verticalCenter
+                    right: parent.right
+                    rightMargin: 5
+                }
+                spacing: Config.options?.bar.borderless ? 4 : 8
+                SysTray {
+                    Layout.fillWidth: false
+                    Layout.fillHeight: true
+                }
+                StyledText {
+                    Layout.alignment: Qt.AlignVCenter
+                    font.pixelSize: Appearance.font.pixelSize.larger
+                    color: Appearance.colors.colSubtext
+                    text: "•"
+                    visible: true
+                }
+                NotificationIcon {
+                    Layout.fillWidth: false
+                    Layout.fillHeight: true
+                }
+                StyledText {
+                    Layout.alignment: Qt.AlignVCenter
+                    font.pixelSize: Appearance.font.pixelSize.larger
+                    color: Appearance.colors.colSubtext
+                    text: "•"
+                    visible: true
+                }
+                ClockWidget {
+                    id: clock
+                    Layout.alignment: Qt.AlignVCenter
+                    Layout.fillHeight: true
+                    Layout.fillWidth: false
+                }
+                PowerButton {
+                    Layout.fillWidth: false
+                    Layout.fillHeight: true
+                }
+            }
         }
-        spacing: Config.options?.bar.borderless ? 4 : 8
-        SysTray {
-          Layout.fillWidth: false
-          Layout.fillHeight: true
-        }
-        StyledText {
-          Layout.alignment: Qt.AlignVCenter
-          font.pixelSize: Appearance.font.pixelSize.larger
-          color: Appearance.colors.colSubtext
-          text: "•"
-          visible: true
-        }
-        NotificationIcon {
-          Layout.fillWidth: false
-          Layout.fillHeight: true
-        }
-        StyledText {
-          Layout.alignment: Qt.AlignVCenter
-          font.pixelSize: Appearance.font.pixelSize.larger
-          color: Appearance.colors.colSubtext
-          text: "•"
-          visible: true
-        }
-        ClockWidget {
-          id: clock
-          Layout.fillHeight: true
-          Layout.fillWidth: false
-        }
-        PowerButton {
-          Layout.fillWidth: false
-          Layout.fillHeight: true
-        }
-      }
     }
-  }
-}
+}

bar/BarGroup.qml

@@ -1,4 +1,4 @@
-import qs.modules.common
+import qs.common
 import QtQuick
 import QtQuick.Layouts
 
@@ -6,4 +6,4 @@ Item {
   id: root
   property real padding: 5
   implicitHeight: Appearance.sizes.baseBarHeight
-}
+}

bar/ClockWidget.qml

@@ -4,5 +4,5 @@ import qs.common
 import qs.common.widgets
 
 StyledText {
-  text: Time.time
-}
+    text: Time.time
+}

bar/Media.qml

@@ -8,74 +8,74 @@ import qs.common
 import qs.common.widgets
 
 Item {
-  id: root
-  property bool borderless: Config.options.bar.borderless
-  
-  Layout.fillHeight: true
-  implicitWidth: rowLayout.implicitWidth + rowLayout.spacing * 2
-  implicitHeight: Appearance.sizes.barHeight
+    id: root
+    property bool borderless: Config.options.bar.borderless
 
-  Timer {
-    running: MprisController.hasPlayers && MprisController.activePlayer().isPlaying && MprisController.activePlayer().lengthSupported
-    interval: 1000
-    repeat: true
-    onTriggered: MprisController.activePlayer().positionChanged()
-  }
+    Layout.fillHeight: true
+    implicitWidth: rowLayout.implicitWidth + rowLayout.spacing * 2
+    implicitHeight: Appearance.sizes.barHeight
 
-  MouseArea {
-    anchors.fill: parent
-    acceptedButtons: Qt.MiddleButton | Qt.BackButton | Qt.ForwardButton | Qt.RightButton | Qt.LeftButton
-    onPressed: (event) => {
-      if (event.button === Qt.MiddleButton) {
-        MprisController.activePlayer().togglePlaying();
-      } else if (event.button === Qt.BackButton) {
-        MprisController.shiftPlayer(-1);
-      } else if (event.button === Qt.ForwardButton) {
-        MprisController.shiftPlayer(1);
-      } else if (event.button === Qt.LeftButton) {
-        GlobalStates.mediaControlsOpen = !GlobalStates.mediaControlsOpen;
-      }
-    }
-  }
-
-  RowLayout {
-    id: rowLayout
-
-    spacing: 4
-    anchors.fill: parent
-    visible: MprisController.hasPlayers
-    CircularProgress {
-      id: circularProgress
-      visible: MprisController.hasPlayers && MprisController.activePlayer().lengthSupported
-      Layout.alignment: Qt.AlignVCenter
-      Layout.leftMargin: rowLayout.spacing
-      lineWidth: 2
-      value: MprisController.activePlayer().lengthSupported ? MprisController.activePlayer()?.position / MprisController.activePlayer()?.length : 0
-      implicitSize: 26
-      colSecondary: Appearance.colors.colSecondaryContainer
-      colPrimary: Appearance.m3colors.m3onSecondaryContainer
-      enableAnimation: false
-
-      MaterialSymbol {
-        visible: MprisController.hasPlayers && MprisController.activePlayer().lengthSupported
-        anchors.centerIn: parent
-        fill: 1
-        text: MprisController.activePlayer()?.isPlaying ? "music_note" : "pause"
-        iconSize: Appearance.font.pixelSize.normal
-        color: Appearance.m3colors.m3onSecondaryContainer
-      }
+    Timer {
+        running: MprisController.hasPlayers && MprisController.activePlayer().isPlaying && MprisController.activePlayer().lengthSupported
+        interval: 1000
+        repeat: true
+        onTriggered: MprisController.activePlayer().positionChanged()
     }
 
-    StyledText {
-      visible: Config.options.bar.verbose
-      width: rowLayout.width - (circularProgress.size + rowLayout.spacing * 2)
-      Layout.alignment: Qt.AlignCenter
-      Layout.fillWidth: true
-      Layout.rightMargin: rowLayout.spacing
-      horizontalAlignment: Text.AlignHCenter
-      elide: Text.ElideRight
-      color: Appearance.colors.colOnLayer1
-      text: `${MprisController.activePlayer()?.trackTitle}${MprisController.activePlayer()?.trackArtist ? ' • ' + MprisController.activePlayer().trackArtist : ''}`
+    MouseArea {
+        anchors.fill: parent
+        acceptedButtons: Qt.MiddleButton | Qt.BackButton | Qt.ForwardButton | Qt.RightButton | Qt.LeftButton
+        onPressed: event => {
+            if (event.button === Qt.MiddleButton) {
+                MprisController.activePlayer().togglePlaying();
+            } else if (event.button === Qt.BackButton) {
+                MprisController.shiftPlayer(-1);
+            } else if (event.button === Qt.ForwardButton) {
+                MprisController.shiftPlayer(1);
+            } else if (event.button === Qt.LeftButton) {
+                GlobalStates.mediaControlsOpen = !GlobalStates.mediaControlsOpen;
+            }
+        }
     }
-  }
-}
+
+    RowLayout {
+        id: rowLayout
+
+        spacing: 4
+        anchors.fill: parent
+        visible: MprisController.hasPlayers
+        CircularProgress {
+            id: circularProgress
+            visible: false && MprisController.hasPlayers && MprisController.activePlayer().lengthSupported
+            Layout.alignment: Qt.AlignVCenter
+            Layout.leftMargin: rowLayout.spacing
+            lineWidth: 2
+            value: MprisController.activePlayer().lengthSupported ? MprisController.activePlayer()?.position / MprisController.activePlayer()?.length : 0
+            implicitSize: 26
+            colSecondary: Appearance.colors.colSecondaryContainer
+            colPrimary: Appearance.m3colors.m3onSecondaryContainer
+            enableAnimation: false
+
+            MaterialSymbol {
+                visible: MprisController.hasPlayers && MprisController.activePlayer().lengthSupported
+                anchors.centerIn: parent
+                fill: 1
+                text: MprisController.activePlayer()?.isPlaying ? "music_note" : "pause"
+                iconSize: Appearance.font.pixelSize.normal
+                color: Appearance.m3colors.m3onSecondaryContainer
+            }
+        }
+
+        StyledText {
+            visible: Config.options.bar.verbose
+            width: rowLayout.width - (circularProgress.size + rowLayout.spacing * 2)
+            Layout.alignment: Qt.AlignCenter
+            Layout.fillWidth: true
+            Layout.rightMargin: rowLayout.spacing
+            horizontalAlignment: Text.AlignHCenter
+            elide: Text.ElideRight
+            color: Appearance.colors.colOnLayer1
+            text: `${MprisController.activePlayer()?.trackTitle}${MprisController.activePlayer()?.trackArtist ? ' • ' + MprisController.activePlayer().trackArtist : ''}`
+        }
+    }
+}

bar/NotificationIcon.qml

@@ -14,7 +14,7 @@ Item {
     anchors.fill: parent
     acceptedButtons: Qt.LeftButton
     onPressed: (event) => {
-      GlobalStates.notificationPanelOpen = !GlobalStates.notificationPanelOpen;
+      GlobalStates.notificationPanelOpen = !GlobalStates.notificationPanelOpen && NotificationService.amountNotifications > 0;
     }
   }
 
@@ -43,4 +43,4 @@ Item {
       color: NotificationService.amountNotifications > 0 ? Appearance.m3colors.m3error : Appearance.m3colors.m3onSecondaryContainer
     }
   }
-}
+}

bar/Time.qml

@@ -4,13 +4,13 @@ import Quickshell
 import QtQuick
 
 Singleton {
-  id: root
-  readonly property string time: {
-    Qt.formatDateTime(clock.date, "ddd, MMM dd hh:mm:ss AP")
-  }
+    id: root
+    readonly property string time: {
+        Qt.formatDateTime(clock.date, "ddd, MMM dd hh:mm AP");
+    }
 
-  SystemClock {
-    id: clock
-    precision: SystemClock.Seconds
-  }  
-}
+    SystemClock {
+        id: clock
+        precision: SystemClock.Minutes
+    }
+}

osd/NotificationPanel.qml

@@ -17,19 +17,13 @@ Scope {
     onTriggered: GlobalStates.notificationPanelOpen = false
   }
 
-  Timer {
-    id: quickHideTimer
-    interval: 1
-    onTriggered: GlobalStates.notificationPanelOpen = false
-  }
-
   Loader {
     id: notificationPanelLoader
     active: GlobalStates.notificationPanelOpen
     onActiveChanged: {
-      if (notificationPanelLoader.active & NotificationService.amountNotifications == 0) {
-        quickHideTimer.restart();
-      }
+        if (notificationPanelLoader.active) {
+            hideTimer.restart();
+        }
     }
 
     sourceComponent: PanelWindow {
@@ -87,4 +81,4 @@ Scope {
       }
     }
   }
-}
+}

osd/VolumeDisplay.qml

@@ -5,100 +5,104 @@ import Quickshell.Services.Pipewire
 import Quickshell.Widgets
 import qs
 import qs.common
+import qs.common.widgets
 
 Scope {
-  id: root
+    id: root
 
-  // communicate when the volume display should show or not
-  property bool showVolumeDisplay: false
+    // communicate when the volume display should show or not
+    property bool showVolumeDisplay: false
 
-  // Bind to pipewire's default output node
-  // https://quickshell.org/docs/v0.2.0/types/Quickshell.Services.Pipewire/PwObjectTracker/
-  PwObjectTracker {
-    objects: [ Pipewire.defaultAudioSink ]
-  }
-
-  // Setup a connection to when the volume is changed
-  // https://doc.qt.io/qt-6/qml-qtqml-connections.html
-  Connections {
-    target: Pipewire.defaultAudioSink?.audio
-
-    function onVolumeChanged() {
-      GlobalStates.osdVolumeOpen = true;
-      hideTimer.restart();
+    // Bind to pipewire's default output node
+    // https://quickshell.org/docs/v0.2.0/types/Quickshell.Services.Pipewire/PwObjectTracker/
+    PwObjectTracker {
+        objects: [Pipewire.defaultAudioSink]
     }
-  }
 
-  // timer after 1 second hide the volume display
-  // https://doc.qt.io/qt-6/qml-qtqml-timer.html
-  Timer {
-    id: hideTimer
-    interval: Config.options.osd.timeout
-    onTriggered: GlobalStates.osdVolumeOpen = false
-  }
+    // Setup a connection to when the volume is changed
+    // https://doc.qt.io/qt-6/qml-qtqml-connections.html
+    Connections {
+        target: Pipewire.defaultAudioSink?.audio
 
-  // loader to create and destroy volume display 
-  LazyLoader {
-    active: GlobalStates.osdVolumeOpen
+        function onVolumeChanged() {
+            GlobalStates.osdVolumeOpen = true;
+            hideTimer.restart();
+        }
+    }
 
-    // according to documentation in Quickshell, PanelWindow is not an uncreatable-type, despite the qmlls language server's warning
-    // I assume that the yelling is because there is a discrepancy between implementation and language server
-    PanelWindow {
-      // it seems you can use {} if you want multiple under a category
-      // the example for that is in Bar.qml
-      anchors.bottom: true
-      // similar discrepancy it seems
-      margins.bottom: screen.height / 5
-      exclusiveZone: 0
+    // timer after 1 second hide the volume display
+    // https://doc.qt.io/qt-6/qml-qtqml-timer.html
+    Timer {
+        id: hideTimer
+        interval: Config.options.osd.timeout
+        onTriggered: GlobalStates.osdVolumeOpen = false
+    }
 
-      implicitHeight: 50
-      implicitWidth: 400
-      color: "transparent"
+    // loader to create and destroy volume display
+    LazyLoader {
+        active: GlobalStates.osdVolumeOpen
 
-      // prevents clicking on volume display
-      mask: Region {}
+        // according to documentation in Quickshell, PanelWindow is not an uncreatable-type, despite the qmlls language server's warning
+        // I assume that the yelling is because there is a discrepancy between implementation and language server
+        PanelWindow {
+            // it seems you can use {} if you want multiple under a category
+            // the example for that is in Bar.qml
+            anchors.bottom: true
+            // similar discrepancy it seems
+            margins.bottom: screen.height / 5
+            exclusiveZone: 0
 
-      Rectangle {
-        anchors.fill: parent
-        radius: height / 2
-        color: Appearance?.colors.colLayer1
+            implicitHeight: 50
+            implicitWidth: 400
+            color: "transparent"
 
-        // requires QtQuick.Layouts
-        RowLayout {
-          anchors {
-            fill: parent
-            leftMargin: 10
-            rightMargin: 15
-          }
-
-          IconImage {
-            implicitSize: 30
-            // comes from Quickshell.Widgets
-            source: Quickshell.iconPath("audio-volume-high-symbolic")
-          }
-
-          Rectangle {
-            Layout.fillWidth: true
-
-            implicitHeight: 20
-            radius: height / 2
-            color: Appearance?.m3colors.m3secondaryContainer
+            // prevents clicking on volume display
+            mask: Region {}
 
             Rectangle {
-              anchors {
-                left: parent.left
-                top: parent.top
-                bottom: parent.bottom
-              }
-              color: Appearance.colors.colPrimary
+                anchors.fill: parent
+                radius: height / 2
+                color: Appearance?.colors.colLayer1
 
-              // What I presume is that the first ? is to check if defaultAudioSink is there, and if not, the ?? marks the returning value in place
-              implicitWidth: parent.width * (Pipewire.defaultAudioSink?.audio.volume ?? 0)
-              radius: parent.radius
+                // requires QtQuick.Layouts
+                RowLayout {
+                    anchors {
+                        fill: parent
+                        leftMargin: 10
+                        rightMargin: 15
+                    }
+
+                    MaterialSymbol {
+                        iconSize: 30
+                        visible: true
+                        fill: 1
+                        // comes from Quickshell.Widgets
+                        text: "volume_up"
+                        color: Appearance.m3colors.m3onSecondaryContainer
+                    }
+
+                    Rectangle {
+                        Layout.fillWidth: true
+
+                        implicitHeight: 20
+                        radius: height / 2
+                        color: Appearance?.m3colors.m3secondaryContainer
+
+                        Rectangle {
+                            anchors {
+                                left: parent.left
+                                top: parent.top
+                                bottom: parent.bottom
+                            }
+                            color: Appearance.colors.colPrimary
+
+                            // What I presume is that the first ? is to check if defaultAudioSink is there, and if not, the ?? marks the returning value in place
+                            implicitWidth: parent.width * (Pipewire.defaultAudioSink?.audio.volume ?? 0)
+                            radius: parent.radius
+                        }
+                    }
+                }
             }
-          }
         }
-      }
     }
-  }
-}
+}