64 lines
2.1 KiB
TypeScript
64 lines
2.1 KiB
TypeScript
import App from 'resource:///com/github/Aylur/ags/app.js';
|
|
import Mpris from 'resource:///com/github/Aylur/ags/service/mpris.js';
|
|
|
|
import { CenterBox, Icon, ToggleButton } from 'resource:///com/github/Aylur/ags/widget.js';
|
|
|
|
// Types
|
|
import AgsRevealer from 'types/widgets/revealer';
|
|
|
|
const { Gdk } = imports.gi;
|
|
const display = Gdk.Display.get_default();
|
|
|
|
|
|
export default (rev: AgsRevealer) => {
|
|
const child = Icon({
|
|
icon: `${App.configDir}/icons/down-large.svg`,
|
|
class_name: 'arrow',
|
|
css: '-gtk-icon-transform: rotate(180deg);',
|
|
});
|
|
|
|
const button = CenterBox({
|
|
center_widget: ToggleButton({
|
|
setup: (self) => {
|
|
// Open at startup if there are players
|
|
const id = Mpris.connect('changed', () => {
|
|
self.set_active(Mpris.players.length > 0);
|
|
Mpris.disconnect(id);
|
|
});
|
|
|
|
self
|
|
.on('toggled', () => {
|
|
if (self.get_active()) {
|
|
child
|
|
.setCss('-gtk-icon-transform: rotate(0deg);');
|
|
rev.reveal_child = true;
|
|
}
|
|
else {
|
|
child
|
|
.setCss('-gtk-icon-transform: rotate(180deg);');
|
|
rev.reveal_child = false;
|
|
}
|
|
})
|
|
|
|
// OnHover
|
|
.on('enter-notify-event', () => {
|
|
self.window.set_cursor(Gdk.Cursor.new_from_name(
|
|
display,
|
|
'pointer',
|
|
));
|
|
self.toggleClassName('hover', true);
|
|
})
|
|
|
|
// OnHoverLost
|
|
.on('leave-notify-event', () => {
|
|
self.window.set_cursor(null);
|
|
self.toggleClassName('hover', false);
|
|
});
|
|
},
|
|
|
|
child,
|
|
}),
|
|
});
|
|
|
|
return button;
|
|
};
|