Added Power menu and show only the workspaces allocated to monitor

modules/bar/bar.js

@@ -7,19 +7,18 @@ import { Volume } from "./volume/index.js";
 import { Network } from "./network/index.js";
 import { Bluetooth } from "./bluetooth/index.js";
 import { BatteryLabel } from "./battery/index.js";
-import { Clock } from "./clock/index.js";
-import { SysTray } from "./systray/index.js";
+import { Clock } from "./clock/index.js"; import { SysTray } from "./systray/index.js";
 import { Power } from "./power/index.js";
 
 import { BarItemBox } from "../shared/barItemBox.js";
 
 // layout of the bar
-const Left = () => {
+const Left = (monitor, wsMap) => {
   return Widget.Box({
     class_name: "box-left",
     hpack: "start",
     spacing: 5,
-    children: [Menu(), BarItemBox(Workspaces()), BarItemBox(ClientTitle())],
+    children: [Menu(), BarItemBox(Workspaces(monitor, wsMap, 10)), BarItemBox(ClientTitle())],
   });
 };
 
@@ -27,7 +26,10 @@ const Center = () => {
   return Widget.Box({
     class_name: "box-center",
     spacing: 5,
-    children: [BarItemBox(Media()), BarItemBox(Notification())],
+    children: [
+      BarItemBox(Media()),
+      // BarItemBox(Notification())
+    ],
   });
 };
 
@@ -48,7 +50,40 @@ const Right = () => {
   });
 };
 
-const Bar = (monitor = 0) => {
+const LeftAlt = (monitor, wsMap) => {
+  return Widget.Box({
+    class_name: "box-left",
+    hpack: "start",
+    spacing: 5,
+    children: [Menu(), BarItemBox(Workspaces(monitor, wsMap)), BarItemBox(ClientTitle())],
+  });
+};
+
+const CenterAlt = () => {
+  return Widget.Box({
+    class_name: "box-center",
+    spacing: 5,
+    children: [
+      BarItemBox(Media()),
+      // BarItemBox(Notification())
+    ],
+  });
+};
+
+const RightAlt = () => {
+  return Widget.Box({
+    class_name: "box-right",
+    hpack: "end",
+    spacing: 5,
+    children: [
+      BarItemBox(Volume()),
+      BarItemBox(Clock()),
+      BarItemBox(Power()),
+    ],
+  });
+};
+
+const Bar = (monitor = 0, wsMap) => {
   return Widget.Window({
     name: `bar-${monitor}`,
     class_name: "bar",
@@ -56,11 +91,26 @@ const Bar = (monitor = 0) => {
     anchor: ["top", "left", "right"],
     exclusivity: "exclusive",
     child: Widget.CenterBox({
-      start_widget: Left(),
+      start_widget: Left(monitor, wsMap),
       center_widget: Center(),
       end_widget: Right(),
     }),
   });
 };
 
-export { Bar };
+const BarAlt = (monitor = 0, wsMap) => {
+  return Widget.Window({
+    name: `bar-${monitor}`,
+    class_name: "bar",
+    monitor,
+    anchor: ["top", "left", "right"],
+    exclusivity: "exclusive",
+    child: Widget.CenterBox({
+      start_widget: LeftAlt(monitor, wsMap),
+      center_widget: CenterAlt(),
+      end_widget: RightAlt(),
+    }),
+  });
+};
+
+export { Bar, BarAlt };

modules/bar/media/index.js

@@ -2,6 +2,7 @@ const mpris = await Service.import("mpris");
 
 const Media = () => {
   const activePlayer = Variable(mpris.players[0]);
+
   mpris.connect("changed", (value) => {
     const statusOrder = {
       Playing: 1,
@@ -22,12 +23,31 @@ const Media = () => {
     }
   });
 
-  const label = Utils.watch("", mpris, "player-changed", () => {
+  const getIconForPlayer = (playerName) => {
+    const windowTitleMap = [
+      ["Mozilla Firefox", "󰈹"],
+      ["Microsoft Edge", "󰇩"],
+      ["(.*)Discord(.*)", ""],
+      ["Plex", "󰚺  Plex"],
+      ["(.*) Spotify Free", "󰓇"],
+      ["(.*)Spotify Premium", "󰓇"],
+      ["Spotify", "󰓇"],
+      ["(.*)", "󰝚"],
+    ];
+
+    const foundMatch = windowTitleMap.find((wt) =>
+      RegExp(wt[0]).test(playerName),
+    );
+
+    return foundMatch ? foundMatch[1] : "󰝚";
+  };
+
+  const label = Utils.watch("󰎇 Nothing is playing 󰎇", mpris, "player-changed", () => {
     if (activePlayer.value) {
-      const { track_artists, track_title } = activePlayer.value;
-      return `󰝚  ${track_title} - ${track_artists.join(", ")} 󰝚`;
+      const { track_title, identity } = activePlayer.value;
+      return `${getIconForPlayer(identity)}  ${track_title}`;
     } else {
-      return "Nothing is playing";
+      return "󰎇 Nothing is playing 󰎇";
     }
   });
 
@@ -39,7 +59,12 @@ const Media = () => {
         on_primary_click: () => mpris.getPlayer("")?.playPause(),
         on_scroll_up: () => mpris.getPlayer("")?.next(),
         on_scroll_down: () => mpris.getPlayer("")?.previous(),
-        child: Widget.Label({ label }),
+        child: Widget.Label({
+          label,
+          truncate: 'end',
+          wrap: true,
+          maxWidthChars: 30,
+        }),
       }),
     }),
     isVisible: false,

modules/bar/power/index.js

@@ -2,6 +2,8 @@ export const Power = () => {
   return {
     component: Widget.Box({
       child: Widget.Button({
+        class_name: "powermenu",
+        on_clicked: () => App.toggleWindow("powermenu"),
         child: Widget.Label({
           class_name: "bar-power_label",
           label: "⏻",

modules/bar/window_title/index.js

@@ -18,7 +18,8 @@ const filterTitle = (titleString) => {
     ["Spotify", "󰓇  Spotify"],
     ["  ~", " Terminal"],
     ["(.*) - Obsidian(.*)", "󱓧  Obsidian"],
-    ["(.*)", `󰣆  ${titleString.charAt(0).toUpperCase() + titleString.slice(1)}`],
+    ["(.+)", `󰣆  ${titleString.charAt(0).toUpperCase() + titleString.slice(1)}`],
+    ["(.*)", `󰣆  Desktop`],
   ];
 
   const foundMatch = windowTitleMap.find((wt) =>

modules/bar/workspaces/index.js

@@ -4,28 +4,52 @@ function range(length, start = 1) {
   return Array.from({ length }, (_, i) => i + start);
 }
 
-const Workspaces = (ws) => {
+const Workspaces = (monitor = -1, wsMap = {}, ws = 8) => {
+  const getWorkspacesForMonitor = (curWs) => {
+    if (
+      Object.keys(wsMap)
+        .map((mn) => Number(mn))
+        .includes(monitor)
+    ) {
+      return wsMap[monitor].includes(curWs);
+    }
+    return true;
+  };
   return {
     component: Widget.Box({
       class_name: "workspaces",
-      children: range(ws || 8).map((i) =>
-        Widget.Label({
-          attribute: i,
-          vpack: "center",
-          label: `${i}`,
-          setup: (self) =>
-            self.hook(hyprland, () => {
-              self.toggleClassName(
-                "active",
-                hyprland.active.workspace.id === i,
-              );
-              self.toggleClassName(
-                "occupied",
-                (hyprland.getWorkspace(i)?.windows || 0) > 0,
-              );
-            }),
+      children: range(ws || 8)
+        .filter((i) => getWorkspacesForMonitor(i))
+        .map((i) => {
+          return Widget.Label({
+            attribute: i,
+            vpack: "center",
+            label: `${i}`,
+            setup: (self) =>
+              self.hook(hyprland, () => {
+                // console.log(`currentMonitor: ${monitor}`);
+                console.log(i);
+                console.log(JSON.stringify(hyprland.getWorkspace(i), null, 2));
+                if (hyprland.getWorkspace(i)) {
+                  // console.log(`currentMonitor: ${monitor}`);
+                }
+                self.toggleClassName(
+                  "active",
+                  hyprland.active.workspace.id === i,
+                );
+                self.toggleClassName(
+                  "occupied",
+                  (hyprland.getWorkspace(i)?.windows || 0) > 0,
+                );
+
+                const isCurrentMonitor =
+                  monitor !== -1 &&
+                  hyprland.getWorkspace(i)?.monitorID !== monitor;
+
+                self.toggleClassName("hidden", isCurrentMonitor);
+              }),
+          });
         }),
-      ),
       setup: (box) => {
         if (ws === 0) {
           box.hook(hyprland.active.workspace, () =>