mirror of
https://github.com/ntop/ntopng.git
synced 2026-05-02 00:40:10 +00:00
162 lines
4.7 KiB
Lua
162 lines
4.7 KiB
Lua
--
|
|
-- (C) 2013-15 - ntop.org
|
|
--
|
|
|
|
dirs = ntop.getDirs()
|
|
package.path = dirs.installdir .. "/scripts/lua/modules/?.lua;" .. package.path
|
|
|
|
require "lua_utils"
|
|
|
|
if(mode ~= "embed") then
|
|
sendHTTPHeader('text/html; charset=iso-8859-1')
|
|
ntop.dumpFile(dirs.installdir .. "/httpdocs/inc/header.inc")
|
|
active_page = "hosts"
|
|
dofile(dirs.installdir .. "/scripts/lua/inc/menu.lua")
|
|
end
|
|
|
|
print("<h2>Top Hosts Traffic</H2>")
|
|
print [[
|
|
<style>
|
|
|
|
svg {
|
|
font: 10px sans-serif;
|
|
}
|
|
|
|
.axis path, .axis line {
|
|
fill: none;
|
|
stroke: #000;
|
|
shape-rendering: crispEdges;
|
|
}
|
|
|
|
sup, sub {
|
|
line-height: 0;
|
|
}
|
|
|
|
.background {
|
|
fill: #eee;
|
|
}
|
|
line {
|
|
stroke: #fff;
|
|
}
|
|
text.active {
|
|
font-size: 12px;
|
|
fill: red;
|
|
}
|
|
article, aside { display:inline-block; vertical-align:top;}
|
|
|
|
#tooltip{
|
|
display: none;
|
|
position: absolute;
|
|
color : #fff;
|
|
/*background-color: #333;*/
|
|
border-radius: 4px;
|
|
z-index: 1000;
|
|
}
|
|
|
|
|
|
tr { background-color: #333; }
|
|
</style>
|
|
]]
|
|
print("<section>")
|
|
print("<header><h3></h3></header>")
|
|
print('<div id="tooltip">')
|
|
print [[
|
|
<table class="table table-bordered">
|
|
<thead>
|
|
<th style="text-align: center;">Host</th>
|
|
<th style="text-align: center;">Sent</th>
|
|
<th style="text-align: center;">Rcvd</th>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
]]
|
|
print('</div>')
|
|
print("<article class=\"gr\"></article>")
|
|
print [[
|
|
<aside style="margin-top: 90px; margin-left: 10px;>"
|
|
<p><h4>Sort by: </h4><select id="order">
|
|
<option value="name">Name</option>
|
|
<option value="count">Frequency</option>
|
|
<option value="group">Cluster</option>
|
|
<option value="flow_sent">Traffic Sent</option>
|
|
<option value="flow_rcvd">Traffic Rcvd</option>
|
|
<option value="flow_tot">Total Traffic</option>
|
|
</select>
|
|
</p>
|
|
<div id="legend" style="">
|
|
<h4>Legend:</h4>
|
|
<svg width="100" height="198">
|
|
<defs>
|
|
<linearGradient id="local"
|
|
x1="0%" y1="0%"
|
|
x2="100%" y2="100%"
|
|
spreadMethod="pad">
|
|
<stop offset="0%" stop-color="#1f77b4" stop-opacity="1"/>
|
|
<stop offset="100%" stop-color="#1f77b4" stop-opacity=".25"/>
|
|
</linearGradient>
|
|
<linearGradient id="remote"
|
|
x1="0%" y1="0%"
|
|
x2="100%" y2="100%"
|
|
spreadMethod="pad">
|
|
<stop offset="0%" stop-color="#ff7f0e" stop-opacity="1"/>
|
|
<stop offset="100%" stop-color="#ff7f0e" stop-opacity=".25"/>
|
|
</linearGradient>
|
|
<linearGradient id="none"
|
|
x1="0%" y1="0%"
|
|
x2="100%" y2="100%"
|
|
spreadMethod="pad">
|
|
<stop offset="0%" stop-color="#333" stop-opacity="1"/>
|
|
<stop offset="100%" stop-color="#333" stop-opacity=".25"/>
|
|
</linearGradient>
|
|
</defs>
|
|
<g transform="translate(0,0)">
|
|
<rect rx="3" ry="3" width="100" height="30" style="fill: url(#local);"></rect>
|
|
<text x="50" y="15" dy="0.35em" text-anchor="middle">local</text>
|
|
</g>
|
|
<g transform="translate(0,33)">
|
|
<rect rx="3" ry="3" width="100" height="30" style="fill: url(#remote);"></rect>
|
|
<text x="50" y="15" dy="0.35em" text-anchor="middle">remote</text>
|
|
</g>
|
|
<g transform="translate(0,66)">
|
|
<rect rx="3" ry="3" width="100" height="30" style="fill: url(#none);"></rect>
|
|
<text x="50" y="15" dy="0.35em" text-anchor="middle">local <-> remote</text>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
</aside>
|
|
]]
|
|
print("</section>")
|
|
print ('<script>')
|
|
|
|
print [[
|
|
var margin = {top: 140, right: 0, bottom: 10, left: 140},
|
|
width = 620, height = 500;
|
|
|
|
var h = d3.scale.ordinal().rangeBands([0, width]),
|
|
z = d3.scale.linear().domain([0, 4]).clamp(true),
|
|
c = d3.scale.category10().domain(d3.range(10));
|
|
|
|
var svg = d3.select(".gr").append("svg")
|
|
.attr("width", width + margin.left + margin.right)
|
|
.attr("height", height + margin.top + margin.bottom)
|
|
.style("margin-left", margin.left/7 + "px")
|
|
.append("g")
|
|
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
|
|
|
|
d3.json("]]
|
|
print (ntop.getHttpPrefix())
|
|
print [[/lua/get_host_traffic_matrix.lua]]
|
|
|
|
if(_GET["host"] ~= nil) then
|
|
print("?host=".._GET["host"])
|
|
end
|
|
print('",function(dati) {\n')
|
|
|
|
ntop.dumpFile(dirs.installdir .. "/httpdocs/js/matrix_volume.js")
|
|
print ('</script>')
|
|
--[[print ('<script src="/js/matrix_volume.js"></script>')]]--
|
|
|
|
if(mode ~= "embed") then
|
|
dofile(dirs.installdir .. "/scripts/lua/inc/footer.lua")
|
|
end
|