LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update bluetooth battery indicator padding and provide option to define when to show battery icon. (#403)

Browse Source 
* Update bluetooth battery indicator visuals and behavior.

* Remove log

* Update default battery state to paired.

* Change to connected
This commit is contained in:
Jas Singh
2024-10-30 02:34:04 -07:00
committed by GitHub
parent 9bb582c8cf
commit 776e07b7bc
6 changed files with 225 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
lib/types/options.d.ts vendored
View File

@@ -215,3 +215,5 @@ export type ColorMapKey = keyof typeof defaultColorMap;
export type ColorMapValue = (typeof defaultColorMap)[ColorMapKey];
export type ScalingPriority = 'gdk' | 'hyprland' | 'both';
export type BluetoothBatteryState = 'paired' | 'connected' | 'always';

6
modules/bar/network/index.ts
View File

@@ -13,7 +13,11 @@ const formatFrequency = (frequency: number): string => {
};
const formatWifiInfo = (wifi: Wifi): string => {
return `Network: ${wifi.ssid === '' ? 'None' : wifi.ssid} \nSignal Strength: ${wifi.strength >= 0 ? wifi.strength : '--'}% \nFrequency: ${wifi.frequency >= 0 ? formatFrequency(wifi.frequency) : '--'}`;
const netSsid = wifi.ssid === '' ? 'None' : wifi.ssid;
const wifiStrength = wifi.strength >= 0 ? wifi.strength : '--';
const wifiFreq = wifi.frequency >= 0 ? formatFrequency(wifi.frequency) : '--';
return `Network: ${netSsid} \nSignal Strength: ${wifiStrength}% \nFrequency: ${wifiFreq}`;
};
const {

86
modules/menus/bluetooth/devices/devicelist.ts
View File

@@ -1,12 +1,13 @@
import { Bluetooth } from 'types/service/bluetooth.js';
import { Bluetooth, BluetoothDevice } from 'types/service/bluetooth.js';
import Box from 'types/widgets/box.js';
import { connectedControls } from './connectedControls.js';
import { getBluetoothIcon } from '../utils.js';
import Gtk from 'types/@girs/gtk-3.0/gtk-3.0.js';
import { Attribute, Child } from 'lib/types/widget.js';
import options from 'options';
import Label from 'types/widgets/label.js';
const { showBattery, batteryIcon } = options.menus.bluetooth;
const { showBattery, batteryIcon, batteryState } = options.menus.bluetooth;
const devices = (bluetooth: Bluetooth, self: Box<Gtk.Widget, unknown>): Box<Child, Attribute> => {
return self.hook(bluetooth, () => {
@@ -65,6 +66,33 @@ const devices = (bluetooth: Bluetooth, self: Box<Gtk.Widget, unknown>): Box<Chil
}));
}
const getConnectionStatusLabel = (device: BluetoothDevice): Label<Attribute> => {
return Widget.Label({
hpack: 'start',
class_name: 'connection-status dim',
label: device.connected ? 'Connected' : 'Paired',
});
};
const getBatteryInfo = (device: BluetoothDevice, batIcon: string): Gtk.Widget[] => {
if (typeof device.battery_percentage === 'number' && device.battery_percentage >= 0) {
return [
Widget.Separator({
class_name: 'menu-separator bluetooth-battery',
}),
Widget.Label({
class_name: 'connection-status txt-icon',
label: `${batIcon}`,
}),
Widget.Label({
class_name: 'connection-status battery',
label: `${device.battery_percentage}%`,
}),
];
}
return [];
};
return (self.child = Widget.Box({
vertical: true,
children: availableDevices.map((device) => {
@@ -107,50 +135,24 @@ const devices = (bluetooth: Bluetooth, self: Box<Gtk.Widget, unknown>): Box<Chil
child: Widget.Box({
hpack: 'start',
children: Utils.merge(
[showBattery.bind('value'), batteryIcon.bind('value')],
(showBat, batIcon) => {
if (!showBat) {
return [
Widget.Label({
hpack: 'start',
class_name: 'connection-status dim',
label: device.connected
? 'Connected'
: 'Paired',
}),
];
[
showBattery.bind('value'),
batteryIcon.bind('value'),
batteryState.bind('value'),
],
(showBat, batIcon, batState) => {
if (
!showBat ||
(batState === 'paired' && !device.paired) ||
(batState === 'connected' && !device.connected)
) {
return [getConnectionStatusLabel(device)];
}
return [
Widget.Label({
hpack: 'start',
class_name: 'connection-status dim',
label: device.connected
? 'Connected'
: 'Paired',
}),
getConnectionStatusLabel(device),
Widget.Box({
children:
typeof device.battery_percentage ===
'number' &&
device.battery_percentage >= 0
? [
Widget.Separator({
class_name:
'menu-separator',
}),
Widget.Label({
class_name:
'connection-status txt-icon',
label: `${batIcon}`,
}),
Widget.Label({
class_name:
'connection-status battery',
label: `${device.battery_percentage}%`,
}),
]
: [],
children: getBatteryInfo(device, batIcon),
}),
];
},

2
options.ts
View File

@@ -5,6 +5,7 @@ import {
ActiveWsIndicator,
BarButtonStyles,
BarLocation,
BluetoothBatteryState,
NotificationAnchor,
OSDAnchor,
OSDOrientation,
@@ -1057,6 +1058,7 @@ const options = mkOptions(OPTIONS, {
transitionTime: opt(200),
bluetooth: {
showBattery: opt(false),
batteryState: opt<BluetoothBatteryState>('connected'),
batteryIcon: opt('󰥉'),
},
volume: {

56
scss/style/menus/bluetooth.scss
View File

@@ -2,7 +2,7 @@
font-size: $font-size * $bar-menus-menu-bluetooth-scaling * 0.01;
}
@import "./menu.scss";
@import './menu.scss';
.menu-items.bluetooth {
background: if($bar-menus-monochrome, $bar-menus-background, $bar-menus-menu-bluetooth-background-color);
@@ -12,7 +12,6 @@
}
.menu-items-container.bluetooth {
min-width: 18em * $bar-menus-menu-bluetooth-scaling * 0.01;
font-size: 1.3em;
@@ -33,7 +32,6 @@
}
}
.menu-items-section {
background: if($bar-menus-monochrome, $bar-menus-cards, $bar-menus-menu-bluetooth-card-color);
min-height: 20em * $bar-menus-menu-bluetooth-scaling * 0.01;
@@ -45,11 +43,19 @@
&.search {
image {
color: if($bar-menus-monochrome, $bar-menus-iconbuttons-passive, $bar-menus-menu-bluetooth-iconbutton-passive);
color: if(
$bar-menus-monochrome,
$bar-menus-iconbuttons-passive,
$bar-menus-menu-bluetooth-iconbutton-passive
);
}
&:hover image {
color: if($bar-menus-monochrome, $bar-menus-iconbuttons-active, $bar-menus-menu-bluetooth-iconbutton-active);
color: if(
$bar-menus-monochrome,
$bar-menus-iconbuttons-active,
$bar-menus-menu-bluetooth-iconbutton-active
);
}
font-size: 0.8em;
@@ -57,7 +63,11 @@
}
&:hover {
color: if($bar-menus-monochrome, $bar-menus-iconbuttons-active, $bar-menus-menu-bluetooth-iconbutton-active);
color: if(
$bar-menus-monochrome,
$bar-menus-iconbuttons-active,
$bar-menus-menu-bluetooth-iconbutton-active
);
}
}
@@ -65,7 +75,11 @@
color: if($bar-menus-monochrome, $bar-menus-iconbuttons-passive, $bar-menus-menu-bluetooth-iconbutton-passive);
&:hover {
color: if($bar-menus-monochrome, $bar-menus-iconbuttons-active, $bar-menus-menu-bluetooth-iconbutton-active);
color: if(
$bar-menus-monochrome,
$bar-menus-iconbuttons-active,
$bar-menus-menu-bluetooth-iconbutton-active
);
}
}
@@ -73,16 +87,19 @@
margin-bottom: 0.4em;
&:hover {
.menu-button-icon,
.menu-button-name {
color: if($bar-menus-monochrome, $bar-menus-iconbuttons-active, $bar-menus-menu-bluetooth-iconbutton-active);
color: if(
$bar-menus-monochrome,
$bar-menus-iconbuttons-active,
$bar-menus-menu-bluetooth-iconbutton-active
);
}
}
image {
margin-right: 0em;
margin-top: 0.0em;
margin-top: 0em;
min-height: 1em;
min-width: 1em;
@@ -127,7 +144,11 @@
}
.menu-switch.bluetooth {
background-color: if($bar-menus-monochrome, $bar-menus-switch-disabled, $bar-menus-menu-bluetooth-switch-disabled);
background-color: if(
$bar-menus-monochrome,
$bar-menus-switch-disabled,
$bar-menus-menu-bluetooth-switch-disabled
);
&:checked {
background: if($bar-menus-monochrome, $bar-menus-switch-enabled, $bar-menus-menu-bluetooth-switch-enabled);
@@ -139,7 +160,11 @@
&:hover {
trough {
background: if($bar-menus-monochrome, $bar-menus-switch-disabled, $bar-menus-menu-bluetooth-switch-disabled);
background: if(
$bar-menus-monochrome,
$bar-menus-switch-disabled,
$bar-menus-menu-bluetooth-switch-disabled
);
}
slider {
@@ -162,4 +187,11 @@
color: if($bar-menus-monochrome, $bar-menus-text, $bar-menus-menu-bluetooth-text);
opacity: 0.5;
}
.menu-separator.bluetooth-battery {
margin: 0.2em 0.5em;
min-width: 0.1em;
}
.connection-status.txt-icon {
margin-left: 0.2em;
}
}

6
widget/settings/pages/config/menus/bluetooth.ts
View File

@@ -18,6 +18,12 @@ export const BluetoothMenuSettings = (): Scrollable<Child, Attribute> => {
title: 'Show Battery Percentage for Connected Devices (If Supported)',
type: 'boolean',
}),
Option({
opt: options.menus.bluetooth.batteryState,
title: 'Show Battery When',
type: 'enum',
enums: ['connected', 'paired', 'always'],
}),
Option({
opt: options.menus.bluetooth.batteryIcon,
title: 'Battery Icon',