modules/admin-full: display wifi rates in assoclist tables
[project/luci.git] / modules / admin-full / luasrc / view / admin_network / wifi_overview.htm
index 06725c1b910bbe9bb018f2f9d1b566bc36c0af45..22d27cb1cd59c3eb754cf62a90341e62f511d4f7 100644 (file)
@@ -113,13 +113,12 @@ $Id$
 <% if not has_iwinfo then %>
        <div class="errorbox">
                <strong><%:Package libiwinfo required!%></strong><br />
-               <%_The <em>libiwinfo</em> package is not installed. You must install this component for working wireless configuration!%>
+               <%_The <em>libiwinfo-lua</em> package is not installed. You must install this component for working wireless configuration!%>
        </div>
 <% end %>
 
 <script type="text/javascript" src="<%=resource%>/cbi.js"></script>
 <script type="text/javascript">//<![CDATA[
-       var iwxhr = new XHR();
        var wifidevs = <%=luci.http.write_json(netdevs)%>;
        var arptable = <%=luci.http.write_json(arpcache)%>;
 
@@ -147,8 +146,7 @@ $Id$
                                st.innerHTML = '<em><%:Wireless is restarting...%></em>';
                }
 
-               var rcxhr = new XHR();
-               rcxhr.get('<%=luci.dispatcher.build_url("admin", "network")%>/wireless_' + (reconnect ? 'reconnect' : 'shutdown') + '/' + id, null,
+               XHR.get('<%=luci.dispatcher.build_url("admin", "network")%>/wireless_' + (reconnect ? 'reconnect' : 'shutdown') + '/' + id, null,
                        function(x)
                        {
                                if (s)
@@ -166,182 +164,185 @@ $Id$
                );
        }
 
-       (function() {
-               var func = arguments.callee;
-
-               iwxhr.get('<%=luci.dispatcher.build_url("admin", "network", "wireless_status", table.concat(netlist, ","))%>', null,
-                       function(x, st)
+       XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "network", "wireless_status", table.concat(netlist, ","))%>', null,
+               function(x, st)
+               {
+                       if (st)
                        {
-                               if (st)
-                               {
-                                       var assoctable = document.getElementById('iw-assoclist');
-                                       if (assoctable)
-                                               while (assoctable.rows.length > 1)
-                                                       assoctable.rows[1].parentNode.removeChild(assoctable.rows[1]);
+                               var assoctable = document.getElementById('iw-assoclist');
+                               if (assoctable)
+                                       while (assoctable.rows.length > 1)
+                                               assoctable.rows[1].parentNode.removeChild(assoctable.rows[1]);
 
-                                       var devup = { };
-                                       var rowstyle = 1;
+                               var devup = { };
+                               var rowstyle = 1;
 
-                                       for( var i = 0; i < st.length; i++ )
+                               for( var i = 0; i < st.length; i++ )
+                               {
+                                       var iw = st[i];
+                                       var is_assoc = (iw.bssid && iw.bssid != '00:00:00:00:00:00' && iw.channel);
+                                       var p = iw.quality;
+                                       var q = is_assoc ? p : -1;
+
+                                       var icon;
+                                       if (q < 0)
+                                               icon = "<%=resource%>/icons/signal-none.png";
+                                       else if (q == 0)
+                                               icon = "<%=resource%>/icons/signal-0.png";
+                                       else if (q < 25)
+                                               icon = "<%=resource%>/icons/signal-0-25.png";
+                                       else if (q < 50)
+                                               icon = "<%=resource%>/icons/signal-25-50.png";
+                                       else if (q < 75)
+                                               icon = "<%=resource%>/icons/signal-50-75.png";
+                                       else
+                                               icon = "<%=resource%>/icons/signal-75-100.png";
+
+                                       if (!devup[wifidevs[iw.id]])
+                                               devup[wifidevs[iw.id]] = is_assoc;
+
+                                       var sig = document.getElementById(iw.id + '-iw-signal');
+                                       if (sig)
+                                               sig.innerHTML = String.format(
+                                                       '<img src="%s" title="<%:Signal%>: %d dBm / <%:Noise%>: %d dBm" /><br />' +
+                                                       '<small>%d%%</small>', icon, iw.signal, iw.noise, p
+                                               );
+
+                                       var toggle = document.getElementById(iw.id + '-iw-toggle');
+                                       if (toggle)
                                        {
-                                               var iw = st[i];
-                                               var is_assoc = (iw.bssid && iw.bssid != '00:00:00:00:00:00' && iw.channel);
-                                               var p = iw.quality;
-                                               var q = is_assoc ? p : -1;
-
-                                               var icon;
-                                               if (q < 0)
-                                                       icon = "<%=resource%>/icons/signal-none.png";
-                                               else if (q == 0)
-                                                       icon = "<%=resource%>/icons/signal-0.png";
-                                               else if (q < 25)
-                                                       icon = "<%=resource%>/icons/signal-0-25.png";
-                                               else if (q < 50)
-                                                       icon = "<%=resource%>/icons/signal-25-50.png";
-                                               else if (q < 75)
-                                                       icon = "<%=resource%>/icons/signal-50-75.png";
+                                               if (is_assoc)
+                                               {
+                                                       toggle.className = 'cbi-button cbi-button-reset';
+                                                       toggle.value = '<%:Disable%>';
+                                                       toggle.title = '<%:Shutdown this network%>';
+                                               }
                                                else
-                                                       icon = "<%=resource%>/icons/signal-75-100.png";
+                                               {
+                                                       toggle.className = 'cbi-button cbi-button-reload';
+                                                       toggle.value = '<%:Enable%>';
+                                                       toggle.title = '<%:Activate this network%>';
+                                               }
 
-                                               if (!devup[wifidevs[iw.id]])
-                                                       devup[wifidevs[iw.id]] = is_assoc;
+                                               toggle.setAttribute('active', is_assoc);
+                                       }
 
-                                               var sig = document.getElementById(iw.id + '-iw-signal');
-                                               if (sig)
-                                                       sig.innerHTML = String.format(
-                                                               '<img src="%s" title="<%:Signal%>: %d dBm / <%:Noise%>: %d dBm" /><br />' +
-                                                               '<small>%d%%</small>', icon, iw.signal, iw.noise, p
+                                       var info = document.getElementById(iw.id + '-iw-status');
+                                       if (info)
+                                       {
+                                               if (is_assoc)
+                                                       info.innerHTML = String.format(
+                                                               '<strong><%:SSID%>:</strong> %h | ' +
+                                                               '<strong><%:Mode%>:</strong> %s<br />' +
+                                                               '<strong><%:BSSID%>:</strong> %s | ' +
+                                                               '<strong><%:Encryption%>:</strong> %s',
+                                                                       iw.ssid, iw.mode, iw.bssid,
+                                                                       iw.encryption ? iw.encryption : '<%:None%>'
                                                        );
+                                               else
+                                                       info.innerHTML = String.format(
+                                                               '<strong><%:SSID%>:</strong> %h | ' +
+                                                               '<strong><%:Mode%>:</strong> %s<br />' +
+                                                               '<em>%s</em>',
+                                                                       iw.ssid || '?', iw.mode,
+                                                                       is_reconnecting
+                                                                               ? '<em><%:Wireless is restarting...%></em>'
+                                                                               : '<em><%:Wireless is disabled or not associated%></em>'
+                                                       );
+                                       }
 
-                                               var toggle = document.getElementById(iw.id + '-iw-toggle');
-                                               if (toggle)
-                                               {
-                                                       if (is_assoc)
-                                                       {
-                                                               toggle.style.backgroundImage = 'url(<%=resource%>/cbi/reset.gif)';
-                                                               toggle.value = '<%:Disable%>';
-                                                               toggle.title = '<%:Shutdown this network%>';
-                                                       }
-                                                       else
-                                                       {
-                                                               toggle.style.backgroundImage = 'url(<%=resource%>/cbi/reload.gif)';
-                                                               toggle.value = '<%:Enable%>';
-                                                               toggle.title = '<%:Activate this network%>';
-
-                                                       }
-
-                                                       toggle.setAttribute('active', is_assoc);
-                                               }
+                                       var dev = document.getElementById(wifidevs[iw.id] + '-iw-devinfo');
+                                       if (dev)
+                                       {
+                                               if (is_assoc)
+                                                       dev.innerHTML = String.format(
+                                                               '<strong><%:Channel%>:</strong> %s (%s GHz) | ' +
+                                                               '<strong><%:Bitrate%>:</strong> %s Mb/s',
+                                                                       iw.channel ? iw.channel : '?',
+                                                                       iw.frequency ? iw.frequency : '?',
+                                                                       iw.bitrate ? iw.bitrate : '?'
+                                                       );
+                                               else
+                                                       dev.innerHTML = '';
+                                       }
 
-                                               var info = document.getElementById(iw.id + '-iw-status');
-                                               if (info)
+                                       if (assoctable)
+                                       {
+                                               var assoclist = [ ];
+                                               for( var bssid in iw.assoclist )
                                                {
-                                                       if (is_assoc)
-                                                               info.innerHTML = String.format(
-                                                                       '<strong><%:SSID%>:</strong> %h | ' +
-                                                                       '<strong><%:Mode%>:</strong> %s<br />' +
-                                                                       '<strong><%:BSSID%>:</strong> %s | ' +
-                                                                       '<strong><%:Encryption%>:</strong> %s',
-                                                                               iw.ssid, iw.mode, iw.bssid,
-                                                                               iw.encryption ? iw.encryption : '<%:None%>'
-                                                               );
-                                                       else
-                                                               info.innerHTML = String.format(
-                                                                       '<strong><%:SSID%>:</strong> %h | ' +
-                                                                       '<strong><%:Mode%>:</strong> %s<br />' +
-                                                                       '<em>%s</em>',
-                                                                               iw.ssid || '?', iw.mode,
-                                                                               is_reconnecting
-                                                                                       ? '<em><%:Wireless is restarting...%></em>'
-                                                                                       : '<em><%:Wireless is disabled or not associated%></em>'
-                                                               );
+                                                       assoclist.push(iw.assoclist[bssid]);
+                                                       assoclist[assoclist.length-1].bssid = bssid;
                                                }
 
-                                               var dev = document.getElementById(wifidevs[iw.id] + '-iw-devinfo');
-                                               if (dev)
+                                               assoclist.sort(function(a, b) { a.bssid < b.bssid });
+
+                                               for( var j = 0; j < assoclist.length; j++ )
                                                {
-                                                       if (is_assoc)
-                                                               dev.innerHTML = String.format(
-                                                                       '<strong><%:Channel%>:</strong> %s (%s GHz) | ' +
-                                                                       '<strong><%:Bitrate%>:</strong> %s Mb/s',
-                                                                               iw.channel ? iw.channel : '?',
-                                                                               iw.frequency ? iw.frequency : '?',
-                                                                               iw.bitrate ? iw.bitrate : '?'
-                                                               );
+                                                       var tr = assoctable.insertRow(-1);
+                                                           tr.className = 'cbi-section-table-row cbi-rowstyle-' + rowstyle;
+
+                                                       var icon;
+                                                       var q = (-1 * (assoclist[j].noise - assoclist[j].signal)) / 5;
+                                                       if (q < 1)
+                                                               icon = "<%=resource%>/icons/signal-0.png";
+                                                       else if (q < 2)
+                                                               icon = "<%=resource%>/icons/signal-0-25.png";
+                                                       else if (q < 3)
+                                                               icon = "<%=resource%>/icons/signal-25-50.png";
+                                                       else if (q < 4)
+                                                               icon = "<%=resource%>/icons/signal-50-75.png";
                                                        else
-                                                               dev.innerHTML = '';
-                                               }
+                                                               icon = "<%=resource%>/icons/signal-75-100.png";
 
-                                               if (assoctable)
-                                               {
-                                                       var assoclist = [ ];
-                                                       for( var bssid in iw.assoclist )
-                                                       {
-                                                               assoclist.push(iw.assoclist[bssid]);
-                                                               assoclist[assoclist.length-1].bssid = bssid;
-                                                       }
-
-                                                       assoclist.sort(function(a, b) { a.bssid < b.bssid });
-
-                                                       for( var j = 0; j < assoclist.length; j++ )
-                                                       {
-                                                               var tr = assoctable.insertRow(-1);
-                                                                   tr.className = 'cbi-section-table-row cbi-rowstyle-' + rowstyle;
-
-                                                               var icon;
-                                                               var q = (-1 * (assoclist[j].noise - assoclist[j].signal)) / 5;
-                                                               if (q < 1)
-                                                                       icon = "<%=resource%>/icons/signal-0.png";
-                                                               else if (q < 2)
-                                                                       icon = "<%=resource%>/icons/signal-0-25.png";
-                                                               else if (q < 3)
-                                                                       icon = "<%=resource%>/icons/signal-25-50.png";
-                                                               else if (q < 4)
-                                                                       icon = "<%=resource%>/icons/signal-50-75.png";
-                                                               else
-                                                                       icon = "<%=resource%>/icons/signal-75-100.png";
-
-                                                               tr.insertCell(-1).innerHTML = String.format(
-                                                                       '<img src="%s" title="<%:Signal%>: %d dBm / <%:Noise%>: %d dBm" />',
-                                                                       icon, assoclist[j].signal, assoclist[j].noise
-                                                               );
-
-                                                               tr.insertCell(-1).innerHTML = iw.ssid ? iw.ssid : '?';
-                                                               tr.insertCell(-1).innerHTML = assoclist[j].bssid;
-
-                                                               tr.insertCell(-1).innerHTML = arptable[assoclist[j].bssid]
-                                                                       ? arptable[assoclist[j].bssid] : '?';
-
-                                                               tr.insertCell(-1).innerHTML = String.format('%d dBm', assoclist[j].signal);
-                                                               tr.insertCell(-1).innerHTML = String.format('%d dBm', assoclist[j].noise);
-
-                                                               rowstyle = (rowstyle == 1) ? 2 : 1;
-                                                       }
-                                               }
-                                       }
+                                                       tr.insertCell(-1).innerHTML = String.format(
+                                                               '<img src="%s" title="<%:Signal%>: %d dBm / <%:Noise%>: %d dBm" />',
+                                                               icon, assoclist[j].signal, assoclist[j].noise
+                                                       );
 
-                                       if (assoctable && assoctable.rows.length == 1)
-                                       {
-                                               var tr = assoctable.insertRow(-1);
-                                                   tr.className = 'cbi-section-table-row';
+                                                       tr.insertCell(-1).innerHTML = String.format('%h', iw.ssid ? iw.ssid : '?');
+                                                       tr.insertCell(-1).innerHTML = assoclist[j].bssid;
 
-                                               var td = tr.insertCell(-1);
-                                                   td.colSpan = 6;
-                                                   td.innerHTML = '<br /><em><%:No information available%></em>';
-                                       }
+                                                       tr.insertCell(-1).innerHTML = arptable[assoclist[j].bssid]
+                                                               ? arptable[assoclist[j].bssid] : '?';
 
-                                       for (var dev in devup)
-                                       {
-                                               var img = document.getElementById(dev + '-iw-upstate');
-                                               if (img)
-                                                       img.src = '<%=resource%>/icons/wifi_big' + (devup[dev] ? '' : '_disabled') + '.png';
+                                                       tr.insertCell(-1).innerHTML = String.format('%d dBm', assoclist[j].signal);
+                                                       tr.insertCell(-1).innerHTML = String.format('%d dBm', assoclist[j].noise);
+
+                                                       tr.insertCell(-1).innerHTML = (assoclist[j].rx_mcs > -1)
+                                                               ? String.format('%.1f Mbit/s, MCS %d, %dMHz', assoclist[j].rx_rate / 1000, assoclist[j].rx_mcs, assoclist[j].rx_40mhz ? 40 : 20)
+                                                               : String.format('%.1f Mbit/s', assoclist[j].rx_rate / 1000)
+                                                       ;
+
+                                                       tr.insertCell(-1).innerHTML = (assoclist[j].tx_mcs > -1)
+                                                               ? String.format('%.1f Mbit/s, MCS %d, %dMHz', assoclist[j].tx_rate / 1000, assoclist[j].tx_mcs, assoclist[j].tx_40mhz ? 40 : 20)
+                                                               : String.format('%.1f Mbit/s', assoclist[j].tx_rate / 1000)
+                                                       ;
+
+                                                       rowstyle = (rowstyle == 1) ? 2 : 1;
+                                               }
                                        }
                                }
 
-                               window.setTimeout(func, 5000);
+                               if (assoctable && assoctable.rows.length == 1)
+                               {
+                                       var tr = assoctable.insertRow(-1);
+                                           tr.className = 'cbi-section-table-row';
+
+                                       var td = tr.insertCell(-1);
+                                           td.colSpan = 8;
+                                           td.innerHTML = '<br /><em><%:No information available%></em>';
+                               }
+
+                               for (var dev in devup)
+                               {
+                                       var img = document.getElementById(dev + '-iw-upstate');
+                                       if (img)
+                                               img.src = '<%=resource%>/icons/wifi_big' + (devup[dev] ? '' : '_disabled') + '.png';
+                               }
                        }
-               )
-       })();
+               }
+       );
 //]]></script>
 
 <h2><a id="content" name="content"><%:Wireless Overview%></a></h2>
@@ -365,9 +366,9 @@ $Id$
                                        <big><strong><%=guess_wifi_hw(dev:name())%> (<%=dev:name()%>)</strong></big><br />
                                        <span id="<%=dev:name()%>-iw-devinfo"></span>
                                </td>
-                               <td style="width:250px;text-align:right">
-                                       <input type="button" class="cbi-button cbi-button-add" style="width:80px;background-image:url(<%=resource%>/cbi/find.gif)" onclick="location.href='<%=luci.dispatcher.build_url("admin/network/wireless_join")%>?device=<%=dev:name()%>'" title="<%:Find and join network%>" value="<%:Scan%>" />
-                                       <input type="button" class="cbi-button cbi-button-add" style="width:80px;background-image:url(<%=resource%>/cbi/add.gif)" onclick="location.href='<%=luci.dispatcher.build_url("admin/network/wireless_add")%>?device=<%=dev:name()%>'" title="<%:Provide new network%>" value="<%:Add%>" />
+                               <td style="width:310px;text-align:right">
+                                       <input type="button" class="cbi-button cbi-button-find" style="width:100px" onclick="location.href='<%=luci.dispatcher.build_url("admin/network/wireless_join")%>?device=<%=dev:name()%>'" title="<%:Find and join network%>" value="<%:Scan%>" />
+                                       <input type="button" class="cbi-button cbi-button-add" style="width:100px" onclick="location.href='<%=luci.dispatcher.build_url("admin/network/wireless_add")%>?device=<%=dev:name()%>'" title="<%:Provide new network%>" value="<%:Add%>" />
                                </td>
                        </tr>
                        <!-- /physical device -->
@@ -384,10 +385,10 @@ $Id$
                                        <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=net:id()%>-iw-status">
                                                <em><%:Collecting data...%></em>
                                        </td>
-                                       <td class="cbi-value-field" style="width:250px;text-align:right">
-                                               <input id="<%=net:id()%>-iw-toggle" type="button" class="cbi-button cbi-button-add" style="width:80px;background-image:url(<%=resource%>/cbi/reload.gif)" onclick="wifi_shutdown('<%=net:id()%>', this)" title="<%:Delete this network%>" value="<%:Enable%>" />
-                                               <input type="button" class="cbi-button cbi-button-add" style="width:80px;background-image:url(<%=resource%>/cbi/edit.gif)" onclick="location.href='<%=net:adminlink()%>'" title="<%:Edit this network%>" value="<%:Edit%>" />
-                                               <input type="button" class="cbi-button cbi-button-add" style="width:80px;background-image:url(<%=resource%>/cbi/remove.gif)" onclick="if (confirm('<%:Really delete this wireless network? The deletion cannot be undone!\nYou might lose access to this router if you are connected via this network.%>')) location.href='<%=luci.dispatcher.build_url("admin/network/wireless_delete", net:ifname())%>'" title="<%:Delete this network%>" value="<%:Remove%>" />
+                                       <td class="cbi-value-field" style="width:310px;text-align:right">
+                                               <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%>" />
+                                               <input type="button" class="cbi-button cbi-button-edit" style="width:100px" onclick="location.href='<%=net:adminlink()%>'" title="<%:Edit this network%>" value="<%:Edit%>" />
+                                               <input type="button" class="cbi-button cbi-button-remove" style="width:100px" onclick="if (confirm('<%:Really delete this wireless network? The deletion cannot be undone!\nYou might lose access to this router if you are connected via this network.%>')) location.href='<%=luci.dispatcher.build_url("admin/network/wireless_delete", net:ifname())%>'" title="<%:Delete this network%>" value="<%:Remove%>" />
                                        </td>
                                </tr>
                                <% end %>
@@ -409,7 +410,7 @@ $Id$
        <h2><a id="content" name="content"><%:Associated Stations%></a></h2>
 
        <fieldset class="cbi-section">
-               <table class="cbi-section-table" style="margin:10px; width:50%" id="iw-assoclist">
+               <table class="cbi-section-table" style="margin:10px" id="iw-assoclist">
                        <tr class="cbi-section-table-titles">
                                <th class="cbi-section-table-cell"></th>
                                <th class="cbi-section-table-cell"><%:SSID%></th>
@@ -417,9 +418,11 @@ $Id$
                                <th class="cbi-section-table-cell"><%:Address%></th>
                                <th class="cbi-section-table-cell"><%:Signal%></th>
                                <th class="cbi-section-table-cell"><%:Noise%></th>
+                               <th class="cbi-section-table-cell"><%:RX Rate%></th>
+                               <th class="cbi-section-table-cell"><%:TX Rate%></th>
                        </tr>
                        <tr class="cbi-section-table-row cbi-rowstyle-2">
-                               <td class="cbi-value-field" colspan="6">
+                               <td class="cbi-value-field" colspan="8">
                                        <em><%:Collecting data...%></em>
                                </td>
                        </tr>