Merge pull request #1819 from Ansuel/ddns-performance
[project/luci.git] / modules / luci-mod-admin-full / luasrc / view / admin_network / wifi_overview.htm
1 <%#
2 Copyright 2008-2009 Steven Barth <steven@midlink.org>
3 Copyright 2008-2015 Jo-Philipp Wich <jow@openwrt.org>
4 Licensed to the public under the Apache License 2.0.
5 -%>
6
7 <%-
8
9 local ip = require "luci.ip"
10 local fs = require "nixio.fs"
11 local utl = require "luci.util"
12 local uci = require "luci.model.uci".cursor()
13 local ntm = require "luci.model.network"
14
15 local has_iwinfo = pcall(require, "iwinfo")
16
17 ntm.init(uci)
18
19 function guess_wifi_hw(dev)
20 local bands = ""
21 local ifname = dev:name()
22 local name, idx = ifname:match("^([a-z]+)(%d+)")
23 idx = tonumber(idx)
24
25 if has_iwinfo then
26 local bl = dev.iwinfo.hwmodelist
27 if bl and next(bl) then
28 if bl.a then bands = bands .. "a" end
29 if bl.b then bands = bands .. "b" end
30 if bl.g then bands = bands .. "g" end
31 if bl.n then bands = bands .. "n" end
32 if bl.ac then bands = bands .. "ac" end
33 end
34
35 local hw = dev.iwinfo.hardware_name
36 if hw then
37 return "%s 802.11%s" %{ hw, bands }
38 end
39 end
40
41 -- wl.o
42 if name == "wl" then
43 local name = translatef("Broadcom 802.11%s Wireless Controller", bands)
44 local nm = 0
45
46 local fd = nixio.open("/proc/bus/pci/devices", "r")
47 if fd then
48 local ln
49 for ln in fd:linesource() do
50 if ln:match("wl$") then
51 if nm == idx then
52 local version = ln:match("^%S+%s+%S%S%S%S([0-9a-f]+)")
53 name = translatef(
54 "Broadcom BCM%04x 802.11 Wireless Controller",
55 tonumber(version, 16)
56 )
57
58 break
59 else
60 nm = nm + 1
61 end
62 end
63 end
64 fd:close()
65 end
66
67 return name
68
69 -- ralink
70 elseif name == "ra" then
71 return translatef("RaLink 802.11%s Wireless Controller", bands)
72
73 -- hermes
74 elseif name == "eth" then
75 return translate("Hermes 802.11b Wireless Controller")
76
77 -- hostap
78 elseif name == "wlan" and fs.stat("/proc/net/hostap/" .. ifname, "type") == "dir" then
79 return translate("Prism2/2.5/3 802.11b Wireless Controller")
80
81 -- dunno yet
82 else
83 return translatef("Generic 802.11%s Wireless Controller", bands)
84 end
85 end
86
87 local devices = ntm:get_wifidevs()
88 local netlist = { }
89 local netdevs = { }
90
91 local dev
92 for _, dev in ipairs(devices) do
93 local net
94 for _, net in ipairs(dev:get_wifinets()) do
95 netlist[#netlist+1] = net:id()
96 netdevs[net:id()] = dev:name()
97 end
98 end
99 -%>
100
101 <%+header%>
102
103 <% if not has_iwinfo then %>
104 <div class="alert-message warning">
105 <h4><%:Package libiwinfo required!%></h4>
106 <p><%_The <em>libiwinfo-lua</em> package is not installed. You must install this component for working wireless configuration!%></p>
107 </div>
108 <% end %>
109
110 <script type="text/javascript" src="<%=resource%>/cbi.js"></script>
111 <script type="text/javascript">//<![CDATA[
112 var wifidevs = <%=luci.http.write_json(netdevs)%>;
113
114 var is_reconnecting = false;
115
116 function nowrap(s) {
117 return s.replace(/ /g, '&#160;');
118 }
119
120 function wifirate(bss, rx) {
121 var p = rx ? 'rx_' : 'tx_',
122 s = '%.1f <%:Mbit/s%>, %d<%:MHz%>'
123 .format(bss[p+'rate'] / 1000, bss[p+'mhz']),
124 ht = bss[p+'ht'], vht = bss[p+'vht'],
125 mhz = bss[p+'mhz'], nss = bss[p+'nss'],
126 mcs = bss[p+'mcs'], sgi = bss[p+'short_gi'];
127
128 if (ht || vht) {
129 if (vht) s += ', VHT-MCS %d'.format(mcs);
130 if (nss) s += ', VHT-NSS %d'.format(nss);
131 if (ht) s += ', MCS %s'.format(mcs);
132 if (sgi) s += ', <%:Short GI%>';
133 }
134
135 return s;
136 }
137
138 function wifi_shutdown(id, toggle) {
139 var reconnect = (toggle.getAttribute('active') == 'false');
140
141 if (!reconnect && !confirm(String.format('<%:Really shut down network?\nYou might lose access to this device if you are connected via this interface.%>')))
142 return;
143
144 is_reconnecting = true;
145
146 var s = document.getElementById('iw-rc-status');
147 if (s)
148 {
149 s.parentNode.style.display = 'block';
150 s.innerHTML = '<%:Waiting for changes to be applied...%>';
151 }
152
153 for (var net in wifidevs)
154 {
155 var st = document.getElementById(net + '-iw-status');
156 if (st)
157 st.innerHTML = '<em><%:Wireless is restarting...%></em>';
158 }
159
160 (new XHR()).post('<%=url('admin/network')%>/wireless_' + (reconnect ? 'reconnect' : 'shutdown') + '/' + id, { token: '<%=token%>' },
161 function(x)
162 {
163 if (s)
164 {
165 s.innerHTML = reconnect
166 ? '<%:Wireless restarted%>'
167 : '<%:Wireless shut down%>';
168
169 window.setTimeout(function() {
170 s.parentNode.style.display = 'none';
171 is_reconnecting = false;
172 }, 1000);
173 }
174 }
175 );
176 }
177
178 function wifi_delete(id) {
179 if (!confirm('<%:Really delete this wireless network? The deletion cannot be undone!\nYou might lose access to this device if you are connected via this network.%>'))
180 return;
181
182 (new XHR()).post('<%=url('admin/network/wireless_delete')%>/' + id, { token: '<%=token%>' },
183 function(x) {
184 location.href = '<%=url('admin/network/wireless')%>';
185 }
186 );
187 }
188
189 var hosts = <%=luci.http.write_json(luci.sys.net.host_hints())%>;
190
191 XHR.poll(5, '<%=url('admin/network/wireless_status', table.concat(netlist, ","))%>', null,
192 function(x, st)
193 {
194 if (st)
195 {
196 var assoctable = document.getElementById('iw-assoclist');
197 if (assoctable)
198 while (assoctable.firstElementChild !== assoctable.lastElementChild)
199 assoctable.removeChild(assoctable.lastElementChild);
200
201 var devup = { };
202 var rowstyle = 1;
203
204 for( var i = 0; i < st.length; i++ )
205 {
206 var iw = st[i];
207 var is_assoc = (iw.bssid && iw.bssid != '00:00:00:00:00:00' && iw.channel && iw.mode != 'Unknown' && !iw.disabled);
208 var p = iw.quality;
209 var q = is_assoc ? p : -1;
210
211 var icon;
212 if (q < 0)
213 icon = "<%=resource%>/icons/signal-none.png";
214 else if (q == 0)
215 icon = "<%=resource%>/icons/signal-0.png";
216 else if (q < 25)
217 icon = "<%=resource%>/icons/signal-0-25.png";
218 else if (q < 50)
219 icon = "<%=resource%>/icons/signal-25-50.png";
220 else if (q < 75)
221 icon = "<%=resource%>/icons/signal-50-75.png";
222 else
223 icon = "<%=resource%>/icons/signal-75-100.png";
224
225 if (!devup[wifidevs[iw.id]])
226 devup[wifidevs[iw.id]] = is_assoc;
227
228 var sig = document.getElementById(iw.id + '-iw-signal');
229 if (sig)
230 sig.innerHTML = String.format(
231 '<span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%>"><img src="%s" /> %d%%</span>',
232 iw.signal, iw.noise, icon, p
233 );
234
235 var toggle = document.getElementById(iw.id + '-iw-toggle');
236 if (toggle)
237 {
238 if (!iw.disabled)
239 {
240 toggle.className = 'cbi-button cbi-button-reset';
241 toggle.value = '<%:Disable%>';
242 toggle.title = '<%:Shutdown this network%>';
243 }
244 else
245 {
246 toggle.className = 'cbi-button cbi-button-reload';
247 toggle.value = '<%:Enable%>';
248 toggle.title = '<%:Activate this network%>';
249 }
250
251 toggle.setAttribute('active', !iw.disabled);
252 }
253
254 var info = document.getElementById(iw.id + '-iw-status');
255 if (info)
256 {
257 if (is_assoc)
258 info.innerHTML = String.format(
259 '<strong><%:SSID%>:</strong> %h | ' +
260 '<strong><%:Mode%>:</strong> %s<br />' +
261 '<strong><%:BSSID%>:</strong> %s | ' +
262 '<strong><%:Encryption%>:</strong> %s',
263 iw.ssid, iw.mode, iw.bssid,
264 iw.encryption ? iw.encryption : '<%:None%>'
265 );
266 else
267 info.innerHTML = String.format(
268 '<strong><%:SSID%>:</strong> %h | ' +
269 '<strong><%:Mode%>:</strong> %s<br />' +
270 '<em>%s</em>',
271 iw.ssid || '?', iw.mode,
272 is_reconnecting
273 ? '<em><%:Wireless is restarting...%></em>'
274 : '<em><%:Wireless is disabled or not associated%></em>'
275 );
276 }
277
278 var dev = document.getElementById(wifidevs[iw.id] + '-iw-devinfo');
279 if (dev)
280 {
281 if (is_assoc)
282 dev.innerHTML = String.format(
283 '<strong><%:Channel%>:</strong> %s (%s <%:GHz%>) | ' +
284 '<strong><%:Bitrate%>:</strong> %s <%:Mbit/s%>',
285 iw.channel ? iw.channel : '?',
286 iw.frequency ? iw.frequency : '?',
287 iw.bitrate ? iw.bitrate : '?'
288 );
289 else
290 dev.innerHTML = '';
291 }
292
293 if (assoctable)
294 {
295 var assoclist = [ ];
296 for (var bssid in iw.assoclist)
297 {
298 assoclist.push(iw.assoclist[bssid]);
299 assoclist[assoclist.length-1].bssid = bssid;
300 }
301
302 assoclist.sort(function(a, b) { a.bssid < b.bssid });
303
304 for (var j = 0; j < assoclist.length; j++)
305 {
306 var icon;
307 var q = (-1 * (assoclist[j].noise - assoclist[j].signal)) / 5;
308 if (q < 1)
309 icon = "<%=resource%>/icons/signal-0.png";
310 else if (q < 2)
311 icon = "<%=resource%>/icons/signal-0-25.png";
312 else if (q < 3)
313 icon = "<%=resource%>/icons/signal-25-50.png";
314 else if (q < 4)
315 icon = "<%=resource%>/icons/signal-50-75.png";
316 else
317 icon = "<%=resource%>/icons/signal-75-100.png";
318
319 var host = hosts[assoclist[j].bssid],
320 name = host ? (host.name || host.ipv4 || host.ipv6) : null,
321 hint = (host && host.name && (host.ipv4 || host.ipv6)) ? (host.ipv4 || host.ipv6) : null;
322
323 assoctable.appendChild(E('<div class="tr cbi-section-table-row cbi-rowstyle-%d">'.format(rowstyle), [
324 E('<div class="td"><span class="ifacebadge" title="%q"><img src="<%=resource%>/icons/wifi.png" /> %h</span></div>'
325 .format(iw.device.name, iw.ifname)),
326 E('<div class="td" style="white-space:nowrap">%h</div>'
327 .format(iw.ssid || '?')),
328 E('<div class="td">%h</div>'
329 .format(assoclist[j].bssid)),
330 E('<div class="td">', hint ? '<div style="max-width:200px;overflow:hidden;text-overflow:ellipsis">%h (%h)</div>'
331 .format(name || '?', hint) : (name || '?')),
332 E('<div class="td"><span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%> / <%:SNR%>: %d"><img src="%s" /> %d / %d <%:dBm%></span></div>'
333 .format(assoclist[j].signal, assoclist[j].noise, assoclist[j].signal - assoclist[j].noise, icon, assoclist[j].signal, assoclist[j].noise)),
334 E('<div class="td">', [
335 E('<span style="white-space:nowrap">', wifirate(assoclist[j], true)),
336 E('<br />'),
337 E('<span style="white-space:nowrap">', wifirate(assoclist[j], false))
338 ])
339 ]));
340
341 rowstyle = (rowstyle == 1) ? 2 : 1;
342 }
343 }
344 }
345
346 if (assoctable && assoctable.firstElementChild === assoctable.lastElementChild)
347 assoctable.appendChild(E('<div class="tr cbi-section-table-row"><div class="td"><em><br /><%:No information available%></em></div></div>'));
348
349 for (var dev in devup)
350 {
351 var img = document.getElementById(dev + '-iw-upstate');
352 if (img)
353 img.src = '<%=resource%>/icons/wifi_big' + (devup[dev] ? '' : '_disabled') + '.png';
354 }
355 }
356 }
357 );
358 //]]></script>
359
360 <h2 name="content"><%:Wireless Overview%></h2>
361
362 <fieldset class="cbi-section" style="display:none">
363 <legend><%:Reconnecting interface%></legend>
364 <img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" />
365 <span id="iw-rc-status"><%:Waiting for changes to be applied...%></span>
366 </fieldset>
367
368 <div class="cbi-map">
369
370 <% for _, dev in ipairs(devices) do local nets = dev:get_wifinets() %>
371 <!-- device <%=dev:name()%> -->
372 <fieldset class="cbi-section">
373 <div class="table cbi-section-table" style="margin:10px; empty-cells:hide">
374 <!-- physical device -->
375 <div class="tr">
376 <div class="td">
377 <img src="<%=resource%>/icons/wifi_big_disabled.png" id="<%=dev:name()%>-iw-upstate" />
378 </div>
379 <div class="td left">
380 <big><strong><%=guess_wifi_hw(dev)%> (<%=dev:name()%>)</strong></big><br />
381 <span id="<%=dev:name()%>-iw-devinfo"></span>
382 </div>
383 <div class="td right">
384 <form action="<%=url('admin/network/wireless_join')%>" method="post" class="inline">
385 <input type="hidden" name="device" value="<%=dev:name()%>" />
386 <input type="hidden" name="token" value="<%=token%>" />
387 <input type="submit" class="cbi-button cbi-button-find" style="width:100px" title="<%:Find and join network%>" value="<%:Scan%>" />
388 </form>
389 <form action="<%=url('admin/network/wireless_add')%>" method="post" class="inline">
390 <input type="hidden" name="device" value="<%=dev:name()%>" />
391 <input type="hidden" name="token" value="<%=token%>" />
392 <input type="submit" class="cbi-button cbi-button-add" style="width:100px" title="<%:Provide new network%>" value="<%:Add%>" />
393 </form>
394 </div>
395 </div>
396 <!-- /physical device -->
397
398 <!-- network list -->
399 <% if #nets > 0 then %>
400 <% for i, net in ipairs(nets) do %>
401 <div class="tr cbi-section-table-row cbi-rowstyle-<%=1 + ((i-1) % 2)%>">
402 <div class="td" id="<%=net:id()%>-iw-signal">
403 <span class="ifacebadge" title="<%:Not associated%>"><img src="<%=resource%>/icons/signal-none.png" /> 0%</span>
404 </div>
405 <div class="td left" id="<%=net:id()%>-iw-status">
406 <em><%:Collecting data...%></em>
407 </div>
408 <div class="td right">
409 <input id="<%=net:id()%>-iw-toggle" type="button" class="cbi-button cbi-button-reload" style="width:100px" onclick="wifi_shutdown('<%=net:id()%>', this)" title="<%:Delete this network%>" value="<%:Enable%>" />
410 <input type="button" class="cbi-button cbi-button-edit" style="width:100px" onclick="location.href='<%=net:adminlink()%>'" title="<%:Edit this network%>" value="<%:Edit%>" />
411 <input type="button" class="cbi-button cbi-button-remove" style="width:100px" onclick="wifi_delete('<%=net:id()%>')" title="<%:Delete this network%>" value="<%:Remove%>" />
412 </div>
413 </div>
414 <% end %>
415 <% else %>
416 <div class="tr cbi-section-table-row cbi-rowstyle-2">
417 <div class="td left">
418 <em><%:No network configured on this device%></em>
419 </div>
420 </div>
421 <% end %>
422 <!-- /network list -->
423 </div>
424 </fieldset>
425 <!-- /device <%=dev:name()%> -->
426 <% end %>
427
428
429 <h2><%:Associated Stations%></h2>
430
431 <fieldset class="cbi-section">
432 <div class="table cbi-section-table valign-middle" style="margin:10px" id="iw-assoclist">
433 <div class="tr cbi-section-table-titles">
434 <div class="th cbi-section-table-cell"></div>
435 <div class="th cbi-section-table-cell"><%:SSID%></div>
436 <div class="th cbi-section-table-cell"><%:MAC-Address%></div>
437 <div class="th cbi-section-table-cell"><%:Host%></div>
438 <div class="th cbi-section-table-cell"><%:Signal%> / <%:Noise%></div>
439 <div class="th cbi-section-table-cell"><%:RX Rate%> / <%:TX Rate%></div>
440 </div>
441 <div class="tr cbi-section-table-row cbi-rowstyle-2">
442 <div class="td">
443 <em><%:Collecting data...%></em>
444 </div>
445 </div>
446 </div>
447 </fieldset>
448 </div>
449
450 <%+footer%>