Appearence Enhancements

.config/ags/config.js

@@ -10,8 +10,9 @@ import { firstRunWelcome, startBatteryWarningService } from './services/messages
 import { startAutoDarkModeService } from './services/darkmode.js';
 // Widgets
 import { Bar, BarCornerTopleft, BarCornerTopright } from './modules/bar/main.js';
-import Cheatsheet from './modules/cheatsheet/main.js';
+// import Cheatsheet from './modules/cheatsheet/main.js';
 // import DesktopBackground from './modules/desktopbackground/main.js';
+import Wallselect from './modules/wallselect/main.js'
 import Dock from './modules/dock/main.js';
 import Corner from './modules/screencorners/main.js';
 import Crosshair from './modules/crosshair/main.js';
@@ -42,9 +43,10 @@ startBatteryWarningService().catch(print)
 const Windows = () => [
     // forMonitors(DesktopBackground),
     forMonitors(Crosshair),
+    forMonitors(Wallselect),
     Overview(),
     forMonitors(Indicator),
-    forMonitors(Cheatsheet),
+  //  forMonitors(Cheatsheet),
     SideLeft(),
     SideRight(),
     forMonitors(Osk),

.config/ags/modules/.configuration/user_options.js

@@ -147,6 +147,12 @@ let configOptions = {
     },
     'workspaces': {
         'shown': 10,
+        'style': 'japanese'
+    },
+    'wallselect': {
+        'enabled': true,
+        'wallpaperFolder': '/Pictures/Wallpapers',
+        'wallpaperLimit': 100
     },
     'dock': {
         'enabled': false,

.config/ags/modules/bar/normal/workspaces_hyprland.js

@@ -36,6 +36,22 @@ const getFontWeightName = (weight) => {
     }
 }
 
+// Number style conversion functions
+const numberStyles = {
+    'arabic': (n) => n.toString(),
+    'thai': (n) => n.toString().replace(/[0-9]/g, d => '๐๑๒๓๔๕๖๗๘๙'[d]),
+    'japanese': (n) => n.toString().replace(/[0-9]/g, d => '〇一二三四五六七八九'[d]),
+    'chinese': (n) => n.toString().replace(/[0-9]/g, d => '零一二三四五六七八九'[d]),
+    'korean': (n) => n.toString().replace(/[0-9]/g, d => '영일이삼사오육칠팔구'[d]),
+    'devanagari': (n) => n.toString().replace(/[0-9]/g, d => '०१२३४५६७८९'[d]),
+    'bengali': (n) => n.toString().replace(/[0-9]/g, d => '০১২৩৪৫৬৭৮৯'[d])
+};
+
+const convertNumber = (number, style = 'arabic') => {
+    const converter = numberStyles[style] || numberStyles.arabic;
+    return converter(number);
+};
+
 // Font size = workspace id
 const WorkspaceContents = (count = 10) => {
     return DrawingArea({
@@ -165,7 +181,11 @@ const WorkspaceContents = (count = 10) => {
                     else
                         cr.setSourceRGBA(inactivecolors.red, inactivecolors.green, inactivecolors.blue, inactivecolors.alpha);
 
-                    layout.set_text(`${i + offset}`, -1);
+                    // Convert number to selected style
+                    const numberStyle = userOptions.workspaces.style || 'arabic';
+                    const displayNumber = convertNumber(i + offset, numberStyle);
+                    layout.set_text(displayNumber, -1);
+
                     const [layoutWidth, layoutHeight] = layout.get_pixel_size();
                     const x = -workspaceRadius + (workspaceDiameter * i) - (layoutWidth / 2);
                     const y = (height - layoutHeight) / 2;
@@ -179,20 +199,23 @@ const WorkspaceContents = (count = 10) => {
 }
 
 export default () => EventBox({
-    onScrollUp: () => Hyprland.messageAsync(`dispatch workspace r-1`).catch(print),
-    onScrollDown: () => Hyprland.messageAsync(`dispatch workspace r+1`).catch(print),
+    // onScrollUp: () => Hyprland.messageAsync(`dispatch workspace -1`).catch(print),
+    // onScrollDown: () => Hyprland.messageAsync(`dispatch workspace +1`).catch(print),
     onMiddleClick: () => toggleWindowOnAllMonitors('osk'),
     onSecondaryClick: () => App.toggleWindow('overview'),
+    hexpand:true,
     attribute: {
         clicked: false,
         ws_group: 0,
     },
     child: Box({
         homogeneous: true,
         className: 'bar-group-margin',
+        hexpand:true,
         children: [Box({
             className: 'bar-group bar-group-standalone bar-group-pad',
             css: 'min-width: 2px;',
+            hexpand:true,
             children: [WorkspaceContents(userOptions.workspaces.shown)],
         })]
     }),

.config/ags/modules/indicators/colorscheme.js

@@ -78,23 +78,23 @@ function calculateSchemeInitIndex(optionsArr, searchValue = 'vibrant') {
 
 const schemeOptionsArr = [
     [
-        { name: getString('Tonal Spot'), value: 'tonalspot' },
-        { name: getString('Fruit Salad'), value: 'fruitsalad' },
+        { name: getString('Tonal Spot'), value: 'tonal-spot' },
+        { name: getString('Fruit Salad'), value: 'fruit-salad' },
         { name: getString('Fidelity'), value: 'fidelity' },
         { name: getString('Rainbow'), value: 'rainbow' },
     ],
     [
         { name: getString('Neutral'), value: 'neutral' },
         { name: getString('Monochrome'), value: 'monochrome' },
         { name: getString('Expressive'), value: 'expressive' },
-        { name: getString('Vibrant'), value: 'vibrant' },
+        { name: getString('Vibrant'), value: 'content' },
     ],
     [
-        { name: getString('Vibrant+'), value: 'morevibrant' },
+        // { name: getString('Vibrant+'), value: 'morevibrant' },
     ],
-    //[
-    //  { name: getString('Content'), value: 'content' },
-    //]
+    [
+     { name: getString('Content'), value: 'content' },
+    ]
 ];
 
 const LIGHTDARK_FILE_LOCATION = `${GLib.get_user_state_dir()}/ags/user/colormode.txt`;
@@ -133,43 +133,18 @@ const ColorSchemeSettings = () => Widget.Box({
                 ConfigToggle({
                     icon: 'border_clear',
                     name: getString('Transparency'),
-                    desc: getString('Make shell elements transparent'),
+                    desc: getString('Make Everything transparent'),
                     initValue: initTransparencyVal,
-                    onChange: (self, newValue) => {
-                        let transparency = newValue == 0 ? "opaque" : "transparent";
-                        execAsync([`bash`, `-c`, `mkdir -p ${GLib.get_user_state_dir()}/ags/user && sed -i "2s/.*/${transparency}/"  ${GLib.get_user_state_dir()}/ags/user/colormode.txt`])
-                            .then(execAsync(['bash', '-c', `${App.configDir}/scripts/color_generation/switchcolor.sh`]))
-                            .catch(print);
+                    onChange: async (self, newValue) => {
+                        try {
+                            const transparency = newValue == 0 ? "opaque" : "transparent";
+                            await execAsync([`bash`, `-c`, `mkdir -p ${GLib.get_user_state_dir()}/ags/user && sed -i "2s/.*/${transparency}/"  ${GLib.get_user_state_dir()}/ags/user/colormode.txt`]);
+                            await execAsync(['bash', '-c', `${App.configDir}/scripts/color_generation/applycolor.sh &`]);
+                        } catch (error) {
+                            console.error('Error changing transparency:', error);
+                        }
                     },
-                }),
-                Widget.Box({
-                    tooltipText: getString('Theme GTK apps using accent color\n(drawback: dark/light mode switching requires restart)'),
-                    className: 'txt spacing-h-5 configtoggle-box',
-                    children: [
-                        MaterialIcon('imagesearch_roller', 'norm'),
-                        Widget.Label({
-                            className: 'txt txt-small',
-                            label: getString('Use Gradience'),
-                        }),
-                        Widget.Box({ hexpand: true }),
-                        ConfigMulipleSelection({
-                            hpack: 'center',
-                            vpack: 'center',
-                            optionsArr: [
-                                [{ name: 'Off', value: 0 }, { name: 'On', value: 1 }],
-                            ],
-                            initIndex: [-1, -1],
-                            onChange: (value, name) => {
-                                const ADWAITA_BLUE = "#3584E4";
-                                if (value) execAsync([`bash`, `-c`, `${App.configDir}/scripts/color_generation/switchcolor.sh - --yes-gradience`, `&`])
-                                    .catch(print);
-                                else execAsync([`bash`, `-c`, `${App.configDir}/scripts/color_generation/switchcolor.sh "${ADWAITA_BLUE}" --no-gradience`, `&`])
-                                    .catch(print);
-
-                            },
-                        }),
-                    ]
-                }),
+                })
             ]
         }),
         Widget.Box({

.config/ags/modules/indicators/main.js

@@ -23,7 +23,7 @@ export default (monitor = 0) => Widget.Window({
             css: 'min-height: 2px;',
             children: [
                 IndicatorValues(monitor),
-                MusicControls(),
+                // MusicControls(),
                 NotificationPopups(),
                 ColorScheme(),
             ]

.config/ags/modules/wallselect/main.js

@@ -0,0 +1,173 @@
+import Widget from "resource:///com/github/Aylur/ags/widget.js";
+import * as Utils from "resource:///com/github/Aylur/ags/utils.js";
+import App from "resource:///com/github/Aylur/ags/app.js";
+import userOptions from "../.configuration/user_options.js";
+import GLib from 'gi://GLib';
+const { Box, Label, EventBox, Scrollable, Button } = Widget;
+// Constants
+const CONFIG_DIR = GLib.get_home_dir() + '/.config/ags';
+const WALLPAPER_DIR = GLib.get_home_dir() + (userOptions.wallselect.wallpaperFolder || '/Pictures/wallpapers');
+const THUMBNAIL_DIR = GLib.build_filenamev([WALLPAPER_DIR, "thumbnails"]);
+
+// Cached Variables
+let wallpaperPathsPromise = null;
+let cachedContent = null;
+
+// Wallpaper Button
+const WallpaperButton = (path) => 
+    Widget.Button({
+        child: Box({ className: "preview-box", css: `background-image: url("${path}");` }),
+        onClicked: () => {
+                Utils.execAsync(['sh', `${CONFIG_DIR}/scripts/color_generation/switchwall.sh`, path.replace("thumbnails", "")]);
+                App.closeWindow("wallselect");
+        },
+    });
+
+// Get Wallpaper Paths
+const getWallpaperPaths = () => {
+    if (wallpaperPathsPromise) return wallpaperPathsPromise;
+    wallpaperPathsPromise = Utils.execAsync(
+        `find ${GLib.shell_quote(THUMBNAIL_DIR)} -type f \\( -iname "*.jpg" -o -iname "*.jpeg" -o -iname "*.png" -o -iname "*.gif" -o -iname "*.webp" -o -iname "*.tga" -o -iname "*.tiff" -o -iname "*.bmp" -o -iname "*.ico" \\)`
+    ).then(files => files.split("\n").filter(Boolean));
+    return wallpaperPathsPromise;
+};
+
+// Create Content
+const createContent = async () => {
+    if (cachedContent) return cachedContent;
+
+    try {
+        const wallpaperPaths = await getWallpaperPaths();
+
+        if (wallpaperPaths.length === 0) {
+            return createPlaceholder();
+        }
+
+        cachedContent = EventBox({
+            onPrimaryClick: () => App.closeWindow("wallselect"),
+            onSecondaryClick: () => App.closeWindow("wallselect"),
+            onMiddleClick: () => App.closeWindow("wallselect"),
+            child: Scrollable({
+                hexpand: true,
+                vexpand: false,
+                hscroll: "always",
+                vscroll: "never",
+                child: Box({
+                    className: "wallpaper-list",
+                    children: wallpaperPaths.map(WallpaperButton),
+                }),
+            }),
+        });
+
+        return cachedContent;
+
+    } catch (error) {
+        console.error("Error creating content:", error);
+        return Box({
+            className: "wallpaper-error",
+            vexpand: true,
+            hexpand: true,
+            children: [
+                Label({ label: "Error loading wallpapers. Check the console for details.", className: "txt-large txt-error", }),
+            ],
+        });
+    }
+};
+
+// Placeholder content when no wallpapers found
+const createPlaceholder = () => Box({
+    className: 'wallpaper-placeholder',
+    vertical: true,
+    vexpand: true,
+    hexpand: true,
+    spacing: 10,
+    children: [
+        Box({
+            vertical: true,
+            vpack: 'center',
+            hpack: 'center',
+            vexpand: true,
+            children: [
+                Label({ label: 'No wallpapers found.', className: 'txt-norm onSurfaceVariant', }),
+                Label({ label: 'Generate thumbnails to get started.',opacity:0.8, className: 'txt-small onSurfaceVariant', }),
+            ],
+        }),
+    ],
+});
+
+// Generate Thumbnails Button
+const GenerateButton = () => Widget.Button({
+    className: 'button-accent generate-thumbnails',
+    child: Box({
+        spacing:8,
+        children: [
+            Widget.Icon({ icon: 'view-refresh-symbolic', size: 16, }),
+            Widget.Label({ className:"txt-small onSurfaceVariant",label: 'Generate Thumbnails', }),
+        ],
+    }),
+    tooltipText: 'Regenerate all wallpaper thumbnails',
+    onClicked: () => {
+        Utils.execAsync([`bash`, `${CONFIG_DIR}/scripts/generate_thumbnails.sh`])
+            .then(() => {
+                cachedContent = null; // Invalidate cache
+                App.closeWindow('wallselect');
+                App.openWindow('wallselect');
+            })
+            .catch((error) => console.error("Error generating thumbnails:", error));
+    },
+});
+
+// Toggle Wallselect Window
+const toggleWindow = () => {
+    const win = App.getWindow('wallselect');
+    if (!win) return;
+    win.visible = !win.visible;
+};
+export { toggleWindow };
+
+// Main Window
+export default () => Widget.Window({
+    name: "wallselect",
+    anchor: ['top', 'bottom', 'right', 'left'],
+    layer: 'overlay',
+    visible: false,
+    child: Widget.Overlay({
+        child: EventBox({
+            onPrimaryClick: () => App.closeWindow("wallselect"),
+            onSecondaryClick: () => App.closeWindow("wallselect"),
+            onMiddleClick: () => App.closeWindow("wallselect"),
+            child: Box({ css: 'min-height: 1000px;', }),
+        }),
+        overlays: [
+            Box({
+                vertical: true,
+                className: "sidebar-right spacing-v-15",
+                vpack: "start",
+                children: [
+                    Box({
+                        className: "wallselect-header",
+                        children: [
+                            Box({ hexpand: true }),
+                            GenerateButton(),
+                        ],
+                    }),
+                    Box({
+                        vertical: true,
+                        className: "sidebar-module",
+                        setup: (self) =>
+                            self.hook(
+                                App,
+                                async (_, name, visible) => {
+                                    if (name === "wallselect" && visible) {
+                                        const content = await createContent();
+                                        self.children = [content];
+                                    }
+                                },
+                                "window-toggled",
+                            ),
+                    }),
+                ],
+            }),
+        ],
+    }),
+});