Changed OSD, new Sliders, new script for hooking active player and some fixes

ags/app.ts

@@ -1,12 +1,14 @@
 import AstalNotifd from "gi://AstalNotifd";
+import AstalHyprland from "gi://AstalHyprland";
+import AstalMpris from "gi://AstalMpris";
 
-import { App } from "astal/gtk3"
+import { App, Astal } from "astal/gtk3"
 import { Wireplumber } from "./scripts/volume";
 
 import { handleArguments } from "./scripts/arg-handler";
 import { Time, timeout } from "astal/time";
 
-import { OSDModes, setOSDMode } from "./window/OSD";
+import { OSDModes, setOSDMode, variableHandler } from "./window/OSD";
 
 import { Runner } from "./runner/Runner";
 import { PluginApps } from "./runner/plugins/apps";
@@ -22,7 +24,11 @@ import { Stylesheet } from "./scripts/stylesheet";
 import { Clipboard } from "./scripts/clipboard";
 import { PluginClipboard } from "./runner/plugins/clipboard";
 import { Config } from "./scripts/config";
+import { AstalPlayers } from "./scripts/player";
 
+const hyprland = AstalHyprland.get_default();
+const audio = Wireplumber.getDefault();
+const player = AstalPlayers.getDefault();
 
 let osdTimer: (Time|undefined);
 let connections = new Map<GObject.Object, (Array<number> | number)>();
@@ -46,6 +52,7 @@ App.start({
     main: (..._args: Array<string>) => {
         console.log(`Initialized astal instance as: ${ App.instanceName || "astal" }`);
 
+
         console.log("Config: initializing configuration file");
         Config.getDefault();
 
@@ -61,11 +68,37 @@ App.start({
         // Init clipboard module
         Clipboard.getDefault();
 
-        connections.set(Wireplumber.getDefault(), [
-            Wireplumber.getDefault().getDefaultSink().connect("notify::volume", () => 
-                triggerOSD(OSDModes.SINK))
+        //OSD Layout
+        connections.set(hyprland, [
+            hyprland.connect("keyboard-layout", (_, Keyboard, layout) => {
+                variableHandler(OSDModes.LAYOUT, layout);
+                triggerOSD(OSDModes.LAYOUT);
+            })
+        ]);
+
+        const audioHandler = () => triggerOSD(OSDModes.SINK);
+        const sinkHandler = () => triggerOSD(OSDModes.SOURCE);
+        //OSD Wireplumber
+        connections.set(audio, [
+            audio.getDefaultSink().connect("notify::volume", audioHandler),
+            audio.getDefaultSink().connect("notify::mute", audioHandler),
+            audio.getDefaultSource().connect("notify::volume", sinkHandler),
+            audio.getDefaultSource().connect("notify::mute", sinkHandler),
         ]);
 
+        //OSD Player
+        /*connections.set(player, [
+            AstalPlayers.getDefault().activePlayer.connect("notify::title", () =>           
+                triggerOSD(OSDModes.PLAYER)
+            ),
+            player.activePlayer.connect("notify::playback-status", (s) => {
+                if (s.playbackStatus === AstalMpris.PlaybackStatus.PLAYING && 
+                    hyprland.get_focused_client().get_fullscreen() === AstalHyprland.Fullscreen.FULLSCREEN &&
+                    hyprland.get_focused_client().get_class().toLowerCase() !== player.activePlayer.get_enrty().toLowerCase()) 
+                    triggerOSD(OSDModes.PLAYER); 
+            })
+        ])*/
+
         connections.set(Notifications.getDefault(), [
             Notifications.getDefault().connect("notification-added", (_, _notif: AstalNotifd.Notification) => {
                 Windows.open("floating-notifications");
@@ -91,21 +124,15 @@ App.start({
 });
 
 function triggerOSD(osdModeParam: OSDModes) {
-    if(Windows.isVisible("control-center")) return;
+    if (Windows.isVisible("control-center")) return;
 
     Windows.open("osd");
+    setOSDMode(osdModeParam);
 
-    if(!osdTimer) {
-        setOSDMode(osdModeParam);
-        osdTimer = timeout(3000, () => {
-            osdTimer = undefined;
-            Windows.close("osd");
-        });
-
-        return;
+    if (osdTimer) {
+        osdTimer.cancel();
     }
 
-    osdTimer.cancel();
     osdTimer = timeout(3000, () => {
         Windows.close("osd");
         osdTimer = undefined;

ags/scripts/clipboard.ts

@@ -81,7 +81,8 @@ class Clipboard extends GObject.Object {
     }
 
     public async copyAsync(content: string): Promise<void> {
-        await execAsync(`wl-copy "${content}"`).catch((err: Gio.IOErrorEnum) => {
+        const sanitizedContent = content.replace(/"/g, '\\"');
+        await execAsync(`wl-copy "${sanitizedContent}"`).catch((err: Gio.IOErrorEnum) => {
             console.error(`Clipboard: Couldn't copy text using wl-copy. Stderr:\n\t${err.message
                 } | Stack:\n\t\t${err.stack}`);
         });

ags/scripts/player.ts

@@ -0,0 +1,110 @@
+import { GObject, register, property } from "astal";
+import AstalMpris from "gi://AstalMpris";
+
+export { AstalPlayers };
+
+@register({ GTypeName: "AstalPlayers" })
+class AstalPlayers extends GObject.Object {
+    private static astalMpris: AstalMpris.Mpris = AstalMpris.Mpris.get_default();
+    private static inst: AstalPlayers;
+
+    #players: AstalMpris.Player[] = [];
+    #activePlayer: AstalMpris.Player | null = null;
+    #playerConnections: Map<AstalMpris.Player, number[]> = new Map();
+
+    @property(AstalMpris.Player)
+    get activePlayer() {
+        return this.#activePlayer;
+    }
+
+    constructor() {
+        super();
+
+        AstalPlayers.astalMpris.connect('player-added', (_, player) => this._addPlayer(player));
+        AstalPlayers.astalMpris.connect('player-closed', (_, player) => this._removePlayer(player));
+
+        this.#players = AstalPlayers.astalMpris.get_players();
+        this.#players.forEach(player => this._addPlayerSignals(player));
+
+        this._updateActivePlayer();
+    }
+
+    private _addPlayer(player: AstalMpris.Player) {
+        if (this.#players.includes(player)) return;
+
+        this.#players.push(player);
+        this._addPlayerSignals(player);
+        this._updateActivePlayer();
+    }
+
+    private _addPlayerSignals(player: AstalMpris.Player) {
+        const handler = () => this._onPlayerStateChanged(player);
+
+        const ids = [
+            player.connect('notify::playback-status', handler),
+            //player.connect('notify::cover-art', handler),
+            player.connect('notify::identity', handler),
+            //player.connect('notify::track-id', handler),
+            // player.connect('notify::title', handler),
+            // player.connect('notify::artist', handler),
+            player.connect('notify::metadata', handler),
+            player.connect('notify::position', handler)
+        ];
+
+        this.#playerConnections.set(player, ids);
+    }
+
+    private _removePlayer(player: AstalMpris.Player) {
+        this.#players = this.#players.filter(p => p !== player);
+
+        if (this.#playerConnections.has(player)) {
+            const ids = this.#playerConnections.get(player)!;
+            ids.forEach(id => player.disconnect(id));
+            this.#playerConnections.delete(player);
+        }
+
+        this._updateActivePlayer();
+    }
+
+    private _onPlayerStateChanged(player: AstalMpris.Player) {
+        const wasActivePlayer = this.#activePlayer;
+        this._updateActivePlayer();
+
+        if (this.#activePlayer === wasActivePlayer && this.#activePlayer === player) {
+            this.notify('active-player');
+        }
+    }
+
+    private _updateActivePlayer() {
+        const playingPlayer = this.#players.find(p => p.playbackStatus === AstalMpris.PlaybackStatus.PLAYING);
+        let newActivePlayer;
+
+        if (playingPlayer) {
+            newActivePlayer = playingPlayer;
+        } else if (this.#activePlayer && this.#players.includes(this.#activePlayer)) {
+            newActivePlayer = this.#activePlayer;
+        } else {
+            newActivePlayer = null;
+        }
+
+        if (this.#activePlayer !== newActivePlayer) {
+            this.#activePlayer = newActivePlayer;
+            this.notify('active-player');
+        }
+    }
+
+    public static getDefault(): AstalPlayers {
+        if (!AstalPlayers.inst) {
+            AstalPlayers.inst = new AstalPlayers();
+        }
+        return AstalPlayers.inst;
+    }
+
+    public connect(signal: string, callback: (...args: any[]) => void): number {
+        return super.connect(signal, callback);
+    }
+
+    public disconnect(id: number): void {
+        super.disconnect(id);
+    }
+}

ags/style.scss

@@ -222,7 +222,7 @@ menu {
   }
 }
 
-.button-row {
+.button-row, .top-row {
   & > button {
     background: colors.$bg-secondary;
     margin: 0 1px;
@@ -232,7 +232,7 @@ menu {
     &:hover {
       background: colors.$bg-tertiary;
     }
-
+    
     &:first-child {
       border-top-left-radius: 10px;
       border-bottom-left-radius: 10px;
@@ -247,6 +247,24 @@ menu {
   }
 }
 
+//Need some workouts///////////////
+switch {
+  padding: 4px;
+  border-radius: 16px;
+  background: functions.toRGB(color.adjust($color: wal.$color1, $lightness: -20%));
+  &:checked {
+    background: colors.$bg-tertiary;
+  }
+}
+
+switch slider {
+  border-radius: 12px;
+  color: colors.$bg-primary;
+  background: wal.$foreground;
+  transition: all 0.2s ease-in-out;
+}
+/////////////////////////////////////
+
 selection {
   background: colors.$bg-tertiary;
 }

ags/style/_control-center.scss

@@ -35,7 +35,7 @@
       font-weight: 600;
     }
 
-    & > box:not(.button-row) icon {
+    & > box:not(.button-row):not(.top-row) icon {
       font-size: 12px;
       color: colors.$fg-disabled;
       margin-right: 3px;
@@ -47,7 +47,7 @@
       color: colors.$fg-disabled;
     }
 
-    & .button-row {
+    & .button-row, & .top-row {
       & button {
         padding: 7px;
         margin: {
@@ -169,6 +169,7 @@
 }
 
 box.history {
+  margin-top: 10px;
   background: colors.$bg-translucent;
   box-shadow: 0 0 6px 1px colors.$bg-translucent;
   border-radius: 24px;
@@ -186,8 +187,8 @@ box.history {
     }
   }
 
-  & > .button-row {
-    margin-top: 12px;
+  & > .button-row, & > .top-row {
+    margin-bottom: 12px;
 
     & button {
       padding: 6px;

ags/style/_osd.scss

@@ -7,7 +7,12 @@
   background: funs.toRGB(color.change($color: wal.$background, $alpha: 65%));
   padding: 16px;
   border-radius: 24px;
-  min-width: 180px;
+  min-width: 60px;
+
+  .action {
+    font-size: 14px;
+    font-weight: 600;
+  }
 
   .icon {
     margin-right: 10px;

ags/widget/PopupWindow.ts

@@ -1,6 +1,10 @@
-import { Binding } from "astal";
+import { Binding, bind } from "astal";
 import { Astal, Gdk, Gtk, Widget } from "astal/gtk3";
 import { BackgroundWindow } from "./BackgroundWindow";
+import AstalHyprland from "gi://AstalHyprland";
+import { Windows } from "../windows";
+
+const hyprland = AstalHyprland.get_default();
 
 type PopupWindowSpecificProps = {
     onDestroy?: (self: Widget.Window) => void;
@@ -51,12 +55,23 @@ export function PopupWindow(props: PopupWindowProps): Widget.Window {
         winProps[key as keyof typeof winProps] = props[key as keyof typeof props];
     }
 
+    let isFullscreen: boolean;
+
     return new Widget.Window({
         ...winProps,
         namespace: props?.namespace ?? "popup-window",
         className: `popup-window ${(props.namespace instanceof Binding ?
             props.namespace.get() : props.namespace) || ""}`,
-        keymode: Astal.Keymode.EXCLUSIVE,
+        keymode: bind(hyprland, 'focusedWorkspace').as(fw => {
+
+            if (Windows.isVisible('logout-menu')) return Astal.Keymode.EXCLUSIVE;
+
+            if (fw.get_last_client() === null) return Astal.Keymode.ON_DEMAND;
+
+            return fw.get_last_client().get_fullscreen() === AstalHyprland.Fullscreen.FULLSCREEN && fw.get_last_client().get_workspace() === fw
+                ? Astal.Keymode.EXCLUSIVE
+                : Astal.Keymode.ON_DEMAND
+        }),
         anchor: TOP | LEFT | RIGHT | BOTTOM,
         exclusivity: props.exclusivity ?? Astal.Exclusivity.NORMAL,
         halign: undefined,