From 2f8075718ab67748cc3968749fc9b44d8de2a424 Mon Sep 17 00:00:00 2001 From: end-4 <97237370+end-4@users.noreply.github.com> Date: Tue, 2 Apr 2024 18:48:38 +0700 Subject: [PATCH] sidebar: wifi: auth --- .../sideright/centermodules/wifinetworks.js | 171 +++++++++++++++--- .config/ags/scss/_sidebars.scss | 20 +- 2 files changed, 161 insertions(+), 30 deletions(-) diff --git a/.config/ags/modules/sideright/centermodules/wifinetworks.js b/.config/ags/modules/sideright/centermodules/wifinetworks.js index 20acd18b6..8303463fb 100644 --- a/.config/ags/modules/sideright/centermodules/wifinetworks.js +++ b/.config/ags/modules/sideright/centermodules/wifinetworks.js @@ -4,7 +4,7 @@ import Widget from 'resource:///com/github/Aylur/ags/widget.js'; import Network from "resource:///com/github/Aylur/ags/service/network.js"; import * as Utils from 'resource:///com/github/Aylur/ags/utils.js'; -const { Box, Button, Icon, Label, Revealer, Scrollable, Slider, Stack } = Widget; +const { Box, Button, Entry, Icon, Label, Revealer, Scrollable, Slider, Stack } = Widget; const { execAsync, exec } = Utils; import { MaterialIcon } from '../../.commonwidgets/materialicon.js'; import { setupCursorHover } from '../../.widgetutils/cursorhover.js'; @@ -18,57 +18,172 @@ const MATERIAL_SYMBOL_SIGNAL_STRENGTH = { 'network-wireless-signal-none-symbolic': "signal_wifi_0_bar", } +let connectAttempt = ''; + const WifiNetwork = (accessPoint) => { - console.log(accessPoint) const networkStrength = MaterialIcon(MATERIAL_SYMBOL_SIGNAL_STRENGTH[accessPoint.iconName], 'hugerass') - const connectedCheckmark = Revealer({ - transition: 'slide_left', - transitionDuration: userOptions.animations.durationSmall, - revealChild: accessPoint.active, - child: MaterialIcon('check', 'large'), - }) + const networkName = Box({ + vertical: true, + children: [ + Label({ + hpack: 'start', + label: accessPoint.ssid + }), + accessPoint.active ? Label({ + hpack: 'start', + className: 'txt-smaller txt-subtext', + label: "Selected", + }) : null, + ] + }); return Button({ - onClicked: () => execAsync(`nmcli device wifi connect ${accessPoint.bssid}`).catch(e => { + onClicked: accessPoint.active ? () => { } : () => execAsync(`nmcli device wifi connect ${accessPoint.bssid}`).catch(e => { Utils.notify({ summary: "Network", body: e, - actions: { - "Open network manager": () => execAsync("nm-connection-editor").catch(print) - } + actions: { "Open network manager": () => execAsync("nm-connection-editor").catch(print) } }); }).catch(e => console.error(e)), child: Box({ className: 'sidebar-wifinetworks-network spacing-h-10', children: [ networkStrength, - Label({ label: accessPoint.ssid }), + networkName, Box({ hexpand: true }), - connectedCheckmark, + accessPoint.active ? MaterialIcon('check', 'large') : null, ], }), - setup: setupCursorHover, + setup: accessPoint.active ? () => { } : setupCursorHover, + }) +} + +const CurrentNetwork = () => { + let authLock = false; + // console.log(Network.wifi); + const bottomSeparator = Box({ + className: 'separator-line', + }); + const networkName = Box({ + vertical: true, + hexpand: true, + children: [ + Label({ + hpack: 'start', + className: 'txt-smaller txt-subtext', + label: "Current network", + }), + Label({ + hpack: 'start', + label: Network.wifi?.ssid, + setup: (self) => self.hook(Network, (self) => { + if (authLock) return; + self.label = Network.wifi?.ssid; + }), + }), + ] + }); + const networkStatus = Box({ + children: [Label({ + vpack: 'center', + className: 'txt-subtext', + setup: (self) => self.hook(Network, (self) => { + if (authLock) return; + self.label = Network.wifi.state; + }), + })] + }) + const networkAuth = Revealer({ + transition: 'slide_down', + transitionDuration: userOptions.animations.durationLarge, + child: Box({ + className: 'margin-top-10 spacing-v-5', + vertical: true, + children: [ + Label({ + className: 'margin-left-5', + hpack: 'start', + label: "Authentication", + }), + Entry({ + className: 'sidebar-wifinetworks-auth-entry', + visibility: false, // Password dots + onAccept: (self) => { + authLock = false; + networkAuth.revealChild = false; + execAsync(`nmcli device wifi connect '${connectAttempt}' password '${self.text}'`) + .catch(print); + } + }) + ] + }), + setup: (self) => self.hook(Network, (self) => { + if (Network.wifi.state == 'failed' || Network.wifi.state == 'need_auth') { + authLock = true; + connectAttempt = Network.wifi.ssid; + self.revealChild = true; + } + }), + }); + const actualContent = Box({ + vertical: true, + className: 'spacing-v-10', + children: [ + Box({ + className: 'sidebar-wifinetworks-network', + vertical: true, + children: [ + Box({ + className: 'spacing-h-10', + children: [ + MaterialIcon('language', 'hugerass'), + networkName, + networkStatus, + + ] + }), + networkAuth, + ] + }), + bottomSeparator, + ] + }); + return Box({ + vertical: true, + children: [Revealer({ + transition: 'slide_down', + transitionDuration: userOptions.animations.durationLarge, + revealChild: Network.wifi, + child: actualContent, + })] }) } export default (props) => { - const networkList = Scrollable({ - vexpand: true, - child: Box({ - attribute: { - 'updateNetworks': (self) => { - self.children = Network.wifi?.access_points?.map(n => WifiNetwork(n)); - }, - }, - vertical: true, - className: 'spacing-v-5', - setup: (self) => self.hook(Network, self.attribute.updateNetworks), - }) + const networkList = Box({ + vertical: true, + className: 'spacing-v-10', + children: [ + Scrollable({ + vexpand: true, + child: Box({ + attribute: { + 'updateNetworks': (self) => { + self.children = Network.wifi?.access_points?.map(n => WifiNetwork(n)); + }, + }, + vertical: true, + className: 'spacing-v-5', + setup: (self) => self.hook(Network, self.attribute.updateNetworks), + }) + }) + ] }) return Box({ ...props, - className: 'spacing-v-5', + className: 'spacing-v-10', vertical: true, children: [ + CurrentNetwork(), networkList, // mainContent, // status, diff --git a/.config/ags/scss/_sidebars.scss b/.config/ags/scss/_sidebars.scss index ec8543411..d67d1308f 100644 --- a/.config/ags/scss/_sidebars.scss +++ b/.config/ags/scss/_sidebars.scss @@ -327,7 +327,7 @@ $sidebar_chat_textboxareaColor: mix($onSurfaceVariant, $surfaceVariant, 40%); @include full-rounding; @include element_decel; background-color: $layer2; - color: $onSurfaceVariant; + color: $onLayer2; margin: 0.341rem; padding: 0.205rem 0.545rem; } @@ -518,7 +518,7 @@ $colorpicker_rounding: 0.341rem; .sidebar-chat-textarea { @include normal-rounding; background-color: $layer1; - color: $onSurfaceVariant; + color: $onLayer1; padding: 0.682rem; } @@ -917,7 +917,23 @@ $waifu_image_overlay_transparency: 0.7; color: $onLayer2; } +.sidebar-wifinetworks-network:hover, +.sidebar-wifinetworks-network:focus { + background-color: $layer2Hover; +} + +.sidebar-wifinetworks-network:active { + background-color: $layer2Active; +} + .sidebar-wifinetworks-signal { @include symbolic-icon; font-size: 2.045rem; +} + +.sidebar-wifinetworks-auth-entry { + @include small-rounding; + background-color: $layer1; + color: $onLayer1; + padding: 0.682rem; } \ No newline at end of file