nosignal/nosignal-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

bar: better battery indicator

Browse source
This commit is contained in:
2 * r + 2 * t 2025-02-20 15:42:49 +11:00
parent 1a0816655d
commit e0038ff74d
2 changed files with 25 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
scss/bar.scss
View file

@ -74,7 +74,11 @@
.battery {
color: scheme.$teal;
.low {
&.charging {
color: scheme.$green;
}
&.low {
color: scheme.$red;
}
}

40
src/modules/bar.tsx
View file

@ -35,9 +35,16 @@ const getBatteryIcon = (perc: number) => {
};
const formatSeconds = (sec: number) => {
if (sec >= 3600) return `${Math.floor(sec / 3600)} hour${sec % 3600 === 0 ? "" : "s"}`;
if (sec >= 60) return `${Math.floor(sec / 60)} minute${sec % 60 === 0 ? "" : "s"}`;
return `${sec} second${sec === 1 ? "" : "s"}`;
if (sec >= 3600) {
const hours = Math.floor(sec / 3600);
let str = `${hours} hour${hours === 1 ? "" : "s"}`;
const mins = Math.floor((sec % 3600) / 60);
if (mins > 0) str += ` ${mins} minute${mins === 1 ? "" : "s"}`;
return str;
} else if (sec >= 60) {
const mins = Math.floor(sec / 60);
return `${mins} minute${mins === 1 ? "" : "s"}`;
} else return `${sec} second${sec === 1 ? "" : "s"}`;
};
const hookFocusedClientProp = (
@ -451,30 +458,23 @@ const NotifCount = () => (
const Battery = () => {
const className = Variable.derive(
[bind(AstalBattery.get_default(), "percentage"), bind(AstalBattery.get_default(), "charging")],
(p, c) => `module battery ${p < 0.2 && !c ? "low" : ""}`
(p, c) => `module battery ${c ? "charging" : p < 0.2 ? "low" : ""}`
);
const tooltip = Variable.derive(
[bind(AstalBattery.get_default(), "timeToEmpty"), bind(AstalBattery.get_default(), "timeToFull")],
(e, f) => (f > 0 ? `${formatSeconds(f)} until full` : `${formatSeconds(e)} remaining`)
);
return (
<box
vertical={config.vertical}
className={bind(className)}
setup={self =>
setupCustomTooltip(
self,
bind(AstalBattery.get_default(), "timeToEmpty").as(p => `${formatSeconds(p)} remaining`)
)
}
onDestroy={() => className.drop()}
setup={self => setupCustomTooltip(self, bind(tooltip))}
onDestroy={() => {
className.drop();
tooltip.drop();
}}
>
<revealer
transitionType={
config.vertical ? Gtk.RevealerTransitionType.SLIDE_UP : Gtk.RevealerTransitionType.SLIDE_LEFT
}
transitionDuration={150}
revealChild={bind(AstalBattery.get_default(), "charging")}
>
<label className="icon" label="" />
</revealer>
<label className="icon" label={bind(AstalBattery.get_default(), "percentage").as(getBatteryIcon)} />
<label label={bind(AstalBattery.get_default(), "percentage").as(p => `${Math.round(p * 100)}%`)} />
</box>