82 lines
2.7 KiB
TypeScript
82 lines
2.7 KiB
TypeScript
import { App, Astal, Gdk, Gtk } from "astal/gtk4"
|
|
import { bind, Binding } from "astal"
|
|
|
|
import PowerProfiles from "gi://AstalPowerProfiles";
|
|
import Battery from "gi://AstalBattery";
|
|
|
|
import DateTime from "@lib/widgets/datetime";
|
|
import Workspace from "./workspace";
|
|
import TrayView from "./tray";
|
|
|
|
type Substitution = { charging?: string, idle?: string }
|
|
|
|
const getBatteryIcon = (percentage: number, charging: Binding<boolean>) => {
|
|
const levels = Array.from({ length: 10 }, (_, i) => (i + 1) * 10);
|
|
const level = levels.find((level) => percentage <= level)!;
|
|
|
|
const substitutions: Record<number, Substitution> = {
|
|
100: { charging: "battery-level-100-charged-symbolic" }
|
|
};
|
|
|
|
return charging.as(c => c
|
|
? substitutions[level]?.charging || `battery-level-${level}-charging-symbolic`
|
|
: substitutions[level]?.idle || `battery-level-${level}-symbolic`
|
|
);
|
|
};
|
|
|
|
const BatteryInfo = ({ battery }: { battery: Battery.Device }) => {
|
|
const percentage = bind(battery, "percentage").as(p => Math.floor(p * 100));
|
|
const charging = bind(battery, "charging");
|
|
const power = PowerProfiles.get_default();
|
|
|
|
return (
|
|
<box>
|
|
{percentage.as(p => <button
|
|
hasFrame={false}
|
|
tooltipText={bind(power, "active_profile")}
|
|
>
|
|
<box>
|
|
<label>{percentage.as(p => `${p}%`)}</label>
|
|
<image iconName={getBatteryIcon(p, charging)} />
|
|
</box>
|
|
</button>)}
|
|
</box>
|
|
);
|
|
};
|
|
|
|
export default function Bar(monitor_id: number) {
|
|
const { BOTTOM, LEFT, RIGHT } = Astal.WindowAnchor
|
|
const CENTER = Gtk.Align.CENTER;
|
|
|
|
const battery = Battery.get_default();
|
|
|
|
const openQuickSettings = (_self: Gtk.Button, state: Gdk.ButtonEvent) => {
|
|
if (state.get_button() === Gdk.BUTTON_PRIMARY)
|
|
App.get_window("quick_settings")?.show()
|
|
}
|
|
|
|
return <window
|
|
visible
|
|
name={`bar_${monitor_id}`}
|
|
monitor={monitor_id}
|
|
cssClasses={["bar"]}
|
|
exclusivity={Astal.Exclusivity.EXCLUSIVE}
|
|
anchor={BOTTOM | LEFT | RIGHT}
|
|
application={App}>
|
|
<box halign={CENTER} cssClasses={["inner"]}>
|
|
{[
|
|
Workspace(),
|
|
<menubutton hasFrame={false}>
|
|
<DateTime format="%d.%m.%Y %H:%M:%S" interval={1000} />
|
|
<popover>
|
|
<Gtk.Calendar />
|
|
</popover>
|
|
</menubutton>,
|
|
BatteryInfo({ battery }),
|
|
<button hasFrame={false} iconName={"applications-system-symbolic"} onButtonPressed={openQuickSettings} />,
|
|
TrayView()
|
|
]}
|
|
</box>
|
|
</window>
|
|
}
|