1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
import type { Monitor } from "@/services/monitors";
import { bind, register, Variable } from "astal";
import { App, Astal, Gdk, Gtk, Widget } from "astal/gtk3";
import { sidebar } from "config";
import Dashboard from "./dashboard";
import NotifPane from "./notifpane";
@register()
export default class SideBar extends Widget.Window {
readonly shown: Variable<string> = Variable("dashboard");
constructor({ monitor }: { monitor: Monitor }) {
super({
application: App,
name: "sidebar",
namespace: "caelestia-sidebar",
monitor: monitor.id,
anchor: Astal.WindowAnchor.LEFT | Astal.WindowAnchor.TOP | Astal.WindowAnchor.BOTTOM,
exclusivity: Astal.Exclusivity.EXCLUSIVE,
visible: sidebar.showOnStartup.get(),
});
const panes = [<Dashboard />, <NotifPane />];
this.add(
<eventbox
onScroll={(_, event) => {
if (event.modifier & Gdk.ModifierType.BUTTON1_MASK) {
const index = panes.findIndex(p => p.name === this.shown.get()) + (event.delta_y < 0 ? -1 : 1);
if (index < 0 || index >= panes.length) return;
this.shown.set(panes[index].name);
}
}}
>
<box vertical className="sidebar">
<stack
vexpand
transitionType={Gtk.StackTransitionType.SLIDE_UP_DOWN}
transitionDuration={200}
shown={bind(this.shown)}
>
{panes}
</stack>
</box>
</eventbox>
);
}
}
|
