nixos-configs/config/ags/js/quick-settings/main.js

80 lines
2.1 KiB
JavaScript

const { Window, Box, Label, Revealer, Icon } = ags.Widget;
const { Mpris } = ags.Service;
const { ToggleButton } = imports.gi.Gtk;
import { ButtonGrid } from './button-grid.js';
import { SliderBox } from './slider-box.js';
import Player from '../media-player/player.js';
import { EventBox } from '../misc/cursorbox.js';
import { PopUp } from '../misc/popup.js';
const QuickSettingsWidget = Box({
className: 'qs-container',
vertical: true,
children: [
Box({
className: 'quick-settings',
vertical: true,
children: [
Label({
label: 'Control Center',
className: 'title',
halign: 'start',
style: 'margin-left: 20px'
}),
ButtonGrid,
SliderBox,
EventBox({
child: ags.Widget({
type: ToggleButton,
setup: btn => {
const id = Mpris.instance.connect('changed', () => {
btn.set_active(Mpris.players.length > 0);
Mpris.instance.disconnect(id);
});
},
connections: [['toggled', button => {
if (button.get_active()) {
button.child.setStyle("-gtk-icon-transform: rotate(0deg);");
button.get_parent().get_parent().get_parent().children[1].revealChild = true;
}
else {
button.child.setStyle('-gtk-icon-transform: rotate(180deg);');
button.get_parent().get_parent().get_parent().children[1].revealChild = false;
}
}]],
child: Icon({
icon: 'folder-download-symbolic',
className: 'arrow',
style: `-gtk-icon-transform: rotate(180deg);`,
}),
}),
}),
],
}),
Revealer({
transition: 'slide_down',
child: Player(),
})
],
});
export const QuickSettings = Window({
name: 'quick-settings',
layer: 'overlay',
anchor: 'top right',
popup: true,
margin: [ 8, 5, 0, ],
child: PopUp({
name: 'quick-settings',
child: QuickSettingsWidget,
}),
});