diff --git a/Helpers/Network.qml b/Helpers/Network.qml index 5d608c0..7b3a0bc 100644 --- a/Helpers/Network.qml +++ b/Helpers/Network.qml @@ -8,10 +8,21 @@ Singleton { id: root readonly property list devices: Networking.devices.values - readonly property list networks: initialBuildNetworks() + readonly property list networks: { + const list = [] + for (const d of wifiDevices) + list.push(...d.networks.values) + return list; + } property bool scanning: false readonly property list wifiDevices: devices.filter(d => wifiDevice(d)) readonly property bool wifiEnabled: Networking.wifiEnabled + property bool active: false + + onActiveChanged: { + for (const d of wifiDevices) + d.scannerEnabled = active; + } // Original code @@ -53,37 +64,8 @@ Singleton { } // - function initialBuildNetworks(): void { - const init = []; - for (const d of wifiDevices) { - d.scannerEnabled = true; - init.push(...d.networks.values); - d.scannerEnabled = false; - } - - networks = init; - } - function isSecure(security): bool { - return !(security === WifiSecurityType.Open); - } - - function rebuildNetworks(): void { - if (!scanning) - return; - - const next = []; - for (const d of wifiDevices) { - next.push(...d.networks.values); - } - - networks = next; - } - - function rescanWifi(): void { - scanning = true; - setScan(true); - scanTimer.restart(); + return (security === WifiSecurityType.WpaPsk || security === WifiSecurityType.Wpa2Psk || security === WifiSecurityType.Sae); } function setScan(value: bool): void { @@ -99,27 +81,4 @@ Singleton { function wifiDevice(dev): bool { return dev.type === DeviceType.Wifi; } - - Timer { - id: scanTimer - - interval: 5000 - repeat: false - - onTriggered: { - root.rebuildNetworks(); - root.setScan(false); - root.scanning = false; - } - } - - Timer { - interval: 500 - repeat: true - running: root.scanning - - onTriggered: { - root.rebuildNetworks(); - } - } } diff --git a/Modules/Settings/Pages/Panels/Bar/BarStatusIcons.qml b/Modules/Settings/Pages/Panels/Bar/BarStatusIcons.qml index b2655d5..8a73337 100644 --- a/Modules/Settings/Pages/Panels/Bar/BarStatusIcons.qml +++ b/Modules/Settings/Pages/Panels/Bar/BarStatusIcons.qml @@ -39,13 +39,14 @@ PageBase { onToggled: Config.bar.tray.showMicrophone = checked } + ToggleRow { + checked: Config.bar.tray.showNetwork + text: qsTr("Network") + + onToggled: Config.bar.tray.showNetwork = checked + } + //////// FOR LATER: - // ToggleRow { - // checked: Config.bar.tray.showNetwork - // text: qsTr("Network") - // - // onToggled: Config.bar.tray.showNetwork = checked - // } // // ToggleRow { // checked: Config.bar.tray.showWifi @@ -94,5 +95,15 @@ PageBase { onToggled: Config.bar.popouts.upower = checked } + + ToggleRow { + checked: Config.bar.popouts.network + last: true + settingAnchor: "bar-status-network-popout" + subtext: qsTr("Show a details popout when hovering the network icon") + text: qsTr("Network popout on hover") + + onToggled: Config.bar.popouts.network = checked + } } } diff --git a/Modules/SysTray/Popouts/NetworkPopout.qml b/Modules/SysTray/Popouts/NetworkPopout.qml index 63ce794..12c63ef 100644 --- a/Modules/SysTray/Popouts/NetworkPopout.qml +++ b/Modules/SysTray/Popouts/NetworkPopout.qml @@ -18,6 +18,9 @@ CustomClippingRect { implicitWidth: 500 + 8 * 2 radius: (20 - Appearance.padding.small) * Appearance.rounding.scale + Component.onCompleted: Network.active = true + Component.onDestruction: Network.active = false + ColumnLayout { id: networkPopContent @@ -59,9 +62,104 @@ CustomClippingRect { anchors.right: parent.right anchors.top: networkPopContent.bottom + CustomText { + text: qsTr("Known networks") + } + Repeater { model: ScriptModel { - values: [...Network.networks] + values: [...Network.networks].filter(n => n.known) + } + + RowLayout { + id: knownNetworkItem + + required property var modelData + + Layout.fillWidth: true + Layout.preferredHeight: visible ? implicitHeight : 0 + Layout.rightMargin: Appearance.padding.extraSmall + opacity: 0 + scale: 0.7 + spacing: Appearance.spacing.small + + Behavior on opacity { + Anim { + type: Anim.DefaultEffects + } + } + Behavior on scale { + Anim { + } + } + + Component.onCompleted: { + opacity = 1; + scale = 1; + } + + MaterialIcon { + color: knownNetworkItem.modelData.active ? DynamicColors.palette.m3primary : DynamicColors.palette.m3onSurfaceVariant + text: Icons.getNetworkIcon(knownNetworkItem.modelData.signalStrength * 100, Network.isSecure(knownNetworkItem.modelData.security)) + } + + CustomText { + Layout.fillWidth: true + Layout.leftMargin: Appearance.spacing.extraSmall + Layout.rightMargin: Appearance.spacing.extraSmall + color: knownNetworkItem.modelData.active ? DynamicColors.palette.m3primary : DynamicColors.palette.m3onSurface + elide: Text.ElideRight + text: knownNetworkItem.modelData.name + } + + CustomRect { + color: Qt.alpha(DynamicColors.palette.m3primary, knownNetworkItem.modelData.active ? 1 : 0) + implicitHeight: knownWirelessConnectIcon.implicitHeight + Appearance.padding.extraSmall + implicitWidth: implicitHeight + radius: Appearance.rounding.full + + // CircularIndicator { + // anchors.fill: parent + // running: knownNetworkItem.loading + // } + + StateLayer { + color: knownNetworkItem.modelData.active ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface + + onClicked: {} + } + + MaterialIcon { + id: knownWirelessConnectIcon + + anchors.centerIn: parent + animate: true + color: knownNetworkItem.modelData.active ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface + text: knownNetworkItem.modelData.active ? "link_off" : "link" + + // opacity: knownNetworkItem.loading ? 0 : 1 + + Behavior on opacity { + Anim { + type: Anim.DefaultEffects + } + } + } + } + } + } + + Item { + id: spacer + + Layout.preferredHeight: networkRepeater.count > 0 ? Appearance.spacing.normal : 0 + } + + Repeater { + id: networkRepeater + + model: ScriptModel { + values: [...Network.networks].filter(n => !n.known) } RowLayout { @@ -119,9 +217,7 @@ CustomClippingRect { StateLayer { color: networkItem.modelData.active ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface - onClicked: { - console.log(Network.devices[1].scannerEnabled, Network.devices[2].scannerEnabled, Network.devices[3].scannerEnabled, Network.devices[4].scannerEnabled); - } + onClicked: {} } MaterialIcon { @@ -143,59 +239,6 @@ CustomClippingRect { } } } - - CustomRect { - Layout.fillWidth: true - Layout.preferredHeight: visible ? implicitHeight : 0 - Layout.topMargin: visible ? Appearance.spacing.small : 0 - color: DynamicColors.palette.m3primaryContainer - implicitHeight: rescanBtn.implicitHeight + Appearance.padding.small - radius: Appearance.rounding.full - - StateLayer { - color: DynamicColors.palette.m3onPrimaryContainer - enabled: !Network.scanning - - onClicked: Network.rescanWifi() - } - - RowLayout { - id: rescanBtn - - anchors.centerIn: parent - opacity: Network.scanning ? 0 : 1 - spacing: Appearance.spacing.small - - Behavior on opacity { - Anim { - type: Anim.DefaultEffects - } - } - - MaterialIcon { - id: scanIcon - - Layout.topMargin: Math.round(fontInfo.pointSize * 0.0575) - animate: true - color: DynamicColors.palette.m3onPrimaryContainer - text: "wifi_find" - } - - CustomText { - Layout.topMargin: -Math.round(scanIcon.fontInfo.pointSize * 0.0575) - color: DynamicColors.palette.m3onPrimaryContainer - text: qsTr("Rescan networks") - } - } - - CircularIndicator { - anchors.centerIn: parent - bgColor: "transparent" - implicitSize: parent.implicitHeight - Appearance.padding.large - running: Network.scanning - strokeWidth: Appearance.padding.extraSmall / 2 - } - } } component Toggle: RowLayout {