LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Finish network module for now... replace nmcli with something better later (it sucks at auth)

Browse Source
This commit is contained in:
Jas Singh
2024-06-23 12:06:53 -07:00
parent 6c5685b9a2
commit 46c34e169d
7 changed files with 546 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
modules/bar/menu/index.js
View File

@@ -1,6 +1,9 @@
import { exec } from "resource:///com/github/Aylur/ags/utils.js";
export const Menu = () => { export const Menu = () => {
return Widget.Box({ return Widget.Box({
child: Widget.Button({ child: Widget.Button({
on_primary_click: () => exec('/home/jaskir/.config/hypr/scripts/rofi.sh'),
child: Widget.Label({ child: Widget.Label({
class_name: "bar-menu_label", class_name: "bar-menu_label",
label: "󰣇", label: "󰣇",

529
modules/menus/network/index.js
View File

@@ -3,9 +3,11 @@ import DropdownMenu from "../DropdownMenu.js";
export default () => { export default () => {
network.connect("changed", (value) => { network.connect("changed", (value) => {
console.log(JSON.stringify(value, null, 2)); // console.log(JSON.stringify(value, null, 2));
}); });
const pendingAuth = Variable("");
return DropdownMenu({ return DropdownMenu({
name: "networkmenu", name: "networkmenu",
transition: "crossfade", transition: "crossfade",
@@ -42,55 +44,203 @@ export default () => {
vertical: true, vertical: true,
setup: (self) => { setup: (self) => {
self.hook(network, () => { self.hook(network, () => {
let sortedNetworks = []; // console.log(JSON.stringify(network, null, 2));
self.hook(pendingAuth, () => {
let sortedNetworks = [];
if (network.wifi.access_points.length > 0) { if (network.wifi.access_points.length > 0) {
sortedNetworks = network.wifi.access_points sortedNetworks = network.wifi.access_points
.filter((ap) => ap.ssid !== "Unknown") .filter((ap) => ap.ssid !== "Unknown")
.sort((a, b) => { .sort((a, b) => {
if (a.ssid === network.wifi.ssid) {
return -1;
} else if (b.ssid === network.wifi.ssid) {
return 1;
} else {
return b.strength - a.strength; return b.strength - a.strength;
} });
}); }
}
const localIfConnected = () => { const localIfConnected = () => {
if (network.primary === "wired") { if (network.primary === "wired") {
return Widget.Box({ return [
class_name: `network-element-item-ethernet ${sortedNetworks.length > 0 ? "multi" : ""}`, Widget.Box({
child: Widget.Box({ class_name: `network-element-item-ethernet ${sortedNetworks.length > 0 ? "multi" : ""}`,
hpack: "start", child: Widget.Box({
vertical: true, hpack: "start",
children: [ vertical: true,
Widget.Box({
class_name: "network-element-items-container",
children: [ children: [
Widget.Button({ Widget.Box({
class_name: "menu-button-icon network", children: [
child: Widget.Icon({ Widget.Box({
tooltip_text: network.wired.internet, class_name:
icon: `${network.wired["icon_name"]}`, "network-element-items-container",
}), children: [
Widget.Button({
class_name: "menu-button-icon network",
child: Widget.Icon({
tooltip_text: network.wired.internet,
icon: `${network.wired["icon_name"]}`,
}),
}),
Widget.Label({
class_name: "menu-button-name network",
truncate: "end",
wrap: true,
label: `Ethernet (${network.wired.speed / 1000} Gbps)`,
}),
],
}),
],
}), }),
Widget.Label({ Widget.Box({
class_name: "menu-button-name network", class_name:
truncate: "end", "menu-button-name-container status dim",
wrap: true, children: [
label: `Ethernet (${network.wired.speed / 1000} Gbps)`, Widget.Label({
class_name:
"menu-button-name status network dim",
label:
network.wired.internet
.charAt(0)
.toUpperCase() +
network.wired.internet.slice(1),
}),
],
}), }),
], ],
}), }),
], }),
}), ];
}); }
} return [];
return Widget.Box({}); };
};
return (self.child = localIfConnected()); const wifiIfConnected = () => {
const getIdBySsid = (ssid, nmcliOutput) => {
const lines = nmcliOutput.trim().split("\n");
for (const line of lines) {
const columns = line.trim().split(/\s{2,}/);
if (columns[0].includes(ssid)) {
return columns[1];
}
}
return null;
};
if (network.wifi.ssid !== "") {
return [
Widget.Box({
class_name: `network-element-item-ethernet`,
children: [
Widget.Box({
hpack: "start",
vertical: true,
children: [
Widget.Box({
children: [
Widget.Box({
class_name:
"network-element-items-container",
children: [
Widget.Button({
class_name:
"menu-button-icon network",
child: Widget.Icon({
tooltip_text: network.wifi.state,
icon: `${network.wifi["icon_name"]}`,
}),
}),
Widget.Label({
class_name:
"menu-button-name network",
truncate: "end",
wrap: true,
label: network.wifi.ssid,
}),
],
}),
],
}),
Widget.Box({
class_name:
"menu-button-name-container status dim",
children: [
Widget.Label({
class_name:
"menu-button-name status network dim",
label:
network.wifi.internet
.charAt(0)
.toUpperCase() +
network.wifi.internet.slice(1),
}),
],
}),
],
}),
Widget.Box({
hexpand: true,
hpack: "end",
children: [
Widget.Button({
class_name:
"menu-icon-button network disconnect",
on_primary_click: () => {
Utils.execAsync(
"nmcli connection show --active",
).then((res) => {
const connectionId = getIdBySsid(
network.wifi.ssid,
res,
);
Utils.execAsync(
`nmcli connection down ${connectionId} "${network.wifi.ssid}"`,
).catch((err) =>
console.error(
`Error while disconnecting from wifi "${network.wifi.ssid}": ${err}`,
),
);
});
},
child: Widget.Label(""),
}),
Widget.Box({
hexpand: true,
child: Widget.Button({
class_name:
"menu-icon-button network forget",
on_primary_click: () => {
Utils.execAsync(
"nmcli connection show --active",
).then((res) => {
const connectionId = getIdBySsid(
network.wifi.ssid,
res,
);
Utils.execAsync(
`nmcli connection delete ${connectionId} "${network.wifi.ssid}"`,
).catch((err) =>
console.error(
`Error while forgetting "${network.wifi.ssid}": ${err}`,
),
);
});
},
child: Widget.Label("󰆴"),
}),
}),
],
}),
],
}),
];
}
return [];
};
return (self.children = [
...localIfConnected(),
...wifiIfConnected(),
]);
});
}); });
}, },
}), }),
@@ -98,76 +248,249 @@ export default () => {
class_name: "menu-separator", class_name: "menu-separator",
}), }),
Widget.Box({ Widget.Box({
class_name: "menu-label-container network", children: [
child: Widget.Label({ Widget.Box({
class_name: "menu-label network", hpack: "start",
hpack: "start", class_name: "menu-label-container network",
label: "Available Networks", child: Widget.Label({
}), class_name: "menu-label network",
hpack: "start",
label: "Available Networks",
}),
}),
Widget.Box({
hexpand: true,
hpack: "end",
child: Widget.Button({
class_name: "menu-icon-button refresh network",
on_primary_click: () => {
network.wifi.scan();
},
child: Widget.Icon("view-refresh-symbolic"),
}),
}),
],
}), }),
Widget.Box({ Widget.Box({
class_name: "menu-item-box network", class_name: "menu-item-box network",
vertical: true, vertical: true,
setup: (self) => { children: [
self.hook(network, () => { Widget.Box({
// TODO: Finish dis vertical: true,
setup: (self) => {
let sortedNetworks = []; self.hook(pendingAuth, () => {
const accPoint = network.wifi.access_points.find(
if (network.wifi.access_points.length > 0) { (ap) => ap.bssid === pendingAuth.value,
sortedNetworks = network.wifi.access_points );
.filter((ap) => ap.ssid !== "Unknown") if (
.sort((a, b) => { pendingAuth.value !== "" &&
if (a.ssid === network.wifi.ssid) { accPoint !== undefined &&
return -1; network.wifi.ssid !== pendingAuth.value
} else if (b.ssid === network.wifi.ssid) { ) {
return 1; return (self.child = Widget.Box({
} else { vertical: true,
return b.strength - a.strength; children: [
} Widget.Button({
}); class_name: "network-element-item",
} child: Widget.Box({
console.log(sortedNetworks.length);
return (self.children = sortedNetworks.map((curNetwork) => {
return Widget.Button({
class_name: "network-element-item",
child: Widget.Box({
children: [
Widget.Box({
hpack: "start",
vertical: true,
children: [
Widget.Box({
class_name: "network-element-items-container",
children: [ children: [
Widget.Button({ Widget.Box({
class_name: "menu-button-icon network", hpack: "start",
child: Widget.Icon({ vertical: true,
tooltip_text: children: [
curNetwork.ssid === network.wifi.ssid Widget.Box({
? network.wifi.state class_name:
: null, "network-element-items-container",
icon: `${curNetwork["iconName"]}`, children: [
}), Widget.Button({
}), class_name:
Widget.Label({ "menu-button-icon network",
class_name: "menu-button-name network", child: Widget.Icon({
truncate: "end", tooltip_text:
wrap: true, accPoint.ssid ===
label: curNetwork.ssid, network.wifi.ssid
? network.wifi.state
: null,
icon: `${accPoint["iconName"]}`,
}),
}),
Widget.Label({
class_name:
"menu-button-name network",
truncate: "end",
wrap: true,
label: accPoint.ssid,
}),
],
}),
],
}), }),
], ],
}), }),
], }),
}),
], Widget.Revealer({
}), transition: "slide_down",
reveal_child: pendingAuth
.bind("value")
.as((v) => (v === accPoint.bssid ? true : false)),
class_name: "network-password-input-container",
child: Widget.Box({
hexpand: true,
children: [
Widget.Box({
child: Widget.Entry({
hpack: "start",
class_name: "network-password-input",
placeholder_text: "enter password",
visibility: false,
onAccept: (selfInp) => {
Utils.execAsync(
`nmcli dev wifi connect ${accPoint.bssid} password ${selfInp.text}`,
)
.catch((err) => {
pendingAuth.value = "";
console.error(
`Failed to connect to wifi: ${accPoint.ssid}... ${err}`,
);
})
.then(() => (pendingAuth.value = ""));
selfInp.text = "";
},
}),
}),
Widget.Box({
class_name:
"network-password-input-close-container",
hexpand: true,
child: Widget.Button({
class_name: "network-password-input-close",
on_primary_click: () =>
(pendingAuth.value = ""),
child: Widget.Label("󰅜 "),
}),
}),
],
}),
}),
],
}));
} else {
self.children = [];
}
}); });
})); },
}); }),
}, Widget.Box({
vertical: true,
setup: (self) => {
self.hook(network, () => {
let sortedNetworks = [];
self.hook(pendingAuth, () => {
if (network.wifi.access_points.length > 0) {
sortedNetworks = network.wifi.access_points
.filter((ap) => {
return (
ap.ssid !== "Unknown" &&
ap.bssid !== pendingAuth.value &&
!ap.active &&
network.wifi.ssid !== ap.ssid
);
})
.sort((a, b) => {
return b.strength - a.strength;
});
}
return (self.children = sortedNetworks.map((accPoint) => {
return Widget.Box({
vertical: true,
children: [
Widget.Button({
on_primary_click: () => {
Utils.execAsync(
`nmcli device wifi connect ${accPoint.bssid}`,
).catch((err) => {
if (
err
.toLowerCase()
.includes(
"secrets were required, but not provided",
)
) {
pendingAuth.value = accPoint.bssid;
}
});
},
class_name: "network-element-item",
child: Widget.Box({
children: [
Widget.Box({
hpack: "start",
vertical: true,
children: [
Widget.Box({
class_name:
"network-element-items-container",
children: [
Widget.Button({
class_name:
"menu-button-icon network",
child: Widget.Icon({
tooltip_text:
accPoint.ssid ===
network.wifi.ssid
? network.wifi.state
: null,
icon: `${accPoint["iconName"]}`,
}),
}),
Widget.Label({
class_name:
"menu-button-name network",
truncate: "end",
wrap: true,
label: accPoint.ssid,
}),
],
}),
],
}),
],
}),
}),
Widget.Revealer({
transition: "slide_down",
reveal_child: pendingAuth
.bind("value")
.as((v) =>
v === accPoint.bssid ? true : false,
),
class_name: "network-password-input-container",
child: Widget.Box({
hexpand: true,
children: [
Widget.Entry({
hexpand: true,
class_name: "network-password-input",
placeholder_text: "enter password",
visibility: false,
onAccept: (selfInp) => {
selfInp.text = "";
},
}),
],
}),
}),
],
});
}));
});
});
},
}),
],
}), }),
], ],
}), }),

2
modules/notifications/index.js
View File

@@ -134,7 +134,7 @@ export default () => {
hexpand: true, hexpand: true,
vexpand: true, vexpand: true,
max_width_chars: max_width_chars:
notif.image === undefined ? 29 : 21, notif.image === undefined ? 27 : 20,
truncate: "end", truncate: "end",
wrap: true, wrap: true,
label: notif["summary"], label: notif["summary"],

59
scss/menus/network.scss
View File

@@ -8,6 +8,10 @@
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.menu-button-name.status.network {
margin-left: 2.5rem;
}
.menu-label.network { .menu-label.network {
color: $mauve; color: $mauve;
} }
@@ -30,3 +34,58 @@
color: $overlay2; color: $overlay2;
} }
.network-password-input {
border-radius: 0.4rem;
background: $crust;
padding: 0.4rem;
margin-left: 2.5rem;
margin-bottom: 0.5rem;
font-size: 1rem;
}
.menu-icon-button.refresh.network {
margin-bottom: 1rem;
&:hover {
color: $mauve;
}
}
.network-password-input-close {
margin-left: 0.75rem;
margin-bottom: 0.6rem;
&:hover {
color: $sky;
}
label {
font-size: 1.35rem;
}
}
.menu-icon-button.network.disconnect {
margin-bottom: 1.4rem;
margin-right: 0.5rem;
&:hover {
color: $mauve;
}
label {
font-size: 1.2rem;
}
}
.menu-icon-button.network.forget {
margin-bottom: 1.4rem;
margin-right: 0.5rem;
&:hover {
color: $mauve;
}
label {
font-size: 1.5rem;
}
}

5
scss/notifications/popups.scss
View File

@@ -7,8 +7,7 @@
color: $text; color: $text;
background: $mantle; background: $mantle;
margin-right: 0.4rem; margin-right: 0.4rem;
border: 0.15rem solid $surface0; border: 0.15rem solid $surface0; min-width: 28rem;
min-width: 28rem;
min-height: 6rem; min-height: 6rem;
border-radius: 0.4rem; border-radius: 0.4rem;
@@ -81,7 +80,7 @@
} }
&:hover { &:hover {
background: $pink; background: $surface1;
} }
} }

55
style.css
View File

@@ -776,6 +776,10 @@ window#powermenu .powermenu.box {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.menu-button-name.status.network {
margin-left: 2.5rem;
}
.menu-label.network { .menu-label.network {
color: #cba6f7; color: #cba6f7;
} }
@@ -795,6 +799,55 @@ window#powermenu .powermenu.box {
color: #9399b2; color: #9399b2;
} }
.network-password-input {
border-radius: 0.4rem;
background: #11111b;
padding: 0.4rem;
margin-left: 2.5rem;
margin-bottom: 0.5rem;
font-size: 1rem;
}
.menu-icon-button.refresh.network {
margin-bottom: 1rem;
}
.menu-icon-button.refresh.network:hover {
color: #cba6f7;
}
.network-password-input-close {
margin-left: 0.75rem;
margin-bottom: 0.6rem;
}
.network-password-input-close:hover {
color: #89dceb;
}
.network-password-input-close label {
font-size: 1.35rem;
}
.menu-icon-button.network.disconnect {
margin-bottom: 1.4rem;
margin-right: 0.5rem;
}
.menu-icon-button.network.disconnect:hover {
color: #cba6f7;
}
.menu-icon-button.network.disconnect label {
font-size: 1.2rem;
}
.menu-icon-button.network.forget {
margin-bottom: 1.4rem;
margin-right: 0.5rem;
}
.menu-icon-button.network.forget:hover {
color: #cba6f7;
}
.menu-icon-button.network.forget label {
font-size: 1.5rem;
}
.menu-dropdown-label.bluetooth { .menu-dropdown-label.bluetooth {
color: #89dceb; color: #89dceb;
} }
@@ -919,7 +972,7 @@ window#powermenu .powermenu.box {
margin-right: 2rem; margin-right: 2rem;
} }
.notification-action-buttons:hover { .notification-action-buttons:hover {
background: #f5c2e7; background: #45475a;
} }
.notification-icon { .notification-icon {

2
style.css.map
View File

File diff suppressed because one or more lines are too long