adding battery.js to ags

.config/ags/battery.js

@@ -0,0 +1,38 @@
+const css = `${App.configDir}/style.css`;
+const battery = await Service.import("battery");
+
+const laptop = Utils.exec(`hostname`) === "syl";
+
+export function BatteryPopup(monitor = laptop ? 0 : 2) {
+    const battery_state = battery.bind("percent");
+    return Widget.Window({
+        monitor,
+        name: `battery${monitor}`,
+        class_name: "battery-popup",
+        anchor: [laptop ? "bottom" : "top"],
+        css: "margin-right: 30px",
+        visible: battery_state.as(p => p < 25 ? true : false),
+        child: Widget.Box({
+            // css: "padding: .8em",
+            children: [
+                Widget.Icon({
+                    css: "padding: .8em",
+                    class_name: "battery-icon",
+                    icon: battery.bind("icon-name"),
+                }),
+                Widget.Label({
+                    css: "padding: .8em",
+                    label: battery.bind("percent").as(p => p + "% Please charge me!!"),
+                }),
+                Widget.Button({
+                    css: "font-size: 60px;",
+                    class_name: "battery-close",
+                    child: Widget.Icon({
+                        icon: "view-close",
+                    }),
+                    on_clicked: () => console.log("lets' close"),
+                })
+            ],
+        }),
+    })
+}