refactor(ags): start rearranging ags files

config/ags/js/bar/current-window.js

@@ -0,0 +1,16 @@
+// https://github.com/Aylur/ags/wiki/Widgets
+
+const { Hyprland } = ags.Service;
+const { Label } = ags.Widget;
+const { Gtk } = imports.gi;
+
+const currentWindow = () => Label({
+  style: 'color: #CBA6F7; font-size: 18px',
+  connections: [
+    [Hyprland, label => {
+      label.label = Hyprland.active.client.title;
+    }, 'changed'],
+  ],
+});
+
+export const CurrentWindow = currentWindow();

config/ags/js/bar/traybuttons.js

@@ -0,0 +1,146 @@
+import Gdk from 'gi://Gdk';
+const display = Gdk.Display.get_default();
+import { CurrentWindow } from './current-window.js';
+import { Workspaces } from './workspaces.js';
+
+const Separator = width => ags.Widget.Box({
+  style: `min-width: ${width}px;`,
+});
+
+ags.Utils.subprocess(
+  ['bash', '-c', '/home/matt/.nix/config/ags/scripts/osk-toggle.sh getState'],
+  (output) => {
+    if (output == 'Running') {
+      OskToggle.toggleClassName('toggle-on', true);
+    } else {
+      OskToggle.toggleClassName('toggle-on', false);
+    }
+  },
+);
+const OskToggle = ags.Widget.EventBox({
+  className: 'toggle-off',
+  onPrimaryClickRelease: function() {
+    ags.Utils.subprocess(
+      ['bash', '-c', '/home/matt/.nix/config/ags/scripts/osk-toggle.sh toggle'],
+      (output) => {
+        if (output == 'Running') {
+          OskToggle.toggleClassName('toggle-on', false);
+        } else {
+          OskToggle.toggleClassName('toggle-on', true);
+        }
+      },
+    );
+  },
+  onHover: box => {
+    box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
+  },
+  onHoverLost: box => {
+    box.window.set_cursor(null);
+  },
+  child: ags.Widget.Box({
+    className: 'osk-toggle',
+    vertical: false,
+
+    children: [
+      ags.Widget.Label({
+        label: " 󰌌 ",
+      }),
+    ],
+  }),
+});
+
+ags.Utils.subprocess(
+  ['bash', '-c', 'tail -f /home/matt/.config/.heart'],
+  (output) => {
+    HeartToggle.child.children[0].label = ' ' + output;
+
+    if (output == '󰣐') {
+      HeartToggle.toggleClassName('toggle-on', true);
+    } else {
+      HeartToggle.toggleClassName('toggle-on', false);
+    }
+  },
+);
+const HeartToggle = ags.Widget.EventBox({
+  className: 'toggle-off',
+  halign: 'center',
+  onPrimaryClickRelease: function() {
+    ags.Utils.exec('/home/matt/.nix/config/ags/scripts/heart.sh toggle');
+  },
+  onHover: box => {
+    box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
+  },
+  onHoverLost: box => {
+    box.window.set_cursor(null);
+  },
+  child: ags.Widget.Box({
+    className: 'heart-toggle',
+    vertical: false,
+
+    child: ags.Widget.Label({
+      label: '',
+    }),
+  }),
+});
+
+export const LeftBar = ags.Widget.Window({
+  name: 'left-bar',
+  layer: 'overlay',
+  anchor: 'top left right',
+  exclusive: true,
+
+  child: ags.Widget.CenterBox({
+    className: 'transparent',
+    halign: 'fill',
+    style: 'margin-top: 5px; margin-left: 5px;',
+    vertical: false,
+    
+    children: [
+
+      ags.Widget.Box({
+        halign: 'start',
+        children: [
+
+          OskToggle,
+  
+          Separator(12),
+
+          ags.Widget.EventBox({
+            className: 'toggle-off',
+            onPrimaryClickRelease: '',
+            onHover: box => {
+              box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
+            },
+            onHoverLost: box => {
+              box.window.set_cursor(null);
+            },
+            child: ags.Widget.Box({
+              className: 'tablet-toggle',
+              vertical: false,
+
+              child: ags.Widget.Label({
+                label: " 󰦧 ",
+              }),
+            }),
+          }),
+      
+          Separator(12),
+
+          HeartToggle,
+
+          Separator(12),
+
+          Workspaces(),
+
+        ],
+      }),
+
+      CurrentWindow,
+
+      ags.Widget.Box({
+        halign: 'end',
+        style: 'background: red; min-width: 100px; min-height: 40px',
+      }),
+    ],
+  }),
+});

config/ags/js/bar/workspaces.js

@@ -0,0 +1,64 @@
+// https://github.com/Aylur/dotfiles/blob/f03e58ba0d3b56f1144631c179ab27357e466753/.config/ags/modules/hyprland.js#L4
+import Gdk from 'gi://Gdk';
+const display = Gdk.Display.get_default();
+const { App } = ags;
+const { Hyprland, Applications } = ags.Service;
+const { execAsync, lookUpIcon } = ags.Utils;
+const { Box, Button, EventBox, Label, Icon } = ags.Widget;
+
+export const Workspace = ({ i, } = {}) =>
+ags.Widget.Revealer({
+  transition: "slide_right",
+  child: EventBox({
+    onPrimaryClickRelease: () => execAsync(`hyprctl dispatch workspace ${i}`).catch(print),
+    onHover: box => {
+      box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
+    },
+    onHoverLost: box => {
+      box.window.set_cursor(null);
+    },
+    child: Box({
+      className: 'button',
+      child: Label(`${i}`),
+      connections: [
+        [Hyprland, btn => {
+          const { workspaces, active } = Hyprland;
+          const occupied = workspaces.has(i) && workspaces.get(i).windows > 0;
+          btn.toggleClassName('active', active.workspace.id === i);
+          btn.toggleClassName('occupied', occupied);
+          btn.toggleClassName('empty', !occupied);
+        }]
+      ],
+    }),
+  }),
+});
+
+var prev = Hyprland.active.workspace.id;
+
+export const Workspaces = props => Box({
+  className: 'workspaces panel-button',
+  children: [EventBox({
+    child: Box({
+      connections: [[Hyprland, box => {
+        let workspaces = [];
+
+        new Promise(resolve => {
+
+          Hyprland.workspaces.forEach(ws => {
+            if (ws.id > 0) workspaces.push(ws);
+          });
+
+          resolve();
+        }).then(value => {
+
+          box.children.forEach(rev => rev.reveal_child = false);
+          workspaces.forEach(ws => {
+            box.children[ws.id - 1].reveal_child = true;
+          });
+
+        });
+      }]],
+      children: Array.from({ length: 15 }, (_, i) => i + 1).map(i => Workspace({ i: i})),
+    }),
+  })],
+});

config/ags/js/common.js

@@ -0,0 +1,13 @@
+export const Closer = ags.Widget.Window({
+  name: 'closer',
+  popup: true,
+  layer: 'top',
+  anchor: 'top bottom left right',
+
+  child: ags.Widget.EventBox({
+    onPrimaryClickRelease: () => {
+      ags.App.closeWindow('powermenu');
+      ags.App.closeWindow('closer');
+    },
+  }),
+});

config/ags/js/powermenu.js

@@ -0,0 +1,37 @@
+export const Powermenu = ags.Widget.Window({
+  name: 'powermenu',
+  popup: true,
+  layer: 'overlay',
+
+  child: ags.Widget.CenterBox({
+    className: 'powermenu',
+    vertical: false,
+
+    startWidget: ags.Widget.Button({
+      className: 'shutdown',
+      onPrimaryClickRelease: 'echo shutdown',
+
+      child: ags.Widget.Label({
+        label: '襤',
+      }),
+    }),
+
+    centerWidget: ags.Widget.Button({
+      className: 'reboot',
+      onPrimaryClickRelease: 'echo reboot',
+
+      child: ags.Widget.Label({
+        label: '勒',
+      }),
+    }),
+
+    endWidget: ags.Widget.Button({
+      className: 'logout',
+      onPrimaryClickRelease: 'echo logout',
+
+      child: ags.Widget.Label({
+        label: '',
+      }),
+    }),
+  }),
+});