mptcp/openmptcprouter-feeds
1
0
Fork 0
mirror of https://github.com/Ysurac/openmptcprouter-feeds.git synced 2025-03-09 15:40:03 +00:00
Code Issues Releases Wiki Activity

Add total to bandwidth graph

Browse source
This commit is contained in:
Ycarus (Yannick Chabanois) 2020-09-10 21:06:16 +02:00
parent dd938aec0f
commit aadf62caf0
2 changed files with 133 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

83
luci-app-mptcp/luasrc/view/mptcp/multipath.htm
View file

@ -54,6 +54,8 @@
<script type="text/javascript">//<![CDATA[
function stringToColour(str) {
if(str == "total")
return "OrangeRed";
if(str == "wan")
return "FireBrick";
if(str == "wan1")
@ -259,6 +261,7 @@
var data_tx_peak = 0;
var data = {};
var pre_itf = "";
for(var itf in dataarray)
{
@ -271,7 +274,15 @@
// Create a new polygon to draw the bandwith
var dnline = Gdn.createElementNS('http://www.w3.org/2000/svg', 'polyline');
dnline.setAttributeNS(null, 'id', 'rx_' + itf);
dnline.setAttributeNS(null, 'style', 'fill:' + color + ';fill-opacity:0.4;stroke:black;stroke-width:0.1');
if (itf != "total")
{
dnline.setAttributeNS(null, 'style', 'fill:' + color + ';fill-opacity:0.4;stroke:black;stroke-width:0.1');
}
else
{
//dnline.setAttributeNS(null, 'style', 'fill: none;stroke:OrangeRed;stroke-width:1');
dnline.setAttributeNS(null, 'style', 'fill: none;stroke:none');
}
Gdn.getElementById('rx').parentNode.appendChild(dnline);
dnPolygons[itf] = Gdn.getElementById('rx_' + itf);
@ -284,11 +295,18 @@
// Create legend for this connextion
var table = document.getElementById('download_stats');
var tr = table.insertRow();
if (pre_itf == "total")
{
var tr = table.insertRow(0);
}
else
{
var tr = table.insertRow();
}
tr.setAttribute('id', itf + '_download');
// Create cells of the table
var itflabel = tr.insertCell(0);
// Crete itf legend
// Create itf legend
var strong = document.createElement('strong')
strong.appendChild(document.createTextNode(itf));
strong.setAttribute('style', 'border-bottom:2px solid ' + color);
@ -312,7 +330,15 @@
{
var upline = Gup.createElementNS('http://www.w3.org/2000/svg', 'polyline');
upline.setAttributeNS(null, 'id', 'tx_' + itf);
upline.setAttributeNS(null, 'style', 'fill:' + color + ';fill-opacity:0.4;stroke:black;stroke-width:0.1');
if (itf != "total")
{
upline.setAttributeNS(null, 'style', 'fill:' + color + ';fill-opacity:0.4;stroke:black;stroke-width:0.1');
}
else
{
//upline.setAttributeNS(null, 'style', 'fill:none;stroke:OrangeRed;stroke-width:1');
upline.setAttributeNS(null, 'style', 'fill:none;stroke:none');
}
Gup.getElementById('tx').parentNode.appendChild(upline);
upPolygons[itf] = Gup.getElementById('tx_' + itf);
@ -325,7 +351,16 @@
// Create legend for this connextion
var table = document.getElementById('upload_stats');
var tr = table.insertRow();
if (pre_itf == "total")
{
var tr = table.insertRow(0);
}
else
{
var tr = table.insertRow();
}
tr.setAttribute('id', itf + '_upload');
// Create cells of the table
var itflabel = tr.insertCell(0);
@ -347,8 +382,8 @@
var itfpeak = tr.insertCell(6);
itfpeak.setAttribute('id', itf + '_upload_peak');
itfpeak.appendChild(document.createTextNode('0 <%:kbit/s%> (0 <%:kB/s%>)'));
}
if (pre_itf != "total") pre_itf = itf;
}
var dnsma = {};
@ -415,11 +450,15 @@
{
var rx_bot=0;
var tx_bot=0;
if (itf != "total")
{
for(var j=0; j < toadditf.length; j++)
{
if (toadditf[j] == "total") continue;
rx_bot += dndata[toadditf[j]][i];
tx_bot += updata[toadditf[j]][i];
}
}
// set upline of the interface
uplineDnl[itf][i] = dndata[itf][i] + rx_bot;
data_rx_peak = Math.max(data_rx_peak, dndata[itf][i]);
@ -439,11 +478,14 @@
}
if(toadditf.length)
{
if (toadditf[toadditf.length-1] != "total")
{
downlineDnl[itf][i] = uplineDnl[toadditf[toadditf.length-1]][i];
downlineUpl[itf][i] = uplineUpl[toadditf[toadditf.length-1]][i];
}
}
}
toadditf.push(itf);
// Update stats labels
@ -481,6 +523,7 @@
for (var itf in uplineDnl)
{
//if (itf == "total") continue;
var y_rx = 0;
var y_tx = 0;
@ -566,22 +609,20 @@
father.removeChild(uptopline);
father.appendChild(uptopline);
}
var y_rx = 0;
var y_tx = 0;
var y_rx = 0;
var y_tx = 0;
/* plot data */
var pt_rx = '0,' + height;
var pt_tx = '0,' + height;
/* plot data */
var pt_rx = '0,' + height;
var pt_tx = '0,' + height;
// draw polygon
for (var i = 0; i < uplineDnl[itf].length; i++)
{
var x = i * step;
y_rx = height - Math.floor((uplineDnl[itf][i]) * data_scale_dnl);
y_tx = height - Math.floor((uplineUpl[itf][i]) * data_scale_upl);
pt_rx += ' ' + x + ',' + y_rx;
// draw polygon
for (var i = 0; i < uplineDnl[itf].length; i++)
{
var x = i * step;
y_rx = height - Math.floor((uplineDnl[itf][i]) * data_scale_dnl);
y_tx = height - Math.floor((uplineUpl[itf][i]) * data_scale_upl);
pt_rx += ' ' + x + ',' + y_rx;
pt_tx += ' ' + x + ',' + y_tx;
}
// draw last tangant point in upline graph