✨ chore: control-center and center-window widgets to gtk4 and ags v3

2025-07-06 19:56:09 -03:00
parent 7b758bd298
commit 9db1d6fc12
37 changed files with 1477 additions and 1867 deletions
@@ -0,0 +1,58 @@
+import { Astal, Gtk } from "ags/gtk4";
+import { Wireplumber } from "../../scripts/volume";
+import { Pages } from "./Pages";
+import { PageSound } from "./pages/Sound";
+import { PageMicrophone } from "./pages/Microphone";
+import { createBinding, With } from "ags";
+import AstalWp from "gi://AstalWp";
+
+
+export function Sliders() {
+    const slidersPages = <Pages /> as Pages;
+
+    return <Gtk.Box class={"sliders"} orientation={Gtk.Orientation.VERTICAL} 
+      hexpand={true} spacing={10}>
+
+        <With value={createBinding(Wireplumber.getWireplumber(), "defaultSpeaker")}>
+            {(sink: AstalWp.Endpoint) => <Gtk.Box class={"sink speaker"} spacing={3}>
+                <Gtk.Button onClicked={Wireplumber.getDefault().toggleMuteSink}
+                    iconName={createBinding(sink, "volumeIcon").as((icon) => 
+                        (!Wireplumber.getDefault().isMutedSink() && 
+                            Wireplumber.getDefault().getSinkVolume() > 0) ? 
+                                icon
+                            : "audio-volume-muted-symbolic"
+                )} />
+
+                <Astal.Slider drawValue={false} hexpand={true} 
+                  $={(self) => self.value = Math.floor(sink.volume * 100)}
+                  value={createBinding(sink, "volume").as(v => Math.floor(v * 100))}
+                  max={Wireplumber.getDefault().getMaxSinkVolume()}
+                  onChangeValue={(_, _scrollType, value) => sink.set_volume(value / 100)} />
+
+                <Gtk.Button class={"more"} iconName={"go-next-symbolic"} onClicked={(_) => 
+                    slidersPages.toggle(PageSound())} />
+            </Gtk.Box>}
+        </With>
+        <With value={createBinding(Wireplumber.getWireplumber(), "defaultMicrophone")}>
+            {(source: AstalWp.Endpoint) => <Gtk.Box class={"source microphone"} spacing={3}>
+                <Gtk.Button onClicked={Wireplumber.getDefault().toggleMuteSink}
+                    iconName={createBinding(source, "volumeIcon").as((icon) => 
+                        (!Wireplumber.getDefault().isMutedSink() && 
+                            Wireplumber.getDefault().getSinkVolume() > 0) ? 
+                                icon
+                            : "microphone-sensitivity-muted-symbolic"
+                )} />
+
+                <Astal.Slider drawValue={false} hexpand={true} 
+                  $={(self) => self.value = Math.floor(source.volume * 100)}
+                  value={createBinding(source, "volume").as(v => Math.floor(v * 100))}
+                  max={Wireplumber.getDefault().getMaxSinkVolume()}
+                  onChangeValue={(_, _scrollType, value) => source.set_volume(value / 100)} />
+
+                <Gtk.Button class={"more"} iconName={"go-next-symbolic"} onClicked={(_) => 
+                    slidersPages.toggle(PageMicrophone())} />
+            </Gtk.Box>}
+        </With>
+        {slidersPages}
+    </Gtk.Box>
+}