Skip to content

Commit 747e742

Browse files
pierre-rouanetpierre-rouanet
committed
Improve Wifi settings
1 parent 6abdf15 commit 747e742

File tree

3 files changed

+121
-33
lines changed

3 files changed

+121
-33
lines changed

‎src/reachy_mini/daemon/app/dashboard/static/js/wifi.js‎

Lines changed: 81 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,18 @@
11

2-
const refreshStatus = () => {
3-
fetch('/wifi/status')
2+
const getStatus = async () => {
3+
return await fetch('/wifi/status')
44
.then(response => response.json())
5-
.then(data => {
6-
handleStatus(data);
7-
})
85
.catch(error => {
96
console.error('Error fetching WiFi status:', error);
10-
handleStatus('error');
7+
return { mode: 'error' };
118
});
9+
};
10+
11+
const refreshStatus = async () => {
12+
const status = await getStatus();
13+
handleStatus(status);
1214

13-
fetch('/wifi/error')
15+
await fetch('/wifi/error')
1416
.then(response => response.json())
1517
.then(data => {
1618
if (data.error !== null) {
@@ -69,8 +71,7 @@ const connectToWifi = (_) => {
6971
return response.json();
7072
})
7173
.then(data => {
72-
console.log('Connection response:', data);
73-
handleStatus('busy');
74+
handleStatus({ mode: 'busy' });
7475
})
7576
.catch(error => {
7677
console.error('Error connecting to WiFi:', error);
@@ -79,34 +80,92 @@ const connectToWifi = (_) => {
7980
return false; // Prevent form submission
8081
};
8182

83+
let currentMode = null;
84+
8285
const handleStatus = (status) => {
8386
const statusDiv = document.getElementById('wifi-status');
84-
const addWifiDiv = document.getElementById('add-wifi');
85-
const busyDiv = document.getElementById('busy');
8687

87-
addWifiDiv.classList = 'hidden';
88+
const knownNetworksDiv = document.getElementById('known-networks');
89+
const knownNetworksList = document.getElementById('known-networks-list');
90+
knownNetworksDiv.classList.remove('hidden');
91+
92+
const mode = status.mode;
93+
94+
knownNetworksList.innerHTML = '';
95+
if (status.known_networks !== undefined && Array.isArray(status.known_networks)) {
96+
status.known_networks.forEach((network) => {
97+
const li = document.createElement('li');
98+
li.classList = 'flex flex-row items-center mb-1 gap-4 justify-left';
8899

89-
if (status == 'hotspot') {
100+
const nameSpan = document.createElement('span');
101+
nameSpan.innerText = network;
102+
li.appendChild(nameSpan);
103+
104+
// const removeBtn = document.createElement('span');
105+
// removeBtn.innerText = ' (remove ❌)';
106+
// removeBtn.style.cursor = 'pointer';
107+
// removeBtn.title = 'Remove network';
108+
// removeBtn.onclick = async () => {
109+
// if (confirm(`Remove network '${network}'?`)) {
110+
// removeNetwork(network);
111+
// }
112+
// };
113+
// li.appendChild(removeBtn);
114+
115+
knownNetworksList.appendChild(li);
116+
});
117+
}
118+
119+
if (mode == 'hotspot') {
90120
statusDiv.innerText = 'Hotspot mode active. 🔌';
91-
addWifiDiv.classList.remove('hidden');
92-
} else if (status == 'wlan') {
93-
statusDiv.innerText = 'Connected to WiFi. 📶';
94-
} else if (status == 'disconnected') {
121+
122+
} else if (mode == 'wlan') {
123+
if (currentMode !== null && currentMode !== 'wlan') {
124+
alert(`Connected to WiFi network: ${status.connected_network}`);
125+
}
126+
127+
statusDiv.innerText = `Connected to WiFi (SSID: ${status.connected_network}). 📶`;
128+
129+
} else if (mode == 'disconnected') {
95130
statusDiv.innerText = 'WiFi disconnected. ❌';
96-
} else if (status == 'busy') {
131+
} else if (mode == 'busy') {
97132
statusDiv.innerText = 'Changing your WiFi configuration... Please wait ⏳';
98-
busyDiv.hidden = false;
99-
} else if (status == 'error') {
133+
} else if (mode == 'error') {
100134
statusDiv.innerText = 'Error connecting to WiFi. ⚠️';
101135
} else {
102136
console.warn(`Unknown status: ${status}`);
103137
}
104138

105-
currentStatus = status;
139+
currentMode = mode;
106140
};
107141

108-
window.addEventListener('load', async () => {
142+
const removeNetwork = async (ssid) => {
143+
const status = await getStatus();
144+
145+
// TODO:
146+
// if ssid !== status.connected_network:
147+
// remove connection
148+
// else:
149+
// refresh nmcli? go back to hotspot if needed?
150+
};
151+
152+
const cleanAndRefresh = async () => {
153+
const statusDiv = document.getElementById('wifi-status');
154+
statusDiv.innerText = 'Checking WiFi configuration...';
155+
156+
const knownNetworksDiv = document.getElementById('known-networks');
157+
knownNetworksDiv.classList.add('hidden');
158+
159+
const addWifi = document.getElementById('add-wifi');
160+
addWifi.classList.add('hidden');
161+
109162
await scanAndListWifiNetworks();
110163
await refreshStatus();
164+
165+
addWifi.classList.remove('hidden');
166+
};
167+
168+
window.addEventListener('load', async () => {
169+
await cleanAndRefresh();
111170
setInterval(refreshStatus, 1000);
112171
});

‎src/reachy_mini/daemon/app/dashboard/templates/sections/wifi.html‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,22 @@
11
<div class="app-section">
2-
<div class="app-section-title">Setup your WiFi</div>
2+
<div class="flex flex-row items-center gap-2">
3+
<div class="app-section-title">Setup your WiFi</div>
4+
<button id="refresh-wifi" title="Refresh" class="p-1 rounded hover:bg-gray-200 focus:outline-none"
5+
onclick="cleanAndRefresh()">
6+
🔄
7+
</button>
8+
</div>
39

4-
<div class="flex p-4 gap-4">
5-
<div class="wifi-status">Current Status:</div>
6-
<div id="wifi-status" class="wifi-status-info">Checking WiFi configuration...</div>
10+
<div class="flex flex-col p-4 gap-4">
11+
<div id="wifi-status" class="wifi-status-info w-full">Checking WiFi configuration...</div>
12+
<div id="known-networks" class="wifi-status-info hidden w-full">
13+
Known Networks:
14+
<ul id="known-networks-list" class="list-disc list-inside px-4"></ul>
15+
</div>
716
</div>
817
<div id="add-wifi" class="hidden">
918
<div class="py-4 flex flex-col max-w-md">
10-
<div class="app-section-title mb-2">Add your WiFi</div>
19+
<div class="app-section-title mb-2">Add new WiFi</div>
1120

1221
<div class="flex flex-row p-4">
1322
<form id="wifi-form" class="max-w-md" onsubmit="return false;">
@@ -33,10 +42,5 @@
3342
</form>
3443
</div>
3544
</div>
36-
37-
<div id="busy" hidden>
38-
<h2>Operation in progress...</h2>
39-
<p>Please wait while we set up your connection.</p>
40-
</div>
4145
</div>
4246
</div>

‎src/reachy_mini/daemon/app/routers/wifi_config.py‎

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66

77
import nmcli
88
from fastapi import APIRouter, HTTPException
9+
from pydantic import BaseModel
910

1011
HOTSPOT_SSID = "reachy-mini-ap"
1112
HOTSPOT_PASSWORD = "reachy-mini"
@@ -29,7 +30,14 @@ class WifiMode(Enum):
2930
BUSY = "busy"
3031

3132

32-
@router.get("/status")
33+
class WifiStatus(BaseModel):
34+
"""WiFi status model."""
35+
36+
mode: WifiMode
37+
known_networks: list[str]
38+
connected_network: str | None
39+
40+
3341
def get_current_wifi_mode() -> WifiMode:
3442
"""Get the current WiFi mode."""
3543
if busy_lock.locked():
@@ -44,6 +52,23 @@ def get_current_wifi_mode() -> WifiMode:
4452
return WifiMode.DISCONNECTED
4553

4654

55+
@router.get("/status")
56+
def get_wifi_status() -> WifiStatus:
57+
"""Get the current WiFi status."""
58+
mode = get_current_wifi_mode()
59+
60+
connections = get_wifi_connections()
61+
known_networks = [c.name for c in connections if c.name != "Hotspot"]
62+
63+
connected_network = next((c.name for c in connections if c.device != "--"), None)
64+
65+
return WifiStatus(
66+
mode=mode,
67+
known_networks=known_networks,
68+
connected_network=connected_network,
69+
)
70+
71+
4772
@router.get("/error")
4873
def get_last_wifi_error() -> dict[str, str | None]:
4974
"""Get the last WiFi error."""

0 commit comments

Comments
 (0)