chore: restructure the project, make it not use the astal application stuff

now it's more organized and I have more control over the shell behaviour
This commit is contained in:
retrozinndev
2025-08-06 15:25:21 -03:00
parent 5a6d5b47c6
commit d549ad9596
191 changed files with 529 additions and 1000 deletions
+12
View File
@@ -0,0 +1,12 @@
import { Gtk } from "ags/gtk4";
import { Windows } from "../../windows";
import { createBinding } from "ags";
import { tr } from "../../i18n/intl";
export const Apps = () =>
<Gtk.Button class={createBinding(Windows.getDefault(), "openWindows").as((openWindows) =>
`apps ${Object.hasOwn(openWindows, "apps-window") ? "open" : ""}`
)} iconName={"applications-other-symbolic"} halign={Gtk.Align.CENTER}
hexpand tooltipText={tr("apps")} onClicked={() =>
Windows.getDefault().open("apps-window")}
/>;
+21
View File
@@ -0,0 +1,21 @@
import { Gtk } from "ags/gtk4";
import { Windows } from "../../windows";
import { createBinding } from "ags";
import { time } from "../../scripts/utils";
import { generalConfig } from "../../app";
export const Clock = () =>
<Gtk.Button class={createBinding(Windows.getDefault(), "openWindows").as((wins) =>
`clock ${wins.includes("center-window") ? "open" : ""}`)}
$={(self) => {
const conns: Array<number> = [
self.connect("clicked", (_) => Windows.getDefault().toggle("center-window")),
self.connect("destroy", (_) => conns.forEach(id => self.disconnect(id)))
];
}}
label={time((dt) => dt.format(
generalConfig.getProperty("clock.date_format", "string"))
?? "An error occurred"
)}
/>;
+47
View File
@@ -0,0 +1,47 @@
import { Gtk } from "ags/gtk4";
import { createBinding, With } from "ags";
import { variableToBoolean } from "../../scripts/utils";
import { getAppIcon, getSymbolicIcon } from "../../scripts/apps";
import Pango from "gi://Pango?version=1.0";
import AstalHyprland from "gi://AstalHyprland";
const hyprland = AstalHyprland.get_default();
// Fix empty focused-client on opening a window on an empty workspace
hyprland.connect("client-added", () => hyprland.notify("focused-client"));
export const FocusedClient = () => {
const focusedClient = createBinding(hyprland, "focusedClient");
return <Gtk.Box class={"focused-client"}
visible={variableToBoolean(createBinding(hyprland, "focusedClient"))}>
<With value={focusedClient}>
{(focusedClient) => focusedClient?.class && <Gtk.Box>
<Gtk.Image iconName={createBinding(focusedClient, "class").as((clss) =>
getSymbolicIcon(clss) ?? getAppIcon(clss) ??
getAppIcon(focusedClient.initialClass) ??
"application-x-executable-symbolic"
)} vexpand
/>
<Gtk.Box valign={Gtk.Align.CENTER} class={"text-content"}
orientation={Gtk.Orientation.VERTICAL}>
<Gtk.Label class={"class"} xalign={0} maxWidthChars={55}
ellipsize={Pango.EllipsizeMode.END}
label={createBinding(focusedClient, "class")}
tooltipText={createBinding(focusedClient, "class")}
/>
<Gtk.Label class={"title"} xalign={0} maxWidthChars={50}
ellipsize={Pango.EllipsizeMode.END}
label={createBinding(focusedClient, "title")}
tooltipText={createBinding(focusedClient, "title")}
/>
</Gtk.Box>
</Gtk.Box>}
</With>
</Gtk.Box>;
}
+168
View File
@@ -0,0 +1,168 @@
import { Accessor, createBinding, createConnection, createState, onCleanup, With } from "ags";
import { Gtk } from "ags/gtk4";
import { Separator } from "../Separator";
import { Windows } from "../../windows";
import { Clipboard } from "../../scripts/clipboard";
import GObject from "ags/gobject";
import AstalMpris from "gi://AstalMpris";
import Pango from "gi://Pango?version=1.0";
import { decoder, getPlayerIconFromBusName, variableToBoolean } from "../../scripts/utils";
export const dummyPlayer = AstalMpris.Player.new("colorshellDummy");
export let [player, setPlayer] = createState(dummyPlayer);
export const Media = () => {
const connections: Map<GObject.Object, Array<number>|number> = new Map();
if(AstalMpris.get_default().players[0])
setPlayer(AstalMpris.get_default().players[0]);
onCleanup(() => connections.forEach((id, obj) =>
Array.isArray(id) ?
id.forEach(id => obj.disconnect(id))
: obj.disconnect(id)
));
connections.set(AstalMpris.get_default(), [
AstalMpris.get_default().connect("player-added", (_, player) =>
player.available && setPlayer(player)),
AstalMpris.get_default().connect("player-closed", (_, closedPlayer) => {
const players = AstalMpris.get_default().players.filter(pl => pl?.available &&
pl.busName !== closedPlayer.busName);
if(players.length > 0) {
setPlayer(players[0]);
return;
}
setPlayer(dummyPlayer);
})
]);
return <Gtk.Box class={"media"} visible={player((pl) => pl.available)}
$={(self) => {
const gestureClick = Gtk.GestureClick.new(),
controllerMotion = Gtk.EventControllerMotion.new(),
controllerScroll = Gtk.EventControllerScroll.new(
Gtk.EventControllerScrollFlags.VERTICAL);
self.add_controller(gestureClick);
self.add_controller(controllerMotion);
self.add_controller(controllerScroll);
connections.set(gestureClick, gestureClick.connect("released", () =>
Windows.getDefault().toggle("center-window")));
connections.set(controllerScroll,
controllerScroll.connect("scroll", (_, _dx, dy) => {
if(AstalMpris.get_default().players.length === 1 &&
player.get()?.busName === AstalMpris.get_default().players[0].busName)
return true;
const players = AstalMpris.get_default().players;
for(let i = 0; i < players.length; i++) {
const pl = players[i];
if(pl.busName !== player.get().busName)
continue;
if(dy > 0 && players[i-1]) {
setPlayer(players[i-1]);
break;
}
if(dy < 0 && players[i+1]) {
setPlayer(players[i+1]);
break;
}
}
return true;
})
);
connections.set(controllerMotion, [
controllerMotion.connect("enter", () => {
const revealer = self.get_last_child() as Gtk.Revealer;
revealer.set_reveal_child(true);
}),
controllerMotion.connect("leave", () => {
const revealer = self.get_last_child() as Gtk.Revealer;
revealer.set_reveal_child(false);
})
]);
connections.set(self, self.connect("destroy", () =>
connections.forEach((ids, obj) => Array.isArray(ids) ?
ids.forEach(id => obj.disconnect(id))
: obj.disconnect(ids))
));
}}>
<Gtk.Box spacing={4} visible={player(pl => pl.available)}>
<With value={player(pl => pl.available)}>
{(available: boolean) => available && <Gtk.Box>
<Gtk.Image class={"player-icon"} iconName={
createBinding(player.get(), "busName").as(getPlayerIconFromBusName)}
/>
<Gtk.Label class={"title"} label={createBinding(player.get(), "title").as(title =>
title ?? "No Title")} maxWidthChars={20} ellipsize={Pango.EllipsizeMode.END}
/>
<Separator orientation={Gtk.Orientation.HORIZONTAL} size={1} margin={5}
alpha={.3} spacing={6} />
<Gtk.Label class={"artist"} label={createBinding(player.get(), "artist").as(artist =>
artist ?? "No Artist")} maxWidthChars={18} ellipsize={Pango.EllipsizeMode.END}
/>
</Gtk.Box>}
</With>
</Gtk.Box>
<Gtk.Revealer transitionType={Gtk.RevealerTransitionType.SLIDE_RIGHT} transitionDuration={260}
revealChild={false}>
<With value={player(pl => pl.available)}>
{(available: boolean) => available && <Gtk.Box class={"media-controls button-row"}>
<Gtk.Button class={"link"} iconName={"edit-paste-symbolic"}
visible={variableToBoolean(getMediaUrl(player.get()))}
tooltipText={"Copy link to Clipboard"} onClicked={() => {
const url = getMediaUrl(player.get()).get();
url && Clipboard.getDefault().copyAsync(url);
}}
/>
<Gtk.Button class={"previous"} iconName={"media-skip-backward-symbolic"}
tooltipText={"Previous"} onClicked={() =>
player.get().canGoPrevious && player.get().previous()}
/>
<Gtk.Button class={"play-pause"} iconName={createBinding(player.get(), "playbackStatus").as(status =>
status === AstalMpris.PlaybackStatus.PAUSED ?
"media-playback-start-symbolic"
: "media-playback-pause-symbolic")}
tooltipText={
createBinding(player.get(), "playbackStatus").as(status =>
status === AstalMpris.PlaybackStatus.PAUSED ? "Play" : "Pause")
} onClicked={() => player.get().play_pause()}
/>
<Gtk.Button class={"next"} iconName={"media-skip-forward-symbolic"}
tooltipText={"Next"} onClicked={() => player.get().canGoNext &&
player.get().next()}
/>
</Gtk.Box>}
</With>
</Gtk.Revealer>
</Gtk.Box>
}
export function getMediaUrl(player: AstalMpris.Player): Accessor<string|undefined> {
return createConnection(player.get_meta("xesam:url"),
[player, "notify::metadata", () => player.get_meta("xesam:url")]
).as(url => {
const byteString = url?.get_data_as_bytes();
return byteString ?
decoder.decode(byteString.toArray())
: undefined;
})
}
+141
View File
@@ -0,0 +1,141 @@
import { Gtk } from "ags/gtk4";
import { Wireplumber } from "../../scripts/volume";
import { Notifications } from "../../scripts/notifications";
import { Windows } from "../../windows";
import { Recording } from "../../scripts/recording";
import { Accessor, createBinding, createComputed, With } from "ags";
import { time, variableToBoolean } from "../../scripts/utils";
import GObject from "ags/gobject";
import AstalBluetooth from "gi://AstalBluetooth";
import AstalNetwork from "gi://AstalNetwork";
import AstalWp from "gi://AstalWp";
export const Status = () =>
<Gtk.Button class={createBinding(Windows.getDefault(), "openWindows").as((openWins) =>
openWins.includes("control-center") ? "open status" : "status")}
onClicked={() => Windows.getDefault().toggle("control-center")}>
<Gtk.Box>
<Gtk.Box class={"volume-indicators"} spacing={5}>
<VolumeStatus class="sink" endpoint={Wireplumber.getDefault().getDefaultSink()}
icon={createBinding(Wireplumber.getDefault().getDefaultSink(), "volumeIcon").as(icon =>
!Wireplumber.getDefault().isMutedSink() &&
Wireplumber.getDefault().getSinkVolume() > 0 ? icon
: "audio-volume-muted-symbolic")
} />
<VolumeStatus class="source" endpoint={Wireplumber.getDefault().getDefaultSource()}
icon={createBinding(Wireplumber.getDefault().getDefaultSource(), "volumeIcon").as(icon =>
!Wireplumber.getDefault().isMutedSource() &&
Wireplumber.getDefault().getSourceVolume() > 0 ? icon
: "microphone-sensitivity-muted-symbolic")
} />
</Gtk.Box>
<Gtk.Revealer revealChild={createBinding(Recording.getDefault(), "recording")}
transitionDuration={500} transitionType={Gtk.RevealerTransitionType.SLIDE_LEFT}>
<Gtk.Box>
<Gtk.Image class={"recording state"} iconName={"media-record-symbolic"}
css={"margin-right: 6px;"} />
<Gtk.Label class={"rec-time"} label={createComputed([
createBinding(Recording.getDefault(), "recording"),
time
], (recording, dateTime) => {
if(!recording || !Recording.getDefault().startedAt)
return "...";
const startedAtSeconds = dateTime.to_unix() - Recording.getDefault().startedAt!;
if(startedAtSeconds <= 0) return "00:00";
const minutes = Math.floor(startedAtSeconds / 60);
const seconds = Math.floor(startedAtSeconds % 60);
return `${ minutes < 10 ? `0${minutes}` : minutes }:${ seconds < 10 ? `0${seconds}` : seconds }`;
})}
/>
</Gtk.Box>
</Gtk.Revealer>
<StatusIcons />
</Gtk.Box>
</Gtk.Button> as Gtk.Button;
function VolumeStatus(props: { class?: string, endpoint: AstalWp.Endpoint, icon?: (string|Accessor<string>) }) {
return <Gtk.Box spacing={2} class={props.class} $={(self) => {
const conns: Map<GObject.Object, number> = new Map();
const controllerScroll = Gtk.EventControllerScroll.new(Gtk.EventControllerScrollFlags.VERTICAL
| Gtk.EventControllerScrollFlags.KINETIC);
conns.set(controllerScroll, controllerScroll.connect("scroll", (_, _dx, dy) => {
console.log`Scrolled! dx: ${_dx}; dy: ${dy}`;
dy > 0 ?
Wireplumber.getDefault().decreaseEndpointVolume(props.endpoint, 5)
: Wireplumber.getDefault().increaseEndpointVolume(props.endpoint, 5);
return true;
}));
conns.set(self, self.connect("destroy", () => conns.forEach((id, obj) =>
obj.disconnect(id))));
}}>
{props.icon && <Gtk.Image iconName={props.icon} />}
<Gtk.Label class={"volume"} label={createBinding(props.endpoint, "volume").as(vol =>
`${Math.floor(vol * 100)}%`)} />
</Gtk.Box> as Gtk.Box;
}
function StatusIcons() {
return <Gtk.Box class={"status-icons"} spacing={8}>
<Gtk.Image iconName={createComputed([
createBinding(AstalBluetooth.get_default(), "isPowered"),
createBinding(AstalBluetooth.get_default(), "isConnected")
], (powered, connected) => {
return powered ? (
connected ?
"bluetooth-active-symbolic"
: "bluetooth-symbolic"
) : "bluetooth-disabled-symbolic"
})} class={"bluetooth state"} visible={
createBinding(AstalBluetooth.get_default(), "adapter").as(Boolean)
}
/>
<Gtk.Box visible={createBinding(AstalNetwork.get_default(), "primary").as(primary =>
primary !== AstalNetwork.Primary.UNKNOWN)}>
<With value={createBinding(AstalNetwork.get_default(), "primary")}>
{(primary: AstalNetwork.Primary) => {
let device: AstalNetwork.Wifi|AstalNetwork.Wired;
switch(primary) {
case AstalNetwork.Primary.WIRED:
device = AstalNetwork.get_default().wired;
break;
case AstalNetwork.Primary.WIFI:
device = AstalNetwork.get_default().wifi;
break;
default:
return <Gtk.Image iconName={"network-no-route-symbolic"} />;
}
return <Gtk.Image iconName={createBinding(device, "iconName")} />;
}}
</With>
</Gtk.Box>
<Gtk.Box>
<Gtk.Image class={"bell state"} iconName={createBinding(
Notifications.getDefault().getNotifd(), "dontDisturb").as(dnd => dnd ?
"minus-circle-filled-symbolic"
: "preferences-system-notifications-symbolic")
}
/>
<Gtk.Image iconName={"circle-filled-symbolic"} class={"notification-count"}
visible={variableToBoolean(createBinding(Notifications.getDefault(), "history"))}
/>
</Gtk.Box>
</Gtk.Box>
}
+58
View File
@@ -0,0 +1,58 @@
import { createBinding, createComputed, For, With } from "ags";
import { Gdk, Gtk } from "ags/gtk4";
import { variableToBoolean } from "../../scripts/utils";
import GObject from "gi://GObject?version=2.0";
import AstalTray from "gi://AstalTray"
import Gio from "gi://Gio?version=2.0";
const astalTray = AstalTray.get_default();
export const Tray = () => {
const items = createBinding(astalTray, "items").as(items => items.filter(item => item?.gicon));
return <Gtk.Box class={"tray"} visible={variableToBoolean(items)} spacing={10}>
<For each={items}>
{(item: AstalTray.TrayItem) => <Gtk.Box class={"item"}>
<With value={createComputed([
createBinding(item, "actionGroup"),
createBinding(item, "menuModel")
])}>
{([actionGroup, menuModel]: [Gio.ActionGroup, Gio.MenuModel]) => {
const popover = Gtk.PopoverMenu.new_from_model(menuModel);
popover.insert_action_group("dbusmenu", actionGroup);
popover.hasArrow = false;
return <Gtk.Box class={"item"} tooltipMarkup={
createBinding(item, "tooltipMarkup")
} tooltipText={
createBinding(item, "tooltipText")
} $={(self) => {
const conns: Map<GObject.Object, number> = new Map();
const gestureClick = Gtk.GestureClick.new();
gestureClick.set_button(0);
self.add_controller(gestureClick);
conns.set(gestureClick, gestureClick.connect("released", (gesture, _, x, y) => {
if(gesture.get_current_button() === Gdk.BUTTON_PRIMARY) {
item.activate(x, y);
return;
}
if(gesture.get_current_button() === Gdk.BUTTON_SECONDARY) {
item.about_to_show();
popover.popup();
}
}))
}}>
<Gtk.Image gicon={createBinding(item, "gicon")} pixelSize={16} />
{popover}
</Gtk.Box>;
}}
</With>
</Gtk.Box>}
</For>
</Gtk.Box>
}
+155
View File
@@ -0,0 +1,155 @@
import { Gtk } from "ags/gtk4";
import AstalHyprland from "gi://AstalHyprland";
import { getAppIcon, getSymbolicIcon } from "../../scripts/apps";
import { Separator } from "../Separator";
import { generalConfig } from "../../app";
import { createBinding, createComputed, createState, For, With } from "ags";
import { variableToBoolean } from "../../scripts/utils";
import GObject from "ags/gobject";
const [showNumbers, setShowNumbers] = createState(false);
export const showWorkspaceNumber = (show: boolean) =>
setShowNumbers(show);
export const Workspaces = () => {
const workspaces = createBinding(AstalHyprland.get_default(), "workspaces"),
defaultWorkspaces = workspaces.as(wss =>
wss.filter(ws => ws.id > 0).sort((a, b) => a.id - b.id)),
specialWorkspaces = workspaces.as(wss =>
wss.filter(ws => ws.id < 0).sort((a, b) => a.id - b.id));
return <Gtk.Box class={"workspaces-row"}>
<Gtk.Box class={"special-workspaces"} spacing={4}>
<For each={specialWorkspaces}>
{(ws: AstalHyprland.Workspace) =>
<Gtk.Button class={"workspace"}
tooltipText={createBinding(ws, "name").as(name => {
name = name.replace(/^special\:/, "");
return name.charAt(0).toUpperCase().concat(name.substring(1, name.length));
})} onClicked={() => AstalHyprland.get_default().dispatch(
"togglespecialworkspace", ws.name.replace(/^special[:]/, "")
)}>
<With value={createBinding(ws, "lastClient")}>
{(lastClient: AstalHyprland.Client|null) => lastClient &&
<Gtk.Image class="last-client" iconName={
createBinding(lastClient, "initialClass").as(initialClass =>
getSymbolicIcon(initialClass) ?? getAppIcon(initialClass) ??
"application-x-executable-symbolic")}
/>
}
</With>
</Gtk.Button>
}
</For>
</Gtk.Box>
<Gtk.Revealer transitionType={Gtk.RevealerTransitionType.SLIDE_RIGHT}
transitionDuration={220} revealChild={variableToBoolean(specialWorkspaces)}>
<Separator alpha={.2} orientation={Gtk.Orientation.HORIZONTAL}
margin={12} spacing={8} visible={variableToBoolean(specialWorkspaces)}
/>
</Gtk.Revealer>
<Gtk.Box class={"default-workspaces"} spacing={4} $={(self) => {
const conns: Map<GObject.Object, Array<number>|number> = new Map();
const controllerScroll = Gtk.EventControllerScroll.new(
Gtk.EventControllerScrollFlags.VERTICAL
), controllerMotion = Gtk.EventControllerMotion.new();
self.add_controller(controllerScroll);
self.add_controller(controllerMotion);
conns.set(controllerScroll, controllerScroll.connect("scroll", (_, _dx, dy) => {
dy > 0 ?
AstalHyprland.get_default().dispatch("workspace", "e-1")
: AstalHyprland.get_default().dispatch("workspace", "e+1");
return true;
}));
conns.set(controllerMotion, [
controllerMotion.connect("enter", () => setShowNumbers(true)),
controllerMotion.connect("leave", () => setShowNumbers(false))
]);
conns.set(self, self.connect("destroy", () => conns.forEach((ids, obj) =>
Array.isArray(ids) ?
ids.forEach(id => obj.disconnect(id))
: obj.disconnect(ids)
)));
}}>
<For each={defaultWorkspaces}>
{(ws: AstalHyprland.Workspace, i) => {
const showId = createComputed([
generalConfig.bindProperty("workspaces.always_show_id", "boolean").as(Boolean),
generalConfig.bindProperty("workspaces.enable_helper", "boolean").as(Boolean),
showNumbers,
i
], (alwaysShowIds, enableHelper, showIds, i) => {
if(enableHelper && !alwaysShowIds) {
const previousWorkspace = defaultWorkspaces.get()[i-1];
const nextWorkspace = defaultWorkspaces.get()[i+1];
if((defaultWorkspaces.get().filter((_, ii) => ii < i).length > 0 &&
previousWorkspace?.id < (ws.id-1)) ||
(defaultWorkspaces.get().filter((_, ii) => ii > i).length > 0 &&
nextWorkspace?.id > (ws.id+1))
|| (i === 0 && ws.id > 1)) {
return true;
}
}
return alwaysShowIds || showIds;
});
return <Gtk.Button class={createComputed([
createBinding(AstalHyprland.get_default(), "focusedWorkspace"),
showId
], (focusedWs, showWsNumbers) =>
`workspace ${focusedWs.id === ws.id ? "focus" : ""} ${
showWsNumbers ? "show" : ""}`
)} tooltipText={createComputed([
createBinding(ws, "lastClient"),
createBinding(AstalHyprland.get_default(), "focusedWorkspace")
], (lastClient, focusWs) => focusWs.id === ws.id ? "" :
`workspace ${ws.id}${ lastClient ? ` - ${
!lastClient.title.toLowerCase().includes(lastClient.class) ?
`${lastClient.get_class()}: `
: ""
} ${lastClient.title}` : "" }`
)} onClicked={() => ws.focus()}>
<With value={createBinding(ws, "lastClient")}>
{(lastClient: AstalHyprland.Client) =>
<Gtk.Box class={"last-client"} hexpand>
<Gtk.Revealer transitionDuration={280} revealChild={showId}
transitionType={createBinding(AstalHyprland.get_default(), "focusedWorkspace")
.as(fws => fws.id !== ws.id ?
Gtk.RevealerTransitionType.SLIDE_LEFT
: Gtk.RevealerTransitionType.SLIDE_RIGHT)}>
<Gtk.Label label={createBinding(ws, "id").as(String)}
class={"id"} hexpand />
</Gtk.Revealer>
{lastClient && <Gtk.Image class={"last-client-icon"} iconName={
createBinding(lastClient, "initialClass").as(initialClass =>
getSymbolicIcon(initialClass) ?? getAppIcon(initialClass) ??
"application-x-executable-symbolic")}
hexpand vexpand visible={createBinding(AstalHyprland.get_default(), "focusedWorkspace")
.as(fws => fws.id !== ws.id)}
/>}
</Gtk.Box>
}
</With>
</Gtk.Button>
}}
</For>
</Gtk.Box>
</Gtk.Box>
}