bar: show windows on each workspace

This commit is contained in:
2 * r + 2 * t 2025-04-07 15:49:40 +10:00
parent 5d5bea5758
commit d49a811d16
4 changed files with 71 additions and 30 deletions

View file

@ -70,12 +70,21 @@
&.labels-shown > button {
color: color.change(scheme.$overlay1, $alpha: 1);
.icon {
font-size: lib.s(13);
color: color.change(scheme.$subtext0, $alpha: 1);
}
&.occupied {
color: color.mix(scheme.$text, scheme.$mauve, 50%);
}
&.focused {
color: color.change(scheme.$base, $alpha: 1);
.icon {
color: color.change(scheme.$surface0, $alpha: 1);
}
}
}
}
@ -163,6 +172,14 @@
padding-left: lib.s(20);
padding-right: lib.s(20);
}
.icon {
margin-left: lib.s(5);
&:nth-child(2) {
margin-left: lib.s(12);
}
}
}
}
@ -212,6 +229,14 @@
padding-top: lib.s(15);
padding-bottom: lib.s(15);
}
.icon {
margin-top: lib.s(2);
&:nth-child(2) {
margin-top: lib.s(3);
}
}
}
}

View file

@ -49,6 +49,7 @@ export default {
showLabels: false,
labels: ["󰮯", "󰮯", "󰮯", "󰮯", "󰮯"],
xalign: -1,
showWindows: false,
},
dateTime: {
format: "%d/%m/%y %R",

View file

@ -37,6 +37,7 @@ export default {
"bar.modules.workspaces.showLabels": BOOL,
"bar.modules.workspaces.labels": ARR(STR),
"bar.modules.workspaces.xalign": NUM,
"bar.modules.workspaces.showWindows": BOOL,
"bar.modules.dateTime.format": STR,
"bar.modules.dateTime.detailedFormat": STR,
// Launcher

View file

@ -204,47 +204,61 @@ const MediaPlaying = ({ monitor, ...props }: ModuleProps) => {
};
const Workspace = ({ idx }: { idx: number }) => {
let wsId = hyprland.focusedWorkspace
? Math.floor((hyprland.focusedWorkspace.id - 1) / config.modules.workspaces.shown.get()) *
config.modules.workspaces.shown.get() +
idx
: idx;
const wsId = Variable.derive([bind(hyprland, "focusedWorkspace"), config.modules.workspaces.shown], (f, s) =>
f ? Math.floor((f.id - 1) / s) * s + idx : idx
);
const label = (
<label
css={bind(config.modules.workspaces.xalign).as(a => `margin-left: ${a}px; margin-right: ${-a}px;`)}
label={bind(config.modules.workspaces.labels).as(l => l[idx - 1] ?? String(idx))}
/>
);
return (
<button
halign={Gtk.Align.CENTER}
valign={Gtk.Align.CENTER}
onClicked={() => hyprland.dispatch("workspace", String(wsId))}
onClicked={() => hyprland.dispatch("workspace", String(wsId.get()))}
setup={self => {
const update = () =>
self.toggleClassName(
"occupied",
hyprland.clients.some(c => c.workspace?.id === wsId)
);
const updateWs = () => {
if (!hyprland.focusedWorkspace) return;
wsId =
Math.floor((hyprland.focusedWorkspace.id - 1) / config.modules.workspaces.shown.get()) *
config.modules.workspaces.shown.get() +
idx;
self.toggleClassName("focused", hyprland.focusedWorkspace.id === wsId);
update();
const updateOccupied = () => {
const occupied = hyprland.clients.some(c => c.workspace?.id === wsId.get());
self.toggleClassName("occupied", occupied);
};
const updateFocused = () => {
self.toggleClassName("focused", hyprland.focusedWorkspace?.id === wsId.get());
updateOccupied();
};
self.hook(config.modules.workspaces.shown, updateWs);
self.hook(hyprland, "notify::focused-workspace", updateWs);
self.hook(hyprland, "client-added", update);
self.hook(hyprland, "client-moved", update);
self.hook(hyprland, "client-removed", update);
self.toggleClassName("focused", hyprland.focusedWorkspace?.id === wsId);
update();
self.hook(hyprland, "client-added", updateOccupied);
self.hook(hyprland, "client-moved", updateOccupied);
self.hook(hyprland, "client-removed", updateOccupied);
self.hook(hyprland, "notify::focused-workspace", updateFocused);
updateFocused();
}}
onDestroy={() => wsId.drop()}
>
<label
<box
visible={bind(config.modules.workspaces.showLabels)}
css={bind(config.modules.workspaces.xalign).as(a => `margin-left: ${a}px; margin-right: ${-a}px;`)}
label={bind(config.modules.workspaces.labels).as(l => l[idx - 1] ?? String(idx))}
vertical={bind(config.vertical)}
setup={self => {
const update = () => {
if (config.modules.workspaces.showWindows.get()) {
const clients = hyprland.clients.filter(c => c.workspace?.id === wsId.get());
self.children = [
label,
...clients.map(c => (
<label className="icon" label={bind(c, "class").as(getAppCategoryIcon)} />
)),
];
} else self.children = [label];
};
self.hook(wsId, update);
self.hook(hyprland, "client-added", update);
self.hook(hyprland, "client-moved", update);
self.hook(hyprland, "client-removed", update);
update();
}}
/>
</button>
);