nixos-configs/hosts/wim/config/ags/js/bar/battery.js

60 lines
1.5 KiB
JavaScript
Raw Normal View History

import { Battery, Widget } from '../../imports.js';
const { Label, Icon, Stack, Box } = Widget;
import Separator from '../misc/separator.js';
2023-09-11 19:57:21 -04:00
const icons = charging => ([
...Array.from({ length: 10 }, (_, i) => i * 10).map(i => ([
`${i}`, Icon({
className: `${i} ${charging ? 'charging' : 'discharging'}`,
icon: `battery-level-${i}${charging ? '-charging' : ''}-symbolic`,
}),
])),
['100', Icon({
className: `100 ${charging ? 'charging' : 'discharging'}`,
icon: `battery-level-100${charging ? '-charged' : ''}-symbolic`,
})],
]);
const Indicators = charging => Stack({
items: icons(charging),
connections: [[Battery, stack => {
stack.shown = `${Math.floor(Battery.percent / 10) * 10}`;
}]],
});
const Indicator = ({
charging = Indicators(true),
discharging = Indicators(false),
...props
} = {}) => Stack({
...props,
className: 'battery-indicator',
items: [
['true', charging],
['false', discharging],
],
connections: [[Battery, stack => {
stack.shown = `${Battery.charging || Battery.charged}`;
stack.toggleClassName('charging', Battery.charging);
stack.toggleClassName('charged', Battery.charged);
stack.toggleClassName('low', Battery.percent < 20);
}]],
});
const LevelLabel = props => Label({
...props,
className: 'label',
connections: [[Battery, self => self.label = `${Battery.percent}%`]],
});
export default () => Box({
className: 'toggle-off battery',
children: [
Indicator(),
Separator(5),
LevelLabel(),
],
});