matt1432/nixos-configs
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

refactor: (ags bar): make hover revs more consistent
All checks were successful
Discord / discord commits (push) Has been skipped
Details

Browse source
This commit is contained in:
matt1432 2023-12-28 00:19:57 -05:00
parent 0e60d1d098
commit 3b4a541d2e
24 changed files with 289 additions and 378 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
devices/wim/config/ags/js/bar/buttons/audio.js
View file

@ -1,53 +0,0 @@
import Audio from 'resource:///com/github/Aylur/ags/service/audio.js';
import { Label, Box, EventBox, Icon, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
import { SpeakerIcon } from '../../misc/audio-icons.js';
import Separator from '../../misc/separator.js';
const SPACING = 5;
export default () => {
const icon = Icon({
icon: SpeakerIcon.bind(),
});
const hoverRevLabel = Revealer({
transition: 'slide_right',
child: Box({
children: [
Separator(SPACING),
Label().hook(Audio, (self) => {
if (Audio.speaker?.volume) {
self.label =
`${Math.round(Audio.speaker?.volume * 100)}%`;
}
}, 'speaker-changed'),
],
}),
});
const widget = EventBox({
on_hover: () => {
hoverRevLabel.reveal_child = true;
},
on_hover_lost: () => {
hoverRevLabel.reveal_child = false;
},
child: Box({
class_name: 'audio',
children: [
icon,
hoverRevLabel,
],
}),
});
return widget;
};

58
devices/wim/config/ags/js/bar/buttons/bluetooth.js
View file

@ -1,58 +0,0 @@
import Bluetooth from 'resource:///com/github/Aylur/ags/service/bluetooth.js';
import { Label, Box, EventBox, Icon, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
import Separator from '../../misc/separator.js';
const SPACING = 5;
export default () => {
const icon = Icon().hook(Bluetooth, (self) => {
if (Bluetooth.enabled) {
self.icon = Bluetooth.connected_devices[0] ?
Bluetooth.connected_devices[0].icon_name :
'bluetooth-active-symbolic';
}
else {
self.icon = 'bluetooth-disabled-symbolic';
}
});
const hoverRevLabel = Revealer({
transition: 'slide_right',
child: Box({
children: [
Separator(SPACING),
Label().hook(Bluetooth, (self) => {
self.label = Bluetooth.connected_devices[0] ?
`${Bluetooth.connected_devices[0]}` :
'Disconnected';
}, 'notify::connected-devices'),
],
}),
});
const widget = EventBox({
on_hover: () => {
hoverRevLabel.reveal_child = true;
},
on_hover_lost: () => {
hoverRevLabel.reveal_child = false;
},
child: Box({
class_name: 'bluetooth',
children: [
icon,
hoverRevLabel,
],
}),
});
return widget;
};

48
devices/wim/config/ags/js/bar/buttons/brightness.js
View file

@ -1,48 +0,0 @@
import { Box, EventBox, Icon, Label, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
import Brightness from '../../../services/brightness.js';
import Separator from '../../misc/separator.js';
const SPACING = 5;
export default () => {
const icon = Icon({
icon: Brightness.bind('screenIcon'),
});
const hoverRevLabel = Revealer({
transition: 'slide_right',
child: Box({
children: [
Separator(SPACING),
Label().hook(Brightness, (self) => {
self.label = `${Math.round(Brightness.screen * 100)}%`;
}, 'screen'),
],
}),
});
const widget = EventBox({
on_hover: () => {
hoverRevLabel.reveal_child = true;
},
on_hover_lost: () => {
hoverRevLabel.reveal_child = false;
},
child: Box({
class_name: 'brightness',
children: [
icon,
hoverRevLabel,
],
}),
});
return widget;
};

80
devices/wim/config/ags/js/bar/buttons/keyboard-layout.js
View file

@ -1,80 +0,0 @@
import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
import { Box, EventBox, Icon, Label, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
import Separator from '../../misc/separator.js';
const DEFAULT_KB = 'at-translated-set-2-keyboard';
const SPACING = 4;
/**
* @param {import('types/widgets/label').default} self
* @param {string} layout
* @param {string} _
*/
const getKbdLayout = (self, _, layout) => {
if (layout) {
if (layout === 'error') {
return;
}
const shortName = layout.match(/\(([A-Za-z]+)\)/);
self.label = shortName ? shortName[1] : layout;
}
else {
// At launch, kb layout is undefined
Hyprland.sendMessage('j/devices').then((obj) => {
const kb = Array.from(JSON.parse(obj).keyboards)
.find((v) => v.name === DEFAULT_KB);
layout = kb['active_keymap'];
const shortName = layout
.match(/\(([A-Za-z]+)\)/);
self.label = shortName ? shortName[1] : layout;
}).catch(print);
}
};
export default () => {
const hoverRevLabel = Revealer({
transition: 'slide_right',
child: Box({
children: [
Separator(SPACING),
Label({ css: 'font-size: 20px;' })
.hook(Hyprland, getKbdLayout, 'keyboard-layout'),
],
}),
});
const widget = EventBox({
on_hover: () => {
hoverRevLabel.reveal_child = true;
},
on_hover_lost: () => {
hoverRevLabel.reveal_child = false;
},
child: Box({
css: 'padding: 0 10px; margin-right: -10px;',
children: [
Icon({
icon: 'input-keyboard-symbolic',
size: 20,
}),
hoverRevLabel,
],
}),
});
return widget;
};

69
devices/wim/config/ags/js/bar/buttons/network.js
View file

@ -1,69 +0,0 @@
import Network from 'resource:///com/github/Aylur/ags/service/network.js';
import { Label, Box, EventBox, Icon, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
import Separator from '../../misc/separator.js';
const SPACING = 5;
export default () => {
const indicator = Icon().hook(Network, (self) => {
if (Network.wifi.internet === 'connected' ||
Network.wifi.internet === 'connecting') {
self.icon = Network.wifi.icon_name;
}
else if (Network.wired.internet === 'connected' ||
Network.wired.internet === 'connecting') {
self.icon = Network.wired.icon_name;
}
else {
self.icon = Network.wifi.icon_name;
}
});
const label = Label().hook(Network, (self) => {
if (Network.wifi.internet === 'connected' ||
Network.wifi.internet === 'connecting') {
self.label = Network.wifi.ssid || 'Unknown';
}
else if (Network.wired.internet === 'connected' ||
Network.wired.internet === 'connecting') {
self.label = 'Connected';
}
else {
self.label = 'Disconnected';
}
});
const hoverRevLabel = Revealer({
transition: 'slide_right',
child: Box({
children: [
Separator(SPACING),
label,
],
}),
});
const widget = EventBox({
on_hover: () => {
hoverRevLabel.reveal_child = true;
},
on_hover_lost: () => {
hoverRevLabel.reveal_child = false;
},
child: Box({
class_name: 'network',
children: [
indicator,
hoverRevLabel,
],
}),
});
return widget;
};

59
devices/wim/config/ags/js/bar/buttons/quick-settings.js
View file

@ -1,59 +0,0 @@
import App from 'resource:///com/github/Aylur/ags/app.js';
import { Box, Label } from 'resource:///com/github/Aylur/ags/widget.js';
import Audio from './audio.js';
import Bluetooth from './bluetooth.js';
import Brightness from './brightness.js';
import KeyboardLayout from './keyboard-layout.js';
import Network from './network.js';
import CursorBox from '../../misc/cursorbox.js';
import Separator from '../../misc/separator.js';
const SPACING = 4;
export default () => CursorBox({
class_name: 'toggle-off',
on_primary_click_release: (self) => {
// @ts-expect-error
App.getWindow('notification-center').attribute.set_x_pos(
self.get_allocation(),
'right',
);
App.toggleWindow('quick-settings');
},
setup: (self) => {
self.hook(App, (_, windowName, visible) => {
if (windowName === 'quick-settings') {
self.toggleClassName('toggle-on', visible);
}
});
},
child: Box({
class_name: 'quick-settings-toggle',
vertical: false,
children: [
Separator(SPACING),
KeyboardLayout(),
Brightness(),
Audio(),
Bluetooth(),
Network(),
Label(' '),
Separator(SPACING),
],
}),
});

22
devices/wim/config/ags/js/bar/hovers/audio.js Normal file
View file

@ -0,0 +1,22 @@
import Audio from 'resource:///com/github/Aylur/ags/service/audio.js';
import { Label, Icon } from 'resource:///com/github/Aylur/ags/widget.js';
import { SpeakerIcon } from '../../misc/audio-icons.js';
import HoverRevealer from './hover-revealer.js';
export default () => HoverRevealer({
class_name: 'audio',
icon: Icon({
icon: SpeakerIcon.bind(),
}),
label: Label().hook(Audio, (self) => {
if (Audio.speaker?.volume) {
self.label =
`${Math.round(Audio.speaker?.volume * 100)}%`;
}
}, 'speaker-changed'),
});

27
devices/wim/config/ags/js/bar/hovers/bluetooth.js Normal file
View file

@ -0,0 +1,27 @@
import Bluetooth from 'resource:///com/github/Aylur/ags/service/bluetooth.js';
import { Label, Icon } from 'resource:///com/github/Aylur/ags/widget.js';
import HoverRevealer from './hover-revealer.js';
export default () => HoverRevealer({
class_name: 'bluetooth',
icon: Icon().hook(Bluetooth, (self) => {
if (Bluetooth.enabled) {
self.icon = Bluetooth.connected_devices[0] ?
Bluetooth.connected_devices[0].icon_name :
'bluetooth-active-symbolic';
}
else {
self.icon = 'bluetooth-disabled-symbolic';
}
}),
label: Label().hook(Bluetooth, (self) => {
self.label = Bluetooth.connected_devices[0] ?
`${Bluetooth.connected_devices[0]}` :
'Disconnected';
}, 'notify::connected-devices'),
});

17
devices/wim/config/ags/js/bar/hovers/brightness.js Normal file
View file

@ -0,0 +1,17 @@
import { Icon, Label } from 'resource:///com/github/Aylur/ags/widget.js';
import Brightness from '../../../services/brightness.js';
import HoverRevealer from './hover-revealer.js';
export default () => HoverRevealer({
class_name: 'brightness',
icon: Icon({
icon: Brightness.bind('screenIcon'),
}),
label: Label().hook(Brightness, (self) => {
self.label = `${Math.round(Brightness.screen * 100)}%`;
}, 'screen'),
});

42
devices/wim/config/ags/js/bar/hovers/hover-revealer.js Normal file
View file

@ -0,0 +1,42 @@
import { Box, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
import Separator from '../../misc/separator.js';
import CursorBox from '../../misc/cursorbox.js';
export default ({
class_name,
icon,
label,
spacing = 5,
}) => {
const hoverRevLabel = Revealer({
transition: 'slide_right',
child: Box({
children: [
Separator(spacing),
label,
],
}),
});
const widget = CursorBox({
on_hover: () => {
hoverRevLabel.reveal_child = true;
},
child: Box({
class_name,
children: [
icon,
hoverRevLabel,
],
}),
});
return widget;
};

51
devices/wim/config/ags/js/bar/hovers/keyboard-layout.js Normal file
View file

@ -0,0 +1,51 @@
import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
import { Icon, Label } from 'resource:///com/github/Aylur/ags/widget.js';
import HoverRevealer from './hover-revealer.js';
const DEFAULT_KB = 'at-translated-set-2-keyboard';
/**
* @param {import('types/widgets/label').default} self
* @param {string} layout
* @param {string} _
*/
const getKbdLayout = (self, _, layout) => {
if (layout) {
if (layout === 'error') {
return;
}
const shortName = layout.match(/\(([A-Za-z]+)\)/);
self.label = shortName ? shortName[1] : layout;
}
else {
// At launch, kb layout is undefined
Hyprland.sendMessage('j/devices').then((obj) => {
const kb = Array.from(JSON.parse(obj).keyboards)
.find((v) => v.name === DEFAULT_KB);
layout = kb['active_keymap'];
const shortName = layout
.match(/\(([A-Za-z]+)\)/);
self.label = shortName ? shortName[1] : layout;
}).catch(print);
}
};
export default () => HoverRevealer({
class_name: 'keyboard',
spacing: 4,
icon: Icon({
icon: 'input-keyboard-symbolic',
size: 20,
}),
label: Label({ css: 'font-size: 20px;' })
.hook(Hyprland, getKbdLayout, 'keyboard-layout'),
});

38
devices/wim/config/ags/js/bar/hovers/network.js Normal file
View file

@ -0,0 +1,38 @@
import Network from 'resource:///com/github/Aylur/ags/service/network.js';
import { Label, Icon } from 'resource:///com/github/Aylur/ags/widget.js';
import HoverRevealer from './hover-revealer.js';
export default () => HoverRevealer({
class_name: 'network',
icon: Icon().hook(Network, (self) => {
if (Network.wifi.internet === 'connected' ||
Network.wifi.internet === 'connecting') {
self.icon = Network.wifi.icon_name;
}
else if (Network.wired.internet === 'connected' ||
Network.wired.internet === 'connecting') {
self.icon = Network.wired.icon_name;
}
else {
self.icon = Network.wifi.icon_name;
}
}),
label: Label().hook(Network, (self) => {
if (Network.wifi.internet === 'connected' ||
Network.wifi.internet === 'connecting') {
self.label = Network.wifi.ssid || 'Unknown';
}
else if (Network.wired.internet === 'connected' ||
Network.wired.internet === 'connecting') {
self.label = 'Connected';
}
else {
self.label = 'Disconnected';
}
}),
});

0
devices/wim/config/ags/js/bar/buttons/battery.js → devices/wim/config/ags/js/bar/items/battery.js
View file

0
devices/wim/config/ags/js/bar/buttons/clock.js → devices/wim/config/ags/js/bar/items/clock.js
View file

0
devices/wim/config/ags/js/bar/buttons/current-window.js → devices/wim/config/ags/js/bar/items/current-window.js
View file

0
devices/wim/config/ags/js/bar/buttons/heart.js → devices/wim/config/ags/js/bar/items/heart.js
View file

0
devices/wim/config/ags/js/bar/buttons/notif-button.js → devices/wim/config/ags/js/bar/items/notif-button.js
View file

0
devices/wim/config/ags/js/bar/buttons/osk-toggle.js → devices/wim/config/ags/js/bar/items/osk-toggle.js
View file

80
devices/wim/config/ags/js/bar/items/quick-settings.js Normal file
View file

@ -0,0 +1,80 @@
import App from 'resource:///com/github/Aylur/ags/app.js';
import { Box, Label } from 'resource:///com/github/Aylur/ags/widget.js';
import Audio from '../hovers/audio.js';
import Bluetooth from '../hovers/bluetooth.js';
import Brightness from '../hovers/brightness.js';
import KeyboardLayout from '../hovers/keyboard-layout.js';
import Network from '../hovers/network.js';
import CursorBox from '../../misc/cursorbox.js';
import Separator from '../../misc/separator.js';
const SPACING = 4;
export default () => {
const hoverRevealers = [
KeyboardLayout(),
Brightness(),
Audio(),
Bluetooth(),
Network(),
];
return CursorBox({
class_name: 'toggle-off',
on_primary_click_release: (self) => {
// @ts-expect-error
App.getWindow('notification-center').attribute.set_x_pos(
self.get_allocation(),
'right',
);
App.toggleWindow('quick-settings');
},
setup: (self) => {
self.hook(App, (_, windowName, visible) => {
if (windowName === 'quick-settings') {
self.toggleClassName('toggle-on', visible);
}
});
},
attribute: {
hoverRevealers: hoverRevealers.map(
// @ts-expect-error
(rev) => rev.child.children[1],
),
},
on_hover_lost: (self) => {
self.attribute.hoverRevealers.forEach(
/** @param {import('types/widgets/revealer').default} rev */
(rev) => {
rev.reveal_child = false;
},
);
},
child: Box({
class_name: 'quick-settings-toggle',
vertical: false,
children: [
Separator(SPACING),
...hoverRevealers,
Label(' '),
Separator(SPACING),
],
}),
});
};

0
devices/wim/config/ags/js/bar/buttons/systray.js → devices/wim/config/ags/js/bar/items/systray.js
View file

0
devices/wim/config/ags/js/bar/buttons/tablet-toggle.js → devices/wim/config/ags/js/bar/items/tablet-toggle.js
View file

0
devices/wim/config/ags/js/bar/buttons/workspaces.js → devices/wim/config/ags/js/bar/items/workspaces.js
View file

20
devices/wim/config/ags/js/bar/main.js
View file

@ -2,16 +2,16 @@ import { Window, CenterBox, Box } from 'resource:///com/github/Aylur/ags/widget.
import Separator from '../misc/separator.js';
import Battery from './buttons/battery.js';
import Clock from './buttons/clock.js';
import CurrentWindow from './buttons/current-window.js';
import Heart from './buttons/heart.js';
import NotifButton from './buttons/notif-button.js';
import OskToggle from './buttons/osk-toggle.js';
import QsToggle from './buttons/quick-settings.js';
import SysTray from './buttons/systray.js';
import TabletToggle from './buttons/tablet-toggle.js';
import Workspaces from './buttons/workspaces.js';
import Battery from './items/battery.js';
import Clock from './items/clock.js';
import CurrentWindow from './items/current-window.js';
import Heart from './items/heart.js';
import NotifButton from './items/notif-button.js';
import OskToggle from './items/osk-toggle.js';
import QsToggle from './items/quick-settings.js';
import SysTray from './items/systray.js';
import TabletToggle from './items/tablet-toggle.js';
import Workspaces from './items/workspaces.js';
import BarReveal from './fullscreen.js';

3
devices/wim/config/ags/scss/widgets/traybuttons.scss
View file

@ -61,7 +61,8 @@
.audio,
.bluetooth,
.brightness {
.brightness,
.keyboard {
padding: 0 10px;
font-size: 20px;
margin-right: -10px;