retrozinndev
109 lines
4.4 KiB
TypeScript
109 lines
4.4 KiB
TypeScript
import { bind } from "astal";
|
|
import { Gtk, Widget } from "astal/gtk3";
|
|
import AstalMpris from "gi://AstalMpris";
|
|
import { Separator, SeparatorProps } from "../Separator";
|
|
|
|
const mpris: AstalMpris.Mpris = AstalMpris.get_default();
|
|
let defaultPlayer: (AstalMpris.Player|undefined) = mpris.get_players()?.[0];
|
|
|
|
const playerIcons = {
|
|
spotify: '',
|
|
clapper: '',
|
|
mpv: '',
|
|
spotube: '',
|
|
firefox: ''
|
|
}
|
|
|
|
export function Media(): JSX.Element {
|
|
|
|
bind(mpris, "players")?.as((players: Array<AstalMpris.Player>) => {
|
|
defaultPlayer = players?.[0] as AstalMpris.Player;
|
|
});
|
|
|
|
const mediaControlsRevealer: Widget.Revealer = new Widget.Revealer({
|
|
transitionType: Gtk.RevealerTransitionType.SLIDE_RIGHT,
|
|
transitionDuration: 260,
|
|
revealChild: false,
|
|
child: new Widget.Box({
|
|
className: "media-controls",
|
|
homogeneous: false,
|
|
children: [
|
|
new Widget.Button({
|
|
className: "previous",
|
|
label: "",
|
|
onClick: () => {
|
|
if(bind(defaultPlayer!, "canGoPrevious").as(Boolean))
|
|
defaultPlayer?.previous();
|
|
}
|
|
} as Widget.ButtonProps),
|
|
new Widget.Button({
|
|
className: "pause",
|
|
label: bind(defaultPlayer!, "playback_status").as((status: AstalMpris.PlaybackStatus) => {
|
|
return status === AstalMpris.PlaybackStatus.PLAYING ? "" : ""
|
|
}),
|
|
onClick: () => {
|
|
if(bind(defaultPlayer!, "canPlay").as(Boolean)
|
|
|| bind(defaultPlayer!, "canPause").as(Boolean))
|
|
defaultPlayer?.play_pause();
|
|
}
|
|
} as Widget.ButtonProps),
|
|
new Widget.Button({
|
|
className: "next",
|
|
label: "",
|
|
onClick: () => {
|
|
if(bind(defaultPlayer!, "canGoNext").as(Boolean))
|
|
defaultPlayer?.next();
|
|
}
|
|
} as Widget.ButtonProps)
|
|
]
|
|
} as Widget.BoxProps)
|
|
} as Widget.RevealerProps);
|
|
|
|
const mediaWidget = new Widget.EventBox({
|
|
className: "media-eventbox",
|
|
visible: bind(mpris, "players").as((players: Array<AstalMpris.Player>) => players?.[0]).as(Boolean),
|
|
child: new Widget.Box({
|
|
className: "media",
|
|
children: [
|
|
new Widget.Box({
|
|
children: [
|
|
new Widget.Label({
|
|
className: "icon",
|
|
label: defaultPlayer && bind(defaultPlayer, "busName")?.as((name: string) => {
|
|
const banana: Array<string> = name.split('.');
|
|
const playerName: string = banana[banana.length-1];
|
|
return playerIcons[playerName as keyof typeof playerIcons] || '';
|
|
})
|
|
} as Widget.LabelProps),
|
|
new Widget.Label({
|
|
className: "title",
|
|
label: defaultPlayer && bind(defaultPlayer, "title")?.as((title: string) => title)
|
|
} as Widget.LabelProps),
|
|
Separator({
|
|
size: 2,
|
|
cssColor: `rgb(180, 180, 180)`,
|
|
alpha: 1
|
|
} as SeparatorProps),
|
|
new Widget.Label({
|
|
className: "artist",
|
|
label: defaultPlayer && bind(defaultPlayer, "artist")?.as((artist: string) => artist)
|
|
} as Widget.LabelProps)
|
|
]
|
|
} as Widget.BoxProps),
|
|
mediaControlsRevealer
|
|
]
|
|
} as Widget.BoxProps)
|
|
} as Widget.EventBoxProps);
|
|
|
|
mediaWidget.connect("hover", () => {
|
|
mediaControlsRevealer.set_reveal_child(true);
|
|
mediaWidget.className = mediaWidget.className + " reveal";
|
|
});
|
|
mediaWidget.connect("hover-lost", () => {
|
|
mediaControlsRevealer.set_reveal_child(false);
|
|
mediaWidget.className = mediaWidget.className.replaceAll(" reveal", "");
|
|
})
|
|
|
|
return mediaWidget;
|
|
}
|