From e78496f43d9952592dabf2e30eff9d5c62273ef6 Mon Sep 17 00:00:00 2001
From: Chris Cochrun <chris@cochrun.xyz>
Date: Mon, 17 Jun 2024 17:06:08 -0500
Subject: [PATCH] make some ags config stuff

---
 .config/ags/config.js | 36 ++++++++++++++++++++++++++++++++++--
 .config/ags/style.css | 21 +++++++++++++++++++++
 2 files changed, 55 insertions(+), 2 deletions(-)
 create mode 100644 .config/ags/style.css

diff --git a/.config/ags/config.js b/.config/ags/config.js
index ce201a8..e83060b 100644
--- a/.config/ags/config.js
+++ b/.config/ags/config.js
@@ -1,20 +1,52 @@
+const css = `${App.configDir}/style.css`;
+const hyprland = await Service.import("hyprland");
+// const systray = await Service.import("systemtray");
+
+function workspaces() {
+    const active = hyprland.active.workspace.bind("id");
+    const workspaces = hyprland.bind("workspaces")
+          .as(ws => ws.map(({ id }) => Widget.Button({
+              onClicked: () => hyprland.messageAsync(`dispatch workspace ${id}`),
+              child: Widget.Label(`${id}`),
+              class_name: active.as(i => `${i === id ? "focused" : ""}`),
+          })))
+    return Widget.Box({
+        class_name: "workspaces",
+        children: workspaces,
+    })
+}
+
+const date = Variable("", {
+    poll: [1000, 'date "+\%a \%b \%d, \%-I:\%M \%p"'],
+})
+
 function Bar(monitor = 0) {
     const myLabel = Widget.Label({
         label: 'some example content',
     })
 
+    const clock = Widget.Label({
+        label: date.bind(),
+    })
+
     return Widget.Window({
         monitor,
         name: `bar${monitor}`, // this name has to be unique
         anchor: ['top', 'left', 'right'],
-        child: myLabel,
+        child: Widget.CenterBox({
+            startWidget: workspaces(),
+            centerWidget: clock,
+            endWidget: myLabel,
+        }),
     })
 }
 
 App.config({
+    style: css,
     windows: [
         Bar(0), // can be instantiated for each monitor
         Bar(1),
-        Bar(2),
     ],
 })
+
+export { }
diff --git a/.config/ags/style.css b/.config/ags/style.css
new file mode 100644
index 0000000..da7a8e4
--- /dev/null
+++ b/.config/ags/style.css
@@ -0,0 +1,21 @@
+window {
+    background-color: transparent;
+}
+
+.workspaces {
+    background-color: blue;
+    border-color: purple;
+}
+
+button:active {
+    background-color: @theme_selected_bg_color;
+}
+
+button:hover {
+    border-bottom: 3px solid @theme_fg_color;
+}
+
+.workspaces button.focused {
+    background-color: @theme_selected_bg_color;
+    color: @theme_selected_fg_color;
+}