feat(ags): add slider box to quick settings

This commit is contained in:
matt1432 2023-09-12 15:27:39 -04:00
parent 2a540b0a62
commit ca84e7de34
4 changed files with 84 additions and 3 deletions

View file

@ -1,13 +1,13 @@
const { Window, CenterBox, Box, Label } = ags.Widget; const { Window, CenterBox, Box, Label } = ags.Widget;
import { ButtonGrid } from './button-grid.js'; import { ButtonGrid } from './button-grid.js';
//import { SliderBox } from './slider-box'; import { SliderBox } from './slider-box.js';
//import { Player } from //import { Player } from
export const QuickSettings = Window({ export const QuickSettings = Window({
name: 'quick-settings', name: 'quick-settings',
layer: 'overlay', layer: 'overlay',
//popup: true, popup: true,
anchor: 'top right', anchor: 'top right',
child: Box({ child: Box({
className: 'qs-container', className: 'qs-container',
@ -22,11 +22,13 @@ export const QuickSettings = Window({
Label({ Label({
label: 'Control Center', label: 'Control Center',
className: 'title', className: 'title',
halign: 'start',
style: 'margin-left: 20px'
}), }),
ButtonGrid, ButtonGrid,
//SliderBox, SliderBox,
], ],
}), }),

View file

@ -0,0 +1,75 @@
const { Box, Slider, Label, Icon } = ags.Widget;
const { Audio } = ags.Service;
const { exec } = ags.Utils;
const items = {
101: 'audio-volume-overamplified-symbolic',
67: 'audio-volume-high-symbolic',
34: 'audio-volume-medium-symbolic',
1: 'audio-volume-low-symbolic',
0: 'audio-volume-muted-symbolic',
};
export const SliderBox = Box({
className: 'slider-box',
vertical: true,
halign: 'center',
children: [
Box({
className: 'slider',
valign: 'start',
halign: 'center',
children: [
Icon({
size: 26,
className: 'slider-label',
connections: [[Audio, icon => {
if (Audio.speaker) {
if (Audio.speaker.isMuted) {
icon.icon = items[0];
}
else {
const vol = Audio.speaker.volume * 100;
for (const threshold of [-1, 0, 33, 66, 100]) {
if (vol > threshold + 1) {
icon.icon = items[threshold + 1];
}
}
}
}
}, 'speaker-changed']],
}),
Slider({
value: `${exec('bash -c "$EWW_PATH/volume.sh vol"')}`,
onChange: 'bash -c "$EWW_PATH/volume.sh set {}"',
min: 0,
max: 100,
draw_value: false,
}),
],
}),
Box({
className: 'slider',
valign: 'start',
halign: 'center',
children: [
Icon({
className: 'slider-label',
icon: 'display-brightness-symbolic',
}),
Slider({
value: `${exec('brightnessctl get') / 2.55}`,
onChange: "brightnessctl set {}%",
min: 0,
max: 100,
draw_value: false,
}),
],
}),
],
});

View file

@ -1,4 +1,6 @@
.quick-settings { .quick-settings {
margin-right: 5px;
margin-top: 8px;
font-size: 30px; font-size: 30px;
min-width: 500px; min-width: 500px;
padding: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;

View file

@ -456,6 +456,8 @@ calendar:indeterminate {
color: #262831; } color: #262831; }
.quick-settings { .quick-settings {
margin-right: 5px;
margin-top: 8px;
font-size: 30px; font-size: 30px;
min-width: 500px; min-width: 500px;
padding: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;