feat(ags): make use of exclusive ignore

devices/wim/config/ags/config.js

@@ -2,16 +2,17 @@ import App      from 'resource:///com/github/Aylur/ags/app.js';
 import { exec } from 'resource:///com/github/Aylur/ags/utils.js';
 
 import Setup       from './js/setup.js';
-import OSD           from './js/osd/main.js';
-import Powermenu     from './js/powermenu.js';
-import * as Bar      from './js/bar/main.js';
+import AppLauncher from './js/applauncher/main.js';
+import Bar         from './js/bar/main.js';
+import BgFade      from './js/misc/background-fade.js';
+import Calendar    from './js/date.js';
+import Corners     from './js/corners/main.js';
 import NotifCenter from './js/notifications/center.js';
 import NotifPopups from './js/notifications/popup.js';
-import Calendar      from './js/date.js';
-import QuickSettings from './js/quick-settings/main.js';
+import OSD         from './js/osd/main.js';
 import Overview    from './js/overview/main.js';
-import AppLauncher   from './js/applauncher/main.js';
-import * as Corners  from './js/screen-corners.js';
+import Powermenu   from './js/powermenu.js';
+import QSettings   from './js/quick-settings/main.js';
 
 const scss = App.configDir + '/scss/main.scss';
 const css  = App.configDir + '/style.css';
@@ -36,15 +37,14 @@ export default {
         AppLauncher(),
         Calendar(),
         NotifCenter(),
+        OSD(),
         Overview(),
         Powermenu(),
-        QuickSettings(),
+        QSettings(),
 
-        Bar.Bar(),
-        Bar.BgGradient(),
-        Corners.Bottomleft(),
-        Corners.Bottomright(),
-        OSD(),
+        Bar(),
+        BgFade(),
+        ...Corners(),
         NotifPopups(),
     ],
 };

devices/wim/config/ags/js/bar/fullscreen.js

@@ -1,44 +1,30 @@
-import App         from 'resource:///com/github/Aylur/ags/app.js';
 import Hyprland    from 'resource:///com/github/Aylur/ags/service/hyprland.js';
 import Variable    from 'resource:///com/github/Aylur/ags/variable.js';
 
-import { Box, EventBox, Overlay, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
+import { Box, EventBox, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
 import { timeout } from 'resource:///com/github/Aylur/ags/utils.js';
 
-import { RoundedCorner } from '../screen-corners.js';
-
 const Revealed = Variable(true);
 const Hovering = Variable(false);
-const wStyle = 'background: rgba(0, 0, 0, 0.5);';
 
 
 Hyprland.connect('changed', () => {
     const workspace = Hyprland.getWorkspace(Hyprland.active.workspace.id);
-    if (workspace)
-        Revealed.value = workspace.hasfullscreen;
+    Revealed.value = workspace?.hasfullscreen;
 });
 Hyprland.connect('fullscreen', (_, fullscreen) => Revealed.value = fullscreen);
 
-export default props => Overlay({
-    overlays: [
-        RoundedCorner('topleft',  { className: 'corner' }),
-        RoundedCorner('topright', { className: 'corner' }),
-    ],
-
-    child: Box({
+export default props => Box({
     css: 'min-height: 1px',
     hexpand: true,
     vertical: true,
     children: [
         Revealer({
             transition: 'slide_down',
-                setup: self => self.revealChild = true,
+            revealChild: true,
 
             properties: [['timeouts', []]],
             connections: [[Revealed, self => {
-                    App.getWindow('bar').setCss(Revealed.value ? '' : wStyle);
-                    App.getWindow('bg-gradient').visible = !Revealed.value;
-
                 if (Revealed.value) {
                     timeout(2000, () => {
                         if (Revealed.value)
@@ -94,5 +80,4 @@ export default props => Overlay({
             }),
         }),
     ],
-    }),
 });

devices/wim/config/ags/js/bar/main.js

@@ -12,23 +12,12 @@ import SysTray        from './systray.js';
 import Battery        from './battery.js';
 import Brightness     from './brightness.js';
 import Audio          from './audio.js';
-import Revealer       from './fullscreen.js';
 import KeyboardLayout from './keyboard-layout.js';
 
+import Revealer from './fullscreen.js';
 
-export const BgGradient = () => Window({
-    name: 'bg-gradient',
-    layer: 'background',
-    anchor: ['top', 'bottom', 'left', 'right'],
-    css: `
-        background-image: -gtk-gradient (linear,
-                          left top, left bottom,
-                          from(rgba(0, 0, 0, 0.5)),
-                          to(rgba(0, 0, 0, 0)));
-    `,
-});
 
-export const Bar = () => Window({
+export default () => Window({
     name: 'bar',
     layer: 'overlay',
     anchor: ['top', 'left', 'right'],

devices/wim/config/ags/js/corners/main.js

@@ -0,0 +1,45 @@
+import { Window } from 'resource:///com/github/Aylur/ags/widget.js';
+
+import RoundedCorner from './screen-corners.js';
+
+
+const TopLeft = () => Window({
+    name: 'cornertl',
+    layer: 'overlay',
+    exclusivity: 'ignore',
+    anchor: ['top', 'left'],
+    visible: true,
+    child: RoundedCorner('topleft'),
+});
+const TopRight = () => Window({
+    name: 'cornertr',
+    layer: 'overlay',
+    exclusivity: 'ignore',
+    anchor: ['top', 'right'],
+    visible: true,
+    child: RoundedCorner('topright'),
+});
+const BottomLeft = () => Window({
+    name: 'cornerbl',
+    layer: 'overlay',
+    exclusivity: 'ignore',
+    anchor: ['bottom', 'left'],
+    visible: true,
+    child: RoundedCorner('bottomleft'),
+});
+const BottomRight = () => Window({
+    name: 'cornerbr',
+    layer: 'overlay',
+    exclusivity: 'ignore',
+    anchor: ['bottom', 'right'],
+    visible: true,
+    child: RoundedCorner('bottomright'),
+});
+
+
+export default () => [
+    TopLeft(),
+    TopRight(),
+    BottomLeft(),
+    BottomRight(),
+];

devices/wim/config/ags/js/corners/screen-corners.js

@@ -1,8 +1,8 @@
-import { Box, DrawingArea, Window } from 'resource:///com/github/Aylur/ags/widget.js';
+import { Box, DrawingArea } from 'resource:///com/github/Aylur/ags/widget.js';
 import Gtk from 'gi://Gtk';
 const Lang = imports.lang;
 
-export const RoundedCorner = (place, props) => Box({
+export default place => Box({
     hpack: place.includes('left') ? 'start' : 'end',
     vpack: place.includes('top')  ? 'start' : 'end',
     css: `
@@ -13,7 +13,11 @@ export const RoundedCorner = (place, props) => Box({
             ${place.includes('left')   ? '-1px' : '0'};
         `,
     child: DrawingArea({
-        ...props,
+        css: `
+            background-color: black;
+            border-radius: 18px;
+            border-width: 0.068rem;
+        `,
         setup: widget => {
             const r = widget.get_style_context()
                 .get_property('border-radius', Gtk.StateFlags.NORMAL);
@@ -69,32 +73,3 @@ export const RoundedCorner = (place, props) => Box({
         },
     }),
 });
-
-export const Topleft = () => Window({
-    name: 'cornertl',
-    layer: 'overlay',
-    anchor: ['top', 'left'],
-    visible: true,
-    child: RoundedCorner('topleft', { className: 'corner' }),
-});
-export const Topright = () => Window({
-    name: 'cornertr',
-    layer: 'overlay',
-    anchor: ['top', 'right'],
-    visible: true,
-    child: RoundedCorner('topright', { className: 'corner' }),
-});
-export const Bottomleft = () => Window({
-    name: 'cornerbl',
-    layer: 'overlay',
-    anchor: ['bottom', 'left'],
-    visible: true,
-    child: RoundedCorner('bottomleft', { className: 'corner' }),
-});
-export const Bottomright = () => Window({
-    name: 'cornerbr',
-    layer: 'overlay',
-    anchor: ['bottom', 'right'],
-    visible: true,
-    child: RoundedCorner('bottomright', { className: 'corner' }),
-});

devices/wim/config/ags/js/misc/background-fade.js

@@ -0,0 +1,15 @@
+import { Window } from 'resource:///com/github/Aylur/ags/widget.js';
+
+
+export default () => Window({
+    name: 'bg-gradient',
+    layer: 'background',
+    exclusivity: 'ignore',
+    anchor: ['top', 'bottom', 'left', 'right'],
+    css: `
+        background-image: -gtk-gradient (linear,
+                          left top, left bottom,
+                          from(rgba(0, 0, 0, 0.5)),
+                          to(rgba(0, 0, 0, 0)));
+    `,
+});

devices/wim/config/ags/scss/main.scss

@@ -20,5 +20,4 @@ undershoot {
 @import "./widgets/player";
 @import "./widgets/overview";
 @import "./widgets/applauncher";
-@import "./widgets/corners";
 @import "./widgets/osd";

devices/wim/config/ags/scss/widgets/corners.scss

@@ -1,5 +0,0 @@
-.corner {
-  background-color: black;
-  border-radius: 18px; // Hard code because Hyprland rounding is in px
-  border-width: 0.068rem;
-}