[Astal] Finish modes, move tray into quickactions menu

This commit is contained in:
2025-10-17 10:43:50 +02:00
parent 00d4f101fc
commit 539ec34b4c
6 changed files with 175 additions and 108 deletions

View File

@@ -1,48 +1,56 @@
import { exec } from "astal";
import { Gtk } from "astal/gtk4";
import {
exec
} from 'astal';
import {
Gtk
} from 'astal/gtk4';
const PowerMenu = (): Gtk.Popover => {
const popover = new Gtk.Popover({ cssClasses: ["PowerMenu"] });
const popover = new Gtk.Popover( {
'cssClasses': [ 'PowerMenu' ]
} );
const powerMenuBox = () => {
return (
<box>
<button
cssClasses={["power-button"]}
cssClasses={[ 'power-button' ]}
child={
<image iconName={"system-shutdown-symbolic"}></image>
<image iconName={'system-shutdown-symbolic'}></image>
}
onClicked={() => exec("/bin/sh -c 'shutdown now'")}
onClicked={() => exec( '/bin/sh -c \'shutdown now\'' )}
></button>
<button
cssClasses={["power-button"]}
child={<image iconName={"system-reboot-symbolic"}></image>}
onClicked={() => exec("/bin/sh -c 'reboot'")}
cssClasses={[ 'power-button' ]}
child={<image iconName={'system-reboot-symbolic'}></image>}
onClicked={() => exec( '/bin/sh -c \'reboot\'' )}
></button>
<button
cssClasses={["power-button"]}
child={<image iconName={"system-suspend-symbolic"}></image>}
onClicked={() => exec("/bin/sh -c 'systemctl suspend'")}
cssClasses={[ 'power-button' ]}
child={<image iconName={'system-suspend-symbolic'}></image>}
onClicked={() => exec( '/bin/sh -c \'systemctl suspend\'' )}
></button>
</box>
);
};
popover.set_child(powerMenuBox());
popover.set_child( powerMenuBox() );
return popover;
};
const Power = () => {
const pm = PowerMenu();
return (
<button
widthRequest={0}
hexpand={false}
vexpand={false}
cssClasses={["power-menu-button"]}
cssClasses={[ 'power-menu-button' ]}
child={
<box>
<image iconName={"system-shutdown-symbolic"}></image>
<image iconName={'system-shutdown-symbolic'}></image>
{pm}
</box>
}
@@ -58,24 +66,24 @@ const UserMenu = (): Gtk.Popover => {
return (
<box>
<button
cssClasses={["power-button"]}
cssClasses={[ 'power-button' ]}
child={
<image iconName={"system-lock-screen-symbolic"}></image>
<image iconName={'system-lock-screen-symbolic'}></image>
}
onClicked={() => exec("/bin/sh -c 'hyprlock'")}
onClicked={() => exec( '/bin/sh -c \'hyprlock\'' )}
></button>
<button
cssClasses={["power-button"]}
child={<image iconName={"system-log-out-symbolic"}></image>}
onClicked={() =>
exec("/bin/sh -c 'hyprctl dispatch exit 0'")
cssClasses={[ 'power-button' ]}
child={<image iconName={'system-log-out-symbolic'}></image>}
onClicked={() => exec( '/bin/sh -c \'hyprctl dispatch exit 0\'' )
}
></button>
</box>
);
};
popover.set_child(powerMenuBox());
popover.set_child( powerMenuBox() );
return popover;
};

View File

@@ -0,0 +1,88 @@
import AstalTray from 'gi://AstalTray';
import {
GObject
} from 'astal';
import {
Gtk
} from 'astal/gtk4';
const SYNC = GObject.BindingFlags.SYNC_CREATE;
const SysTray = () => {
const trayBox = new Gtk.Box( {
'cssClasses': [ '' ]
} );
const tray = AstalTray.get_default();
const trayItems = new Map<string, Gtk.MenuButton>();
const trayAddedHandler = tray.connect( 'item-added', ( _, id ) => {
const item = tray.get_item( id );
const popover = Gtk.PopoverMenu.new_from_model( item.menu_model );
const icon = new Gtk.Image();
const button = new Gtk.MenuButton( {
popover,
'child': icon,
'cssClasses': [ 'tray-item' ],
} );
item.bind_property(
'gicon', icon, 'gicon', SYNC
);
popover.insert_action_group( 'dbusmenu', item.action_group );
item.connect( 'notify::action-group', () => {
popover.insert_action_group( 'dbusmenu', item.action_group );
} );
trayItems.set( id, button );
trayBox.append( button );
} );
const trayRemovedHandler = tray.connect( 'item-removed', ( _, id ) => {
const button = trayItems.get( id );
if ( button ) {
trayBox.remove( button );
button.run_dispose();
trayItems.delete( id );
}
} );
trayBox.connect( 'destroy', () => {
tray.disconnect( trayAddedHandler );
tray.disconnect( trayRemovedHandler );
} );
return trayBox;
};
const TrayPopover = () => {
const popover = new Gtk.Popover( {
'cssClasses': [ 'TrayPopover' ]
} );
popover.set_child( SysTray() );
return popover;
};
const SystemTray = () => {
const systray = TrayPopover();
return (
<button
widthRequest={0}
hexpand={false}
vexpand={false}
cssClasses={[ 'power-menu-button' ]}
child={
<box>
<image iconName={'systemtray'}></image>
{systray}
</box>
}
onClicked={() => systray.popup()}
/>
);
};
export default {
SystemTray
};