bar: optional modules
All modules can be enabled/disabled in config
This commit is contained in:
parent
f70735078f
commit
90cc9ac00f
2 changed files with 60 additions and 19 deletions
40
config.ts
40
config.ts
|
|
@ -3,8 +3,44 @@ import { Astal } from "astal/gtk3";
|
||||||
// Modules
|
// Modules
|
||||||
export const bar = {
|
export const bar = {
|
||||||
vertical: true,
|
vertical: true,
|
||||||
wsPerGroup: 5,
|
modules: {
|
||||||
dateTime: { format: "%d/%m/%y %R", detailed: "%c" },
|
osIcon: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
activeWindow: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
mediaPlaying: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
workspaces: {
|
||||||
|
enabled: true,
|
||||||
|
shown: 5,
|
||||||
|
},
|
||||||
|
tray: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
statusIcons: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
pkgUpdates: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
notifCount: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
battery: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
dateTime: {
|
||||||
|
enabled: true,
|
||||||
|
format: "%d/%m/%y %R",
|
||||||
|
detailedFormat: "%c",
|
||||||
|
},
|
||||||
|
power: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
export const launcher = {
|
export const launcher = {
|
||||||
|
|
|
||||||
|
|
@ -169,7 +169,9 @@ const MediaPlaying = () => {
|
||||||
|
|
||||||
const Workspace = ({ idx }: { idx: number }) => {
|
const Workspace = ({ idx }: { idx: number }) => {
|
||||||
let wsId = hyprland.focusedWorkspace
|
let wsId = hyprland.focusedWorkspace
|
||||||
? Math.floor((hyprland.focusedWorkspace.id - 1) / config.wsPerGroup) * config.wsPerGroup + idx
|
? Math.floor((hyprland.focusedWorkspace.id - 1) / config.modules.workspaces.shown) *
|
||||||
|
config.modules.workspaces.shown +
|
||||||
|
idx
|
||||||
: idx;
|
: idx;
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
|
|
@ -185,7 +187,10 @@ const Workspace = ({ idx }: { idx: number }) => {
|
||||||
|
|
||||||
self.hook(hyprland, "notify::focused-workspace", () => {
|
self.hook(hyprland, "notify::focused-workspace", () => {
|
||||||
if (!hyprland.focusedWorkspace) return;
|
if (!hyprland.focusedWorkspace) return;
|
||||||
wsId = Math.floor((hyprland.focusedWorkspace.id - 1) / config.wsPerGroup) * config.wsPerGroup + idx;
|
wsId =
|
||||||
|
Math.floor((hyprland.focusedWorkspace.id - 1) / config.modules.workspaces.shown) *
|
||||||
|
config.modules.workspaces.shown +
|
||||||
|
idx;
|
||||||
self.toggleClassName("focused", hyprland.focusedWorkspace.id === wsId);
|
self.toggleClassName("focused", hyprland.focusedWorkspace.id === wsId);
|
||||||
update();
|
update();
|
||||||
});
|
});
|
||||||
|
|
@ -210,7 +215,7 @@ const Workspaces = () => (
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<box vertical={config.vertical} className="module workspaces">
|
<box vertical={config.vertical} className="module workspaces">
|
||||||
{Array.from({ length: config.wsPerGroup }).map((_, idx) => (
|
{Array.from({ length: config.modules.workspaces.shown }).map((_, idx) => (
|
||||||
<Workspace idx={idx + 1} /> // Start from 1
|
<Workspace idx={idx + 1} /> // Start from 1
|
||||||
))}
|
))}
|
||||||
</box>
|
</box>
|
||||||
|
|
@ -484,11 +489,11 @@ const Battery = () => {
|
||||||
const DateTime = () => (
|
const DateTime = () => (
|
||||||
<button
|
<button
|
||||||
onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")}
|
onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")}
|
||||||
setup={self => setupCustomTooltip(self, bindCurrentTime(config.dateTime.detailed))}
|
setup={self => setupCustomTooltip(self, bindCurrentTime(config.modules.dateTime.detailedFormat))}
|
||||||
>
|
>
|
||||||
<box className="module date-time">
|
<box className="module date-time">
|
||||||
<label className="icon" label="calendar_month" />
|
<label className="icon" label="calendar_month" />
|
||||||
<label label={bindCurrentTime(config.dateTime.format)} />
|
<label label={bindCurrentTime(config.modules.dateTime.format)} />
|
||||||
</box>
|
</box>
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
|
|
@ -496,7 +501,7 @@ const DateTime = () => (
|
||||||
const DateTimeVertical = () => (
|
const DateTimeVertical = () => (
|
||||||
<button
|
<button
|
||||||
onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")}
|
onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")}
|
||||||
setup={self => setupCustomTooltip(self, bindCurrentTime(config.dateTime.detailed))}
|
setup={self => setupCustomTooltip(self, bindCurrentTime(config.modules.dateTime.detailedFormat))}
|
||||||
>
|
>
|
||||||
<box vertical className="module date-time">
|
<box vertical className="module date-time">
|
||||||
<label className="icon" label="calendar_month" />
|
<label className="icon" label="calendar_month" />
|
||||||
|
|
@ -527,9 +532,9 @@ export default ({ monitor }: { monitor: Monitor }) => (
|
||||||
>
|
>
|
||||||
<centerbox vertical={config.vertical} className={`bar ${config.vertical ? "vertical" : " horizontal"}`}>
|
<centerbox vertical={config.vertical} className={`bar ${config.vertical ? "vertical" : " horizontal"}`}>
|
||||||
<box vertical={config.vertical}>
|
<box vertical={config.vertical}>
|
||||||
<OSIcon />
|
{config.modules.osIcon.enabled && <OSIcon />}
|
||||||
<ActiveWindow />
|
{config.modules.activeWindow.enabled && <ActiveWindow />}
|
||||||
<MediaPlaying />
|
{config.modules.mediaPlaying.enabled && <MediaPlaying />}
|
||||||
<button
|
<button
|
||||||
expand
|
expand
|
||||||
onScroll={(_, event) =>
|
onScroll={(_, event) =>
|
||||||
|
|
@ -537,7 +542,7 @@ export default ({ monitor }: { monitor: Monitor }) => (
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
</box>
|
</box>
|
||||||
<Workspaces />
|
{config.modules.workspaces.enabled && <Workspaces />}
|
||||||
<box vertical={config.vertical}>
|
<box vertical={config.vertical}>
|
||||||
<button
|
<button
|
||||||
expand
|
expand
|
||||||
|
|
@ -549,13 +554,13 @@ export default ({ monitor }: { monitor: Monitor }) => (
|
||||||
else speaker.volume += 0.1;
|
else speaker.volume += 0.1;
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Tray />
|
{config.modules.tray.enabled && <Tray />}
|
||||||
<StatusIcons />
|
{config.modules.statusIcons.enabled && <StatusIcons />}
|
||||||
<PkgUpdates />
|
{config.modules.pkgUpdates.enabled && <PkgUpdates />}
|
||||||
<NotifCount />
|
{config.modules.notifCount.enabled && <NotifCount />}
|
||||||
{AstalBattery.get_default().isBattery && <Battery />}
|
{config.modules.battery.enabled && AstalBattery.get_default().isBattery && <Battery />}
|
||||||
{config.vertical ? <DateTimeVertical /> : <DateTime />}
|
{config.modules.dateTime.enabled && (config.vertical ? <DateTimeVertical /> : <DateTime />)}
|
||||||
<Power />
|
{config.modules.power.enabled && <Power />}
|
||||||
</box>
|
</box>
|
||||||
</centerbox>
|
</centerbox>
|
||||||
</window>
|
</window>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue