Update waybar style, scripts and config

root/home/bhasher/.config/waybar/config

@@ -6,7 +6,7 @@
     // Choose the order of the modules
     "modules-left": ["hyprland/workspaces"],
     "modules-center": ["hyprland/window"],
-    "modules-right": ["pulseaudio", "custom/VPN", "network", "custom/bandwidth", "cpu", "memory", "battery", "tray", "clock"],
+    "modules-right": ["pulseaudio", "custom/VPN", "network", "custom/bandwidth", "cpu", "memory", "battery", "tray", "custom/notifications", "clock"],
     "hyprland/workspaces": {
         "disable-scroll": true,
         "all-outputs": false,
@@ -54,7 +54,7 @@
     },
     "network": {
         // "interface": "wlp2s0", // (Optional) To force the use of this interface
-        "format-wifi": "{essid} ({signalStrength}) ",
+        "format-wifi": "{essid} ({signalStrength}%) ",
         "format-ethernet": "{ifname}: {ipaddr}/{cidr} ",
         "format-disconnected": "Disconnected ⚠"
     },
@@ -64,8 +64,9 @@
     "custom/VPN": {
         "format": "{}",
         "interval": 5,
-        "max-length": 20,
+        "return-type": "json",
-        "exec": "$HOME/.config/waybar/scripts/vpn"
+        "exec": "$HOME/.config/waybar/scripts/vpn",
+        "on-click": "$HOME/.config/waybar/scripts/vpn-toggle"
     },
     "pulseaudio": {
         //"scroll-step": 1,
@@ -83,11 +84,24 @@
         },
         "on-click": "pavucontrol"
     },
-    "custom/spotify": {
+    "custom/notification": {
-        "format": " {}",
+        "tooltip": false,
-        "max-length": 40,
+        "format": "{icon}",
-        "interval": 30, // Remove this if your script is endless and write in loop
+        "format-icons": {
-        "exec": "$HOME/.config/waybar/mediaplayer.sh 2> /dev/null", // Script in resources folder
+            "notification": "<span foreground='red'><sup></sup></span>",
-        "exec-if": "pgrep spotify"
+            "none": "",
-    }
+            "dnd-notification": "<span foreground='red'><sup></sup></span>",
+            "dnd-none": "",
+            "inhibited-notification": "<span foreground='red'><sup></sup></span>",
+            "inhibited-none": "",
+            "dnd-inhibited-notification": "<span foreground='red'><sup></sup></span>",
+            "dnd-inhibited-none": ""
+        },
+        "return-type": "json",
+        "exec-if": "which swaync-client",
+        "exec": "swaync-client -swb",
+        "on-click": "swaync-client -t -sw",
+        "on-click-right": "swaync-client -d -sw",
+        "escape": true
+    },
 }

root/home/bhasher/.config/waybar/scripts/bandwidth

@@ -44,7 +44,7 @@ def main():
     num_left = "<span font='NotoSansMono'>"
     num_right = "</span>"
     fmt_str = (
-        f"{rx_icon}{num_left}{{rx}}{{unit_suffix}}{num_right}  "
+        f"{num_left}{{rx}}{{unit_suffix}} {rx_icon}{num_right}  "
         f"{tx_icon}{num_left}{{tx}}{{unit_suffix}}{num_right}"
     )
     unit_suffix = ""

root/home/bhasher/.config/waybar/scripts/vpn

@@ -2,11 +2,11 @@
 
 # Check if wireguard VPN is active
 if nmcli c show --active | grep -q wireguard; then
-  echo ""
+  echo '{"text": "VPN", "class": "up"}'
 # If not, check if the connection named "YapiBiche" is active
 elif nmcli c show --active | grep -q "YapiBiche"; then
-  echo ""
+  echo '{"text": "LAN", "class": "up"}'
 # If neither is active, return "NO"
 else
-  echo ""
+  echo '{"text": "OFF", "class": "down"}'
 fi

root/home/bhasher/.config/waybar/scripts/vpn-toggle

@@ -0,0 +1,11 @@
+#!/usr/bin/env sh
+
+env SUDO_ASKPASS=/usr/bin/lxqt-openssh-askpass
+
+if nmcli c show --active | grep -q wireguard; then
+  sudo -A wg-quick down bxl-shp
+  notify-send "VPN bxl-shp DOWN"
+else
+  sudo -A wg-quick up bxl-shp
+  notify-send "VPN bxl-shp UP"
+fi

root/home/bhasher/.config/waybar/style.css

@@ -39,23 +39,22 @@ window#waybar {
     border-bottom: 3px solid white;
 }
 
-#clock, #battery, #cpu, #memory, #network, #pulseaudio, #custom-spotify, #tray, #mode {
+#clock, #battery, #cpu, #memory, #network, #pulseaudio, #custom-spotify, #tray, #mode, #custom-VPN, #custom-bandwidth {
     padding: 0 3px;
     margin: 0 2px;
+    border-left: 1px solid #999;
 }
 
 #clock {
     font-weight: bold;
 }
 
-#battery {
-}
-
 #battery icon {
     color: red;
 }
 
 #battery.charging {
+  color: orange;
 }
 
 @keyframes blink {
@@ -74,29 +73,12 @@ window#waybar {
     animation-direction: alternate;
 }
 
-#cpu {
+#custom-VPN {
+  /*padding: 5px 10px;*/
 }
 
-#memory {
+#custom-VPN.down, #network.disconnected {
-}
+  border-radius: 5px;
-
+  background-color: #f33;
-#network {
-}
-
-#network.disconnected {
-    background: #f53c3c;
-}
-
-#pulseaudio {
-}
-
-#pulseaudio.muted {
-}
-
-#custom-spotify {
-    color: rgb(102, 220, 105);
-}
-
-#tray {
 }