matt1432/nixos-configs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ags overview): fix visual flicker

Browse source
This commit is contained in:
matt1432 2023-11-07 10:56:12 -05:00
parent 33ff902117
commit 80427166f5
7 changed files with 37 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
devices/wim/config/ags/config.js
View file

@ -8,7 +8,7 @@ import NotifCenter from './js/notifications/center.js';
import NotifPopups from './js/notifications/popup.js'; import NotifPopups from './js/notifications/popup.js';
import Calendar from './js/date.js'; import Calendar from './js/date.js';
import QuickSettings from './js/quick-settings/main.js'; import QuickSettings from './js/quick-settings/main.js';
//import Overview from './js/overview/main.js'; import Overview from './js/overview/main.js';
import AppLauncher from './js/applauncher/main.js'; import AppLauncher from './js/applauncher/main.js';
import * as Corners from './js/screen-corners.js'; import * as Corners from './js/screen-corners.js';
@ -34,7 +34,7 @@ export default {
AppLauncher(), AppLauncher(),
Calendar(), Calendar(),
NotifCenter(), NotifCenter(),
//Overview(), Overview(),
Powermenu(), Powermenu(),
QuickSettings(), QuickSettings(),

1
devices/wim/config/ags/js/notifications/center.js
View file

@ -22,6 +22,7 @@ const addNotif = (box, notif) => {
} }
}; };
// FIXME: first notif never works
const NotificationList = () => Box({ const NotificationList = () => Box({
vertical: true, vertical: true,
vexpand: true, vexpand: true,

20
devices/wim/config/ags/js/overview/clients.js
View file

@ -1,6 +1,3 @@
// Has to be a traditional function for 'this' scope
Array.prototype.removeItem = function (el) { this.splice(this.indexOf(el), 1); };
import App from 'resource:///com/github/Aylur/ags/app.js'; import App from 'resource:///com/github/Aylur/ags/app.js';
import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js'; import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
import { Icon, Revealer } from 'resource:///com/github/Aylur/ags/widget.js'; import { Icon, Revealer } from 'resource:///com/github/Aylur/ags/widget.js';
@ -19,7 +16,6 @@ const getFontSize = client => {
}; };
const IconStyle = client => ` const IconStyle = client => `
transition: font-size 0.2s linear;
min-width: ${scale(client.size[0])}px; min-width: ${scale(client.size[0])}px;
min-height: ${scale(client.size[1])}px; min-height: ${scale(client.size[1])}px;
font-size: ${getFontSize(client)}px; font-size: ${getFontSize(client)}px;
@ -82,8 +78,9 @@ const Client = (client, active, clients) => {
child: Icon({ child: Icon({
className: `window ${active}`, className: `window ${active}`,
style: IconStyle(client) + 'font-size: 10px;', css: IconStyle(client) + 'font-size: 10px;',
icon: client.class, icon: client.class,
size: 1,
}), }),
}), }),
}); });
@ -103,7 +100,6 @@ export function updateClients(box) {
if (client.address == Hyprland.active.client.address) if (client.address == Hyprland.active.client.address)
active = 'active'; active = 'active';
// TODO: fix multi monitor issue. this is just a temp fix // TODO: fix multi monitor issue. this is just a temp fix
client.at[1] -= 2920; client.at[1] -= 2920;
@ -123,19 +119,19 @@ export function updateClients(box) {
client.at[1] * VARS.SCALE, client.at[1] * VARS.SCALE,
]; ];
if (newClient[0]) { if (!newClient[0]) {
toRemove.removeItem(newClient[0]);
fixed.move(...newClient);
}
else {
newClient[0] = Client(client, active, clients); newClient[0] = Client(client, active, clients);
fixed.put(...newClient); fixed.put(...newClient);
} }
else {
toRemove.splice(toRemove.indexOf(newClient[0]), 1);
fixed.move(...newClient);
}
// Set a timeout here to have an animation when the icon first appears // Set a timeout here to have an animation when the icon first appears
timeout(1, () => { timeout(1, () => {
newClient[0].child.child.className = `window ${active}`; newClient[0].child.child.className = `window ${active}`;
newClient[0].child.child.style = IconStyle(client); newClient[0].child.child.setCss(IconStyle(client));
}); });
}); });

8
devices/wim/config/ags/js/overview/current-workspace.js
View file

@ -10,10 +10,10 @@ const DEFAULT_STYLE = `
export const Highlighter = () => Box({ export const Highlighter = () => Box({
valign: 'start', vpack: 'start',
halign: 'start', hpack: 'start',
className: 'workspace active', className: 'workspace active',
style: DEFAULT_STYLE, css: DEFAULT_STYLE,
}); });
export const updateCurrentWorkspace = self => { export const updateCurrentWorkspace = self => {
@ -27,7 +27,7 @@ export const updateCurrentWorkspace = self => {
const height = row * (VARS.SCREEN.Y * VARS.SCALE + 17); const height = row * (VARS.SCREEN.Y * VARS.SCALE + 17);
const currentIndex = workspaces.findIndex(w => w._id == currentId); const currentIndex = workspaces.findIndex(w => w._id == currentId);
self.setStyle(` self.setCss(`
${DEFAULT_STYLE} ${DEFAULT_STYLE}
margin-left: ${9 + currentIndex * (VARS.SCREEN.X * VARS.SCALE + 34)}px; margin-left: ${9 + currentIndex * (VARS.SCREEN.X * VARS.SCALE + 34)}px;
margin-top: ${9 + height}px; margin-top: ${9 + height}px;

2
devices/wim/config/ags/js/overview/dragndrop.js
View file

@ -52,7 +52,7 @@ export const WorkspaceDrop = props => EventBox({
}); });
export const WindowButton = ({ address, ...props } = {}) => Button({ export const WindowButton = ({ address, ...props } = {}) => Button({
type: 'Button', isButton: true,
...props, ...props,
setup: self => { setup: self => {
self.drag_source_set(Gdk.ModifierType.BUTTON1_MASK, TARGET, Gdk.DragAction.COPY); self.drag_source_set(Gdk.ModifierType.BUTTON1_MASK, TARGET, Gdk.DragAction.COPY);

6
devices/wim/config/ags/js/overview/main.js
View file

@ -1,6 +1,7 @@
import App from 'resource:///com/github/Aylur/ags/app.js'; import App from 'resource:///com/github/Aylur/ags/app.js';
import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js'; import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
import { Box, Overlay } from 'resource:///com/github/Aylur/ags/widget.js'; import { Box, Overlay } from 'resource:///com/github/Aylur/ags/widget.js';
import { timeout } from 'resource:///com/github/Aylur/ags/utils.js';
import PopupWindow from '../misc/popup.js'; import PopupWindow from '../misc/popup.js';
import { WorkspaceRow, getWorkspaces, updateWorkspaces } from './workspaces.js'; import { WorkspaceRow, getWorkspaces, updateWorkspaces } from './workspaces.js';
@ -15,6 +16,8 @@ function update(box) {
updateCurrentWorkspace(box); updateCurrentWorkspace(box);
} }
// FIXME: can't drag in workspaces that are before the highlight
// TODO: have a 'page' for each monitor, arrows on both sides to loop through
export default () => PopupWindow({ export default () => PopupWindow({
name: 'overview', name: 'overview',
closeOnUnfocus: 'none', closeOnUnfocus: 'none',
@ -22,10 +25,13 @@ export default () => PopupWindow({
child: Overlay({ child: Overlay({
setup: self => { setup: self => {
// FIXME: see if we can get rid of this timeout
timeout(1, () => {
self.set_overlay_pass_through( self.set_overlay_pass_through(
self.get_children()[1], self.get_children()[1],
true, true,
); );
});
}, },
overlays: [Highlighter()], overlays: [Highlighter()],
child: Box({ child: Box({

32
devices/wim/config/ags/js/overview/workspaces.js
View file

@ -1,7 +1,5 @@
import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js'; import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
import { Revealer, CenterBox, Box, EventBox, Label } from 'resource:///com/github/Aylur/ags/widget.js'; import { Revealer, CenterBox, Box, EventBox, Fixed, Label } from 'resource:///com/github/Aylur/ags/widget.js';
import Gtk from 'gi://Gtk';
import { WorkspaceDrop } from './dragndrop.js'; import { WorkspaceDrop } from './dragndrop.js';
import * as VARS from './variables.js'; import * as VARS from './variables.js';
@ -24,7 +22,7 @@ export function getWorkspaces(box) {
export const WorkspaceRow = (className, i) => Revealer({ export const WorkspaceRow = (className, i) => Revealer({
transition: 'slide_down', transition: 'slide_down',
halign: className === 'special' ? '' : 'start', hpack: className === 'special' ? '' : 'start',
connections: [[Hyprland, rev => { connections: [[Hyprland, rev => {
const minId = i * VARS.WORKSPACE_PER_ROW; const minId = i * VARS.WORKSPACE_PER_ROW;
const activeId = Hyprland.active.workspace.id; const activeId = Hyprland.active.workspace.id;
@ -35,15 +33,11 @@ export const WorkspaceRow = (className, i) => Revealer({
}]], }]],
child: CenterBox({ child: CenterBox({
children: [null, EventBox({ children: [null, EventBox({
// save ref to the 'add' workspace
properties: [['box']],
setup: eventbox => eventbox._box = eventbox.child.children[0],
connections: [[Hyprland, eventbox => { connections: [[Hyprland, eventbox => {
const maxId = i * VARS.WORKSPACE_PER_ROW + VARS.WORKSPACE_PER_ROW; const maxId = i * VARS.WORKSPACE_PER_ROW + VARS.WORKSPACE_PER_ROW;
const activeId = Hyprland.active.workspace.id; const activeId = Hyprland.active.workspace.id;
eventbox._box.revealChild = className === 'special' || eventbox.child.children[0].revealChild = className === 'special' ||
!Hyprland.workspaces.some(ws => ws.id > maxId && !Hyprland.workspaces.some(ws => ws.id > maxId &&
(ws.windows > 0 || ws.id === activeId)); (ws.windows > 0 || ws.id === activeId));
}]], }]],
@ -62,16 +56,12 @@ export const WorkspaceRow = (className, i) => Revealer({
const Workspace = (id, name, extra = false) => { const Workspace = (id, name, extra = false) => {
let workspace; let workspace;
const fixed = Gtk.Fixed.new(); const fixed = Fixed();
if (!extra) { if (!extra) {
workspace = Revealer({ workspace = Revealer({
transition: 'slide_right', transition: 'slide_right',
transitionDuration: 500, transitionDuration: 500,
properties: [
['id', id],
['name', name],
],
connections: [[Hyprland, box => { connections: [[Hyprland, box => {
const activeId = Hyprland.active.workspace.id; const activeId = Hyprland.active.workspace.id;
const active = activeId === box._id; const active = activeId === box._id;
@ -81,7 +71,7 @@ const Workspace = (id, name, extra = false) => {
child: WorkspaceDrop({ child: WorkspaceDrop({
child: Box({ child: Box({
className: 'workspace', className: 'workspace',
style: DEFAULT_STYLE, css: DEFAULT_STYLE,
child: fixed, child: fixed,
}), }),
}), }),
@ -91,19 +81,15 @@ const Workspace = (id, name, extra = false) => {
else { else {
workspace = Revealer({ workspace = Revealer({
transition: 'slide_right', transition: 'slide_right',
properties: [
['id', id],
['name', name],
],
child: WorkspaceDrop({ child: WorkspaceDrop({
child: Box({ child: Box({
style: `min-width: ${VARS.SCREEN.X * VARS.SCALE / 2}px; css: `min-width: ${VARS.SCREEN.X * VARS.SCALE / 2}px;
min-height: ${VARS.SCREEN.Y * VARS.SCALE}px;`, min-height: ${VARS.SCREEN.Y * VARS.SCALE}px;`,
children: [ children: [
fixed, fixed,
Label({ Label({
label: ' +', label: ' +',
style: 'font-size: 40px;', css: 'font-size: 40px;',
}), }),
], ],
}), }),
@ -111,6 +97,8 @@ const Workspace = (id, name, extra = false) => {
}); });
} }
workspace._id = id;
workspace._name = name;
workspace.getFixed = () => fixed; workspace.getFixed = () => fixed;
return workspace; return workspace;
}; };
@ -137,10 +125,10 @@ export function updateWorkspaces(box) {
row.add(Workspace(ws.id, type ? ws.name : '')); row.add(Workspace(ws.id, type ? ws.name : ''));
} }
}); });
box.show_all();
// Make sure the order is correct // Make sure the order is correct
box._workspaces.forEach((workspace, i) => { box._workspaces.forEach((workspace, i) => {
workspace.get_parent().reorder_child(workspace, i); workspace.get_parent().reorder_child(workspace, i);
}); });
box.show_all();
} }