overview: fewer destroy/create

This commit is contained in:
end-4
2024-02-08 17:19:52 +07:00
parent 3cce919268
commit 58b66959b7
+295 -249
View File
@@ -49,278 +49,324 @@ function substitute(str) {
if (!iconExists(str)) str = str.toLowerCase().replace(/\s+/g, '-'); // Turn into kebab-case if (!iconExists(str)) str = str.toLowerCase().replace(/\s+/g, '-'); // Turn into kebab-case
return str; return str;
} }
export default () => {
const clientMap = new Map();
const ContextMenuWorkspaceArray = ({ label, actionFunc, thisWorkspace }) => Widget.MenuItem({
label: `${label}`,
setup: (menuItem) => {
let submenu = new Gtk.Menu();
submenu.className = 'menu';
const ContextMenuWorkspaceArray = ({ label, actionFunc, thisWorkspace }) => Widget.MenuItem({ const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN;
label: `${label}`, const startWorkspace = offset + 1;
setup: (menuItem) => { const endWorkspace = startWorkspace + NUM_OF_WORKSPACES_SHOWN - 1;
let submenu = new Gtk.Menu(); for (let i = startWorkspace; i <= endWorkspace; i++) {
submenu.className = 'menu'; let button = new Gtk.MenuItem({
label: `Workspace ${i}`
const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN; });
const startWorkspace = offset + 1; button.connect("activate", () => {
const endWorkspace = startWorkspace + NUM_OF_WORKSPACES_SHOWN - 1; // execAsync([`${onClickBinary}`, `${thisWorkspace}`, `${i}`]).catch(print);
for (let i = startWorkspace; i <= endWorkspace; i++) { actionFunc(thisWorkspace, i);
let button = new Gtk.MenuItem({ });
label: `Workspace ${i}` submenu.append(button);
}); }
button.connect("activate", () => { menuItem.set_reserve_indicator(true);
// execAsync([`${onClickBinary}`, `${thisWorkspace}`, `${i}`]).catch(print); menuItem.set_submenu(submenu);
actionFunc(thisWorkspace, i);
});
submenu.append(button);
} }
menuItem.set_reserve_indicator(true); })
menuItem.set_submenu(submenu);
}
})
const Window = ({ address, at: [x, y], size: [w, h], workspace: { id, name }, class: c, title, xwayland }, screenCoords) => { const Window = ({ address, at: [x, y], size: [w, h], workspace: { id, name }, class: c, title, xwayland }, screenCoords) => {
const revealInfoCondition = (Math.min(w, h) * OVERVIEW_SCALE > 70); const revealInfoCondition = (Math.min(w, h) * OVERVIEW_SCALE > 70);
if (w <= 0 || h <= 0 || (c === '' && title === '')) return null; if (w <= 0 || h <= 0 || (c === '' && title === '')) return null;
// Non-primary monitors // Non-primary monitors
if (screenCoords.x != 0) x -= screenCoords.x; if (screenCoords.x != 0) x -= screenCoords.x;
if (screenCoords.y != 0) y -= screenCoords.y; if (screenCoords.y != 0) y -= screenCoords.y;
// Other offscreen adjustments // Other offscreen adjustments
if (x + w <= 0) x += (Math.floor(x / SCREEN_WIDTH) * SCREEN_WIDTH); if (x + w <= 0) x += (Math.floor(x / SCREEN_WIDTH) * SCREEN_WIDTH);
else if (x < 0) { w = x + w; x = 0; } else if (x < 0) { w = x + w; x = 0; }
if (y + h <= 0) x += (Math.floor(y / SCREEN_HEIGHT) * SCREEN_HEIGHT); if (y + h <= 0) x += (Math.floor(y / SCREEN_HEIGHT) * SCREEN_HEIGHT);
else if (y < 0) { h = y + h; y = 0; } else if (y < 0) { h = y + h; y = 0; }
// Truncate if offscreen // Truncate if offscreen
if (x + w > SCREEN_WIDTH) w = SCREEN_WIDTH - x; if (x + w > SCREEN_WIDTH) w = SCREEN_WIDTH - x;
if (y + h > SCREEN_HEIGHT) h = SCREEN_HEIGHT - y; if (y + h > SCREEN_HEIGHT) h = SCREEN_HEIGHT - y;
// title = truncateTitle(title); // title = truncateTitle(title);
return Widget.Button({ return Widget.Button({
attribute: { x, y }, attribute: { address, x, y, ws: id },
className: 'overview-tasks-window', className: 'overview-tasks-window',
hpack: 'center', hpack: 'center',
vpack: 'center', vpack: 'center',
onClicked: () => { onClicked: () => {
Hyprland.sendMessage(`dispatch focuswindow address:${address}`); Hyprland.sendMessage(`dispatch focuswindow address:${address}`);
App.closeWindow('overview'); App.closeWindow('overview');
}, },
onMiddleClickRelease: () => Hyprland.sendMessage(`dispatch closewindow address:${address}`), onMiddleClickRelease: () => Hyprland.sendMessage(`dispatch closewindow address:${address}`),
onSecondaryClick: (button) => { onSecondaryClick: (button) => {
button.toggleClassName('overview-tasks-window-selected', true); button.toggleClassName('overview-tasks-window-selected', true);
const menu = Widget.Menu({ const menu = Widget.Menu({
className: 'menu', className: 'menu',
children: [ children: [
Widget.MenuItem({ Widget.MenuItem({
child: Widget.Label({ child: Widget.Label({
xalign: 0, xalign: 0,
label: "Close (Middle-click)", label: "Close (Middle-click)",
}),
onActivate: () => Hyprland.sendMessage(`dispatch closewindow address:${address}`),
}), }),
onActivate: () => Hyprland.sendMessage(`dispatch closewindow address:${address}`), ContextMenuWorkspaceArray({
}), label: "Dump windows to workspace",
ContextMenuWorkspaceArray({ actionFunc: dumpToWorkspace,
label: "Dump windows to workspace", thisWorkspace: Number(id)
actionFunc: dumpToWorkspace, }),
thisWorkspace: Number(id) ContextMenuWorkspaceArray({
}), label: "Swap windows with workspace",
ContextMenuWorkspaceArray({ actionFunc: swapWorkspace,
label: "Swap windows with workspace", thisWorkspace: Number(id)
actionFunc: swapWorkspace, }),
thisWorkspace: Number(id) ],
}), });
], menu.connect("deactivate", () => {
}); button.toggleClassName('overview-tasks-window-selected', false);
menu.connect("deactivate", () => { })
button.toggleClassName('overview-tasks-window-selected', false); menu.connect("selection-done", () => {
}) button.toggleClassName('overview-tasks-window-selected', false);
menu.connect("selection-done", () => { })
button.toggleClassName('overview-tasks-window-selected', false); // menu.popup_at_pointer(null); // Show the menu at the pointer's position
}) menu.popup_at_widget(button.get_parent(), Gravity.SOUTH, Gravity.NORTH, null); // Show menu below the button
// menu.popup_at_pointer(null); // Show the menu at the pointer's position button.connect("destroy", () => menu.destroy());
menu.popup_at_widget(button.get_parent(), Gravity.SOUTH, Gravity.NORTH, null); // Show menu below the button },
button.connect("destroy", () => menu.destroy()); child: Widget.Box({
}, css: `
child: Widget.Box({
css: `
min-width: ${Math.max(w * OVERVIEW_SCALE - 4, 1)}px; min-width: ${Math.max(w * OVERVIEW_SCALE - 4, 1)}px;
min-height: ${Math.max(h * OVERVIEW_SCALE - 4, 1)}px; min-height: ${Math.max(h * OVERVIEW_SCALE - 4, 1)}px;
`, `,
homogeneous: true, homogeneous: true,
child: Widget.Box({ child: Widget.Box({
vertical: true, vertical: true,
vpack: 'center', vpack: 'center',
className: 'spacing-v-5', className: 'spacing-v-5',
children: [ children: [
Widget.Icon({ Widget.Icon({
icon: substitute(c), icon: substitute(c),
size: Math.min(w, h) * OVERVIEW_SCALE / 2.5, size: Math.min(w, h) * OVERVIEW_SCALE / 2.5,
}), }),
// TODO: Add xwayland tag instead of just having italics // TODO: Add xwayland tag instead of just having italics
Widget.Revealer({ Widget.Revealer({
transition: 'slide_down', transition: 'slide_down',
revealChild: revealInfoCondition, revealChild: revealInfoCondition,
child: Widget.Label({ child: Widget.Label({
truncate: 'end', truncate: 'end',
className: `${xwayland ? 'txt txt-italic' : 'txt'}`, className: `${xwayland ? 'txt txt-italic' : 'txt'}`,
css: ` css: `
font-size: ${Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) * OVERVIEW_SCALE / 14.6}px; font-size: ${Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) * OVERVIEW_SCALE / 14.6}px;
margin: 0px ${Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) * OVERVIEW_SCALE / 10}px; margin: 0px ${Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) * OVERVIEW_SCALE / 10}px;
`, `,
// If the title is too short, include the class // If the title is too short, include the class
label: (title.length <= 1 ? `${c}: ${title}` : title), label: (title.length <= 1 ? `${c}: ${title}` : title),
})
}) })
}) ]
] })
}) }),
}), tooltipText: `${c}: ${title}`,
tooltipText: `${c}: ${title}`, setup: (button) => {
setup: (button) => { setupCursorHoverGrab(button);
setupCursorHoverGrab(button);
button.drag_source_set(Gdk.ModifierType.BUTTON1_MASK, TARGET, Gdk.DragAction.MOVE); button.drag_source_set(Gdk.ModifierType.BUTTON1_MASK, TARGET, Gdk.DragAction.MOVE);
button.drag_source_set_icon_name(substitute(c)); button.drag_source_set_icon_name(substitute(c));
// button.drag_source_set_icon_gicon(icon); // button.drag_source_set_icon_gicon(icon);
button.connect('drag-begin', (button) => { // On drag start, add the dragging class button.connect('drag-begin', (button) => { // On drag start, add the dragging class
button.toggleClassName('overview-tasks-window-dragging', true); button.toggleClassName('overview-tasks-window-dragging', true);
}); });
button.connect('drag-data-get', (_w, _c, data) => { // On drag finish, give address button.connect('drag-data-get', (_w, _c, data) => { // On drag finish, give address
data.set_text(address, address.length); data.set_text(address, address.length);
button.toggleClassName('overview-tasks-window-dragging', false); button.toggleClassName('overview-tasks-window-dragging', false);
}); });
}, },
}); });
} }
const Workspace = (index) => { const Workspace = (index) => {
const fixed = Gtk.Fixed.new(); const fixed = Gtk.Fixed.new();
// const clientMap = new Map(); const WorkspaceNumber = (index) => Widget.Label({
const WorkspaceNumber = (index) => Widget.Label({ className: 'overview-tasks-workspace-number',
className: 'overview-tasks-workspace-number', label: `${index}`,
label: `${index}`, css: `
css: `
margin: ${Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) * OVERVIEW_SCALE * OVERVIEW_WS_NUM_MARGIN_SCALE}px; margin: ${Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) * OVERVIEW_SCALE * OVERVIEW_WS_NUM_MARGIN_SCALE}px;
font-size: ${SCREEN_HEIGHT * OVERVIEW_SCALE * OVERVIEW_WS_NUM_SCALE}px; font-size: ${SCREEN_HEIGHT * OVERVIEW_SCALE * OVERVIEW_WS_NUM_SCALE}px;
`, `,
}) })
const widget = Widget.Box({ const widget = Widget.Box({
className: 'overview-tasks-workspace', className: 'overview-tasks-workspace',
vpack: 'center', vpack: 'center',
css: ` css: `
min-width: ${SCREEN_WIDTH * OVERVIEW_SCALE}px; min-width: ${SCREEN_WIDTH * OVERVIEW_SCALE}px;
min-height: ${SCREEN_HEIGHT * OVERVIEW_SCALE}px; min-height: ${SCREEN_HEIGHT * OVERVIEW_SCALE}px;
`, `,
children: [Widget.EventBox({ children: [Widget.EventBox({
hexpand: true, hexpand: true,
vexpand: true, vexpand: true,
onPrimaryClick: () => { onPrimaryClick: () => {
Hyprland.sendMessage(`dispatch workspace ${index}`) Hyprland.sendMessage(`dispatch workspace ${index}`)
App.closeWindow('overview'); App.closeWindow('overview');
}, },
setup: (eventbox) => { setup: (eventbox) => {
eventbox.drag_dest_set(Gtk.DestDefaults.ALL, TARGET, Gdk.DragAction.COPY); eventbox.drag_dest_set(Gtk.DestDefaults.ALL, TARGET, Gdk.DragAction.COPY);
eventbox.connect('drag-data-received', (_w, _c, _x, _y, data) => { eventbox.connect('drag-data-received', (_w, _c, _x, _y, data) => {
Hyprland.sendMessage(`dispatch movetoworkspacesilent ${index},address:${data.get_text()}`) Hyprland.sendMessage(`dispatch movetoworkspacesilent ${index},address:${data.get_text()}`)
overviewTick.setValue(!overviewTick.value); overviewTick.setValue(!overviewTick.value);
});
},
child: fixed,
})],
});
widget.clear = () => {
clientMap.forEach((client, address) => {
if (!client || client.ws !== index) return;
client.destroy();
client = null;
clientMap.delete(address);
});
const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN;
fixed.put(WorkspaceNumber(offset + index), 0, 0);
}
widget.set = (clientJson, screenCoords) => {
let c = clientMap.get(clientJson.address);
if (c) {
if (c.ws !== clientJson.workspace.id) {
c.destroy();
c = null;
clientMap.delete(clientJson.address);
}
else {
fixed.move(c,
Math.max(0, (c.attribute.x + clientJson.x) / 2 * OVERVIEW_SCALE),
Math.max(0, (c.attribute.y + clientJson.y) / 2 * OVERVIEW_SCALE)
);
Utils.timeout(1000, () => fixed.move(c,
Math.max(0, clientJson.x * OVERVIEW_SCALE),
Math.max(0, clientJson.y * OVERVIEW_SCALE)
));
return;
}
}
const newWindow = Window(clientJson, screenCoords);
if (newWindow === null) return;
// clientMap.set(clientJson.address, newWindow);
fixed.put(newWindow,
Math.max(0, newWindow.attribute.x * OVERVIEW_SCALE),
Math.max(0, newWindow.attribute.y * OVERVIEW_SCALE)
);
clientMap.set(clientJson.address, newWindow);
};
// widget.unset = (clientAddress) => {
// if(clientMap.get(clientAddress)) {
// clientMap.get(clientAddress).destroy();
// clientMap.delete(clientAddress);
// }
// };
widget.show = () => {
fixed.show_all();
}
return widget;
};
const arr = (s, n) => {
const array = [];
for (let i = 0; i < n; i++)
array.push(s + i);
return array;
};
const OverviewRow = ({ startWorkspace, workspaces, windowName = 'overview' }) => Widget.Box({
children: arr(startWorkspace, workspaces).map(Workspace),
attribute: {
monitorMap: [],
getMonitorMap: (box) => {
execAsync('hyprctl -j monitors').then(monitors => {
box.attribute.monitorMap = JSON.parse(monitors).reduce((acc, item) => {
acc[item.id] = { x: item.x, y: item.y };
return acc;
}, {});
}); });
}, },
child: fixed, update: (box) => {
})], const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN;
}); if (!App.getWindow(windowName).visible) return;
widget.clear = () => { Hyprland.sendMessage('j/clients').then(clients => {
fixed.get_children().forEach(ch => ch.destroy()); const allClients = JSON.parse(clients);
const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN; const kids = box.get_children();
fixed.put(WorkspaceNumber(offset + index), 0, 0); kids.forEach(kid => kid.clear());
} for (let i = 0; i < allClients.length; i++) {
widget.set = (clientJson, screenCoords) => { const client = allClients[i];
// if(clientMap.get(clientJson.address)) clientMap.get(clientJson.address).destroy(); if (offset + startWorkspace <= client.workspace.id &&
const newWindow = Window(clientJson, screenCoords); client.workspace.id <= offset + startWorkspace + workspaces) {
if (newWindow === null) return; const screenCoords = box.attribute.monitorMap[client.monitor];
// clientMap.set(clientJson.address, newWindow); kids[client.workspace.id - (offset + startWorkspace)]
fixed.put(newWindow, ?.set(client, screenCoords);
Math.max(0, newWindow.attribute.x * OVERVIEW_SCALE), }
Math.max(0, newWindow.attribute.y * OVERVIEW_SCALE)
);
};
// widget.unset = (clientAddress) => {
// if(clientMap.get(clientAddress)) {
// clientMap.get(clientAddress).destroy();
// clientMap.delete(clientAddress);
// }
// };
widget.show = () => {
fixed.show_all();
}
return widget;
};
const arr = (s, n) => {
const array = [];
for (let i = 0; i < n; i++)
array.push(s + i);
return array;
};
const OverviewRow = ({ startWorkspace, workspaces, windowName = 'overview' }) => Widget.Box({
children: arr(startWorkspace, workspaces).map(Workspace),
attribute: {
monitorMap: [],
getMonitorMap: (box) => {
execAsync('hyprctl -j monitors').then(monitors => {
box.attribute.monitorMap = JSON.parse(monitors).reduce((acc, item) => {
acc[item.id] = { x: item.x, y: item.y };
return acc;
}, {});
});
},
update: (box) => {
const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN;
if (!App.getWindow(windowName).visible) return;
execAsync('hyprctl -j clients').then(clients => {
const allClients = JSON.parse(clients);
const kids = box.get_children();
kids.forEach(kid => kid.clear());
for (let i = 0; i < allClients.length; i++) {
const client = allClients[i];
if (offset + startWorkspace <= client.workspace.id &&
client.workspace.id <= offset + startWorkspace + workspaces) {
const screenCoords = box.attribute.monitorMap[client.monitor];
kids[client.workspace.id - (offset + startWorkspace)]
?.set(client, screenCoords);
} }
} kids.forEach(kid => kid.show());
kids.forEach(kid => kid.show());
}).catch(print); }).catch(print);
} },
}, updateWorkspace: (box, id) => {
setup: (box) => { const offset = Math.floor((Hyprland.active.workspace.id - 1) / NUM_OF_WORKSPACES_SHOWN) * NUM_OF_WORKSPACES_SHOWN;
box.attribute.getMonitorMap(box); if (!( // Not in range, ignore
box offset + startWorkspace <= id &&
.hook(overviewTick, (box) => box.attribute.update(box)) id <= offset + startWorkspace + workspaces
.hook(Hyprland, (box, clientAddress) => { )) return;
const client = Hyprland.getClient(clientAddress); if (!App.getWindow(windowName).visible) return;
box.attribute.updateWorkspace(client.workspace.id); Hyprland.sendMessage('j/clients').then(clients => {
// box.attribute.update(box) const allClients = JSON.parse(clients);
}, 'client-removed') const kids = box.get_children();
.hook(Hyprland, (box, clientAddress) => { for (let i = 0; i < allClients.length; i++) {
box.attribute.update(box); const client = allClients[i];
}, 'client-added') if (client.workspace.id != id) continue;
.hook(Hyprland.active.workspace, (box) => box.attribute.update(box)) const screenCoords = box.attribute.monitorMap[client.monitor];
.hook(App, (box, name, visible) => { // Update on open kids[id - (offset + startWorkspace)]?.set(client, screenCoords);
if (name == 'overview' && visible) box.attribute.update(box); }
}) kids[id - (offset + startWorkspace)]?.show();
}, }).catch(print);
}); },
},
setup: (box) => {
box.attribute.getMonitorMap(box);
box
.hook(overviewTick, (box) => box.attribute.update(box))
.hook(Hyprland, (box, clientAddress) => {
const client = Hyprland.getClient(clientAddress);
if (!client) return;
box.attribute.updateWorkspace(box, client.workspace.id);
// box.attribute.update(box)
}, 'client-removed')
.hook(Hyprland, (box, clientAddress) => {
const client = Hyprland.getClient(clientAddress);
if (!client) return;
box.attribute.updateWorkspace(box, client.workspace.id);
}, 'client-added')
.hook(Hyprland.active.workspace, (box) => box.attribute.update(box))
.hook(App, (box, name, visible) => { // Update on open
if (name == 'overview' && visible) box.attribute.update(box);
})
},
});
return Widget.Revealer({
export default () => Widget.Revealer({ revealChild: true,
revealChild: true, transition: 'slide_down',
transition: 'slide_down', transitionDuration: 200,
transitionDuration: 200, child: Widget.Box({
child: Widget.Box({ vertical: true,
vertical: true, className: 'overview-tasks',
className: 'overview-tasks', children: Array.from({ length: NUM_OF_WORKSPACE_ROWS }, (_, index) =>
children: Array.from({ length: NUM_OF_WORKSPACE_ROWS }, (_, index) => OverviewRow({
OverviewRow({ startWorkspace: 1 + index * NUM_OF_WORKSPACE_COLS,
startWorkspace: 1 + index * NUM_OF_WORKSPACE_COLS, workspaces: NUM_OF_WORKSPACE_COLS,
workspaces: NUM_OF_WORKSPACE_COLS, })
}) )
) }),
}), });
}); }