Update (#109)

1. Themes support
2. Optimization
3. Some fixes

ags/apps/emoji/main.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import { RegularWindow } from "apps/window";
 import { MaterialIcon } from "icons";
 import Gtk from "gi://Gtk?version=3.0";

ags/apps/settings/appearance.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import { theme, theme_settings, settings_file } from "variables.ts";
 const GLib = imports.gi.GLib;
 import Gtk from "gi://Gtk?version=3.0";
@@ -357,6 +359,11 @@ export function Appearance() {
                 config.config.show_taskbar,
                 "Show taskbar",
                 "Requires ags restart"
+            ),
+            SwitchRow(
+                () => ToggleConfigVar("hide_empty_workspaces"),
+                config.config.hide_empty_workspaces,
+                "Hide empty workspaces"
             )
         ]
     });

ags/apps/settings/apps.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 const apps_script = `python -OOO ${App.configDir}/scripts/apps.py`;
 import { MaterialIcon } from "icons";
 

ags/apps/settings/bluetooth.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import { type BluetoothDevice } from "types/service/bluetooth";
 
 const bluetooth = await Service.import("bluetooth");

ags/apps/settings/info.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import { Binding } from "types/service";
 const GLib = imports.gi.GLib;
 import { cpu_cores, cpu_name, kernel_name, amount_of_ram, gpu_name, hostname, current_os, cur_uptime } from "variables";

ags/apps/settings/main.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import { RegularWindow } from "apps/window";
 import { Network } from "./network";
 import { Bluetooth } from "./bluetooth";
@@ -7,6 +9,7 @@ import { Info } from "./info";
 import { Apps } from "./apps";
 import { MaterialIcon } from "icons";
 import { Weather } from "./weather";
+import { Themes } from "./themes";
 import { current_tab, current_window, set_current_window } from "./variables";
 import Gtk from "gi://Gtk?version=3.0";
 
@@ -42,7 +45,8 @@ function Settings(cur_tab: string) {
             wallpaper: Page(Wallpapers(), "Wallpapers"),
             info: Page(Info(), "Info"),
             apps: Page(Apps(), "Apps"),
-            weather: Page(Weather(), "Weather")
+            weather: Page(Weather(), "Weather"),
+            themes: Page(Themes(), "Themes")
         }
     });
     const Row = (name: string, label: string, icon: string = "image-missing") =>
@@ -66,6 +70,7 @@ function Settings(cur_tab: string) {
             Widget.Separator(),
             Row("appearance", "Appearance", "palette"),
             Row("wallpaper", "Wallpapers", "image"),
+            Row("themes", "Themes", "tune"),
             Widget.Separator(),
             Row("apps", "Apps", "grid_view"),
             Row("weather", "Weather", "cloud"),

ags/apps/settings/network.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import { timeout } from "resource:///com/github/Aylur/ags/utils.js";
 import { MaterialIcon } from "icons";
 const systemtray = await Service.import("systemtray");

ags/apps/settings/themes.ts

@@ -0,0 +1,143 @@
+// by koeqaife ;)
+
+import { Variable as VariableType } from "types/variable";
+import { MaterialIcon } from "icons";
+import config from "services/configuration";
+import { type ThemeJson } from "variables";
+import { custom_theme } from "variables";
+
+const config_version = "1";
+const themes_folder = `${App.configDir}/themes`;
+const get_themes_cmd = `python -OOO ${App.configDir}/scripts/themes.py -a ${themes_folder}`;
+let _themes = Utils.exec(get_themes_cmd);
+const themes: VariableType<ThemeJson[]> = Variable(JSON.parse(_themes));
+const focused: VariableType<ThemeJson | null> = Variable<ThemeJson | null>(null);
+
+const DEFAULT: ThemeJson = {
+    name: "Default",
+    author: "koeqaife",
+    config_version: "universal",
+    description: "Hyprland-material-you theme",
+    hide: false,
+    load_default_css: true,
+    path: undefined,
+    version: "unknown"
+};
+const MESSAGES = {
+    may_not_be_compatible: "This theme may not be compatible with the current version of hyprland-material-you.",
+    unknown_version: "This theme does not specify ConfigVersion, the theme may not be compatible."
+};
+
+const theme = (theme: ThemeJson) =>
+    Widget.Button({
+        class_name: "row theme",
+        hexpand: true,
+        vpack: "start",
+        setup: (self) => {
+            if (config.config.current_theme == theme.path) focused.setValue(theme);
+            self.hook(focused, () => {
+                self.toggleClassName("focused", focused.value == theme);
+            });
+        },
+        on_clicked: () => {
+            focused.setValue(theme);
+        },
+        child: Widget.Box({
+            vertical: true,
+            hexpand: true,
+            vpack: "center",
+            children: [
+                Widget.Label({
+                    hpack: "start",
+                    class_name: "title",
+                    label: theme.name,
+                    truncate: "end"
+                }),
+                // @ts-expect-error
+                Widget.Box({
+                    children: [
+                        theme.config_version == "universal" ||
+                        (theme.config_version != "0" && theme.config_version == config_version)
+                            ? null
+                            : MaterialIcon("error", "18px", {
+                                  tooltip_text:
+                                      theme.config_version == "0"
+                                          ? MESSAGES.unknown_version
+                                          : MESSAGES.may_not_be_compatible
+                              }),
+                        Widget.Label({
+                            hpack: "start",
+                            class_name: "description",
+                            label: `${theme.description} (by ${theme.author})`,
+                            truncate: "end"
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+
+const theme_list = () => {
+    const reload = () => {
+        Utils.execAsync(get_themes_cmd).then((out) => {
+            themes.setValue(JSON.parse(out));
+        });
+    };
+    const _default = theme(DEFAULT);
+    const box = Widget.Box({
+        vertical: true,
+        children: [_default, ...themes.value.filter((value) => !value.hide).map((value) => theme(value))],
+        vexpand: true,
+        attribute: {
+            reload: reload
+        },
+        setup: (self) => {
+            self.hook(themes, () => {
+                box.children = [_default, ...themes.value.filter((value) => !value.hide).map((value) => theme(value))];
+            });
+        }
+    });
+    return box;
+};
+
+export const Themes = () => {
+    const _box = theme_list();
+    const _actions = Widget.Box({
+        class_name: "actions",
+        hpack: "end",
+        spacing: 5,
+        children: [
+            Widget.Button({
+                hpack: "end",
+                class_name: "standard_button",
+                label: "Reload",
+                on_clicked: () => {
+                    _box.attribute.reload();
+                }
+            }),
+            Widget.Button({
+                hpack: "end",
+                class_name: "filled_button",
+                label: "Select",
+                on_clicked: () => {
+                    custom_theme.setValue(null);
+                    config.config = {
+                        ...config.config,
+                        current_theme: focused.value?.path || null
+                    };
+                }
+            })
+        ]
+    });
+    const _bottom = Widget.Box({
+        hexpand: true,
+        vertical: true,
+        class_name: "bottom_bar",
+        children: [_actions]
+    });
+    return Widget.Box({
+        vertical: true,
+        class_name: "themes",
+        children: [_box, _bottom]
+    });
+};

ags/apps/settings/variables.ts

@@ -1,18 +1,26 @@
-import { Variable as VariableType } from "types/variable";
+// by koeqaife ;)
 
 export let current_window;
 export function set_current_window(value: any) {
     current_window = value;
 }
 
-export const current_tab = Variable("network");
-export const saved_networks: VariableType<string[]> = Variable([], {
-    poll: [
-        5000,
-        () => {
-            if (current_tab.value != "network" || !current_window?.visible) return saved_networks?.value || [];
-            const _saved = Utils.exec(`${App.configDir}/scripts/network.sh --saved`);
-            return _saved.split("\n");
-        }
-    ]
+export const current_tab = Variable("");
+export const saved_networks = Variable<string[]>([]);
+
+const _saved_networks = () => {
+    const _saved = Utils.exec(`${App.configDir}/scripts/network.sh --saved`);
+    saved_networks.setValue(_saved.split("\n"));
+};
+
+Utils.interval(10000, () => {
+    if (current_tab.value == "network" && current_window?.visible) {
+        _saved_networks();
+    }
+});
+
+current_tab.connect("changed", () => {
+    if (current_tab.value == "network") {
+        _saved_networks();
+    }
 });

ags/apps/settings/wallpapers.ts

@@ -1,5 +1,8 @@
+// by koeqaife ;)
+
 import { Variable as VariableType } from "types/variable";
 import { current_wallpaper } from "variables";
+import { current_tab } from "./variables";
 
 const GLib = imports.gi.GLib;
 const Gio = imports.gi.Gio;
@@ -13,15 +16,33 @@ const changing_states = {
     tasks: "Waiting for some tasks to finish...",
     finish: "Finished!"
 };
-Utils.monitorFile("/tmp/wallpaper.status", () => {
-    Utils.readFileAsync("/tmp/wallpaper.status")
-        .then((c) => {
-            changing_state.setValue(c);
-        })
-        .catch(() => {});
+
+var monitor: ReturnType<typeof Utils.monitorFile> | undefined;
+
+const start_monitor = () => {
+    if (!monitor)
+        monitor = Utils.monitorFile("/tmp/wallpaper.status", () => {
+            Utils.readFileAsync("/tmp/wallpaper.status")
+                .then((c) => {
+                    changing_state.setValue(c);
+                })
+                .catch(() => {});
+        });
+};
+
+const stop_monitor = () => {
+    if (monitor) {
+        monitor.cancel();
+        monitor = undefined;
+    }
+};
+
+current_tab.connect("changed", () => {
+    if (current_tab.value == "wallpaper") start_monitor();
+    else stop_monitor();
 });
-// @ts-ignore
-const focused: VariableType<null | string> = Variable(null);
+
+const focused: VariableType<null | string> = Variable<string | null>(null);
 
 function splitListInHalf<T>(arr: T[]): [T[], T[]] {
     const midPoint = Math.ceil(arr.length / 2);
@@ -166,6 +187,7 @@ export function Wallpapers() {
     const actions = Widget.Box({
         class_name: "actions",
         hpack: "end",
+        spacing: 5,
         children: [
             Widget.Button({
                 class_name: "standard_button",

ags/apps/settings/weather.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import conf from "services/configuration.ts";
 
 const WeatherKey = () =>

ags/apps/window.ts

@@ -1,3 +1,5 @@
+// by koeqaife ;)
+
 import Gtk from "gi://Gtk?version=3.0";
 
 export const RegularWindow = Widget.subclass<typeof Gtk.Window, Gtk.Window.ConstructorProperties>(Gtk.Window);