Commit 43cbd1d3 authored by 's avatar
Browse files

Improved GUI and stats (EXPIRED_FLOWS changed too).


git-svn-id: file:///home/svn/mapi/trunk@1355 8d5bb341-7cf1-0310-8cf6-ba355fef3186
parent 0cdf1073
......@@ -76,14 +76,14 @@ table summary {
th {
text-align: center;
font-family: arial, Verdana, lucida, helvetica, sans-serif;
font-family: Verdana, lucida, helvetica, arial, sans-serif;
font-weight: bold;
/*font-size: 10pt;*/
}
td {
border: 1px solid black;
font-family: arial, helvetica, sans-serif;
font-family: Verdana, lucida, helvetica, arial, sans-serif;
text-align: center;
}
......@@ -131,13 +131,43 @@ label {
white-space: nowrap;
}
pre, code, tt, .tt {
font-size: 110%;
font-family: monospace; /* NN4 */
white-space: pre;
}
acronym, abbr, dfn {
border-width: 0px 0px 1px 0px;
border-color: #606060;
border-style: dashed;
cursor: help;
}
.line {
display: block;
}
.right {
text-align: right;
}
.centered {
text-align: center;
}
.note {
font-style: italic;
font-size: 85%;
}
.line {
display: block;
.strong {
font-weight: bold;
}
.kwd {
color: red;
}
.floatleft {
......@@ -147,13 +177,70 @@ label {
padding: 0.1em 0.5em 0.1em 0em; /* MSIE multiplies float margin 2x, have to use padding */
}
.centered {
text-align: center;
}
.floatright {
float: right;
margin: 0em;
padding: 0.1em 0em 0.1em 0.5em; /* MSIE multiplies float margin 2x, have to use padding */
}
.subj0 {
color: red;
}
.subj1 {
color: blue;
}
div.altitle-a { /* Do NOT remove -- altitle depends on this. */
border-width: 1px;
border-color: #2090FF;
border-style: solid;
margin: 0px;
padding: 0px 2px;
background-color: #E0E0E0;
opacity: 0.85 /* CSS3 */
}
div.altitle-img { /* Do NOT remove -- altitle depends on this. */
border-width: 1px;
border-color: black;
border-style: solid;
margin: 0px;
padding: 0px 2px;
background-color: #E0E0E0;
opacity: 0.85 /* CSS3 */
}
div.altitle-acronym { /* Do NOT remove -- altitle depends on this. */
border-width: 1px;
border-color: black;
border-style: solid;
margin: 0px;
padding: 0px 2px;
background-color: #E0E0E0;
opacity: 0.85 /* CSS3 */
}
div.altitle-top {
border-width: 1px;
border-color: #666666;
border-style: dashed;
margin: 0px;
padding: 10px 20px;
max-width: 400px;
color: #666666;
background-color: white;
}
.focused {
background-color: yellow;
}
.important:after {
content: " ( ! ) ";
background-color: #FFFF00;
}
......@@ -8,9 +8,9 @@ require_once "${DIR}lib/config.php";
# }}}
readfile("$config->packetloss_top");
readfile($config->abspath($config->packetloss_home, $config->packetloss_top));
//$content = "";
//$fp = fopen($config->packetloss_top, "r");
//$fp = fopen($config->abspath($config->packetloss_home, $config->packetloss_top), "r");
//while (!feof($fp)) $content .= fgets($fp, 4096);
//echo $content;
//fclose($fp);
......
# This is a configuration file for packetloss GUI.
# packetloss home
packetloss_home = "/path/to/packetloss"
# rrdtool binary
rrdtool = "rrdtool"
# log file
rrdtool_error_log = "/tmp/packetloss_rrdtool_error.log"
rrdtool_error_log = "log/packetloss_rrdtool_error.log"
# rrds
packetloss_rrd = "/path/to/packetloss/packetloss.rrd"
packetcount_rrd = "/path/to/packetloss/packetloss_packets.rrd"
packetloss_rrd = "packetloss.rrd"
packetcount_rrd = "packetloss_packets.rrd"
# packetloss top file
packetloss_top = "/path/to/packetloss/packetloss_top.csv"
packetloss_top = "packetloss_top.csv"
# enable or disable tops
enable_packetloss_top
enable_protocol_top
# keep as is
output = "-"
# packetloss GUI home
packetloss_gui_home = "/path/to/packetlossGUI"
# packetloss GUI log
packetloss_gui_log = "log/packetloss.log"
......@@ -8,7 +8,7 @@ require_once "${DIR}lib/graph.php";
# }}}
$allowed_args = ",host0rrddsid,host1rrddsid,predefined,start,end,width,height,upperLimit,lowerLimit,onlyGraph,title,";
$allowed_args = ",host0rrddsid,host1rrddsid,start,end,step,avg,max,min,width,height,upperLimit,lowerLimit,onlyGraph,title,info,";
foreach(array_keys($_GET) as $key) {
if(strpos($allowed_args,",$key,") !== false) {
......@@ -16,18 +16,7 @@ foreach(array_keys($_GET) as $key) {
}
}
//$predefinedarr = array(
// "default" => "default",
// "3hours" => "3hours",
// "day" => "day",
// "week" => "week",
// "month" => "month",
// "year" => "year"
//);
//$predefined = $predefinedarr[$predefined]; // filter values
if($predefined != "") $graph = new Graph("packetcount", $host0rrddsid, $host1rrddsid, $predefined, "", "", $width, $height);
else $graph = new Graph("packetcount", $host0rrddsid, $host1rrddsid, "", $start, $end, $width, $height, $title);
$graph = new Graph("packetcount", $host0rrddsid, $host1rrddsid, $start, $end, $step, $avg, $max, $min, $width, $height, $title, $info);
//$graph->dry_run();
$graph->flush();
......
......@@ -8,7 +8,7 @@ require_once "${DIR}lib/graph.php";
# }}}
$allowed_args = ",host0rrddsid,host1rrddsid,predefined,start,end,width,height,upperLimit,lowerLimit,onlyGraph,title,";
$allowed_args = ",host0rrddsid,host1rrddsid,start,end,step,avg,max,min,width,height,upperLimit,lowerLimit,onlyGraph,title,info,";
foreach(array_keys($_GET) as $key) {
if(strpos($allowed_args,",$key,") !== false) {
......@@ -16,18 +16,7 @@ foreach(array_keys($_GET) as $key) {
}
}
//$predefinedarr = array(
// "default" => "default",
// "3hours" => "3hours",
// "day" => "day",
// "week" => "week",
// "month" => "month",
// "year" => "year"
//);
//$predefined = $predefinedarr[$predefined]; // filter values
if($predefined != "") $graph = new Graph("packetloss", $host0rrddsid, $host1rrddsid, $predefined, "", "", $width, $height);
else $graph = new Graph("packetloss", $host0rrddsid, $host1rrddsid, "", $start, $end, $width, $height, $title);
$graph = new Graph("packetloss", $host0rrddsid, $host1rrddsid, $start, $end, $step, $avg, $max, $min, $width, $height, $title, $info);
//$graph->dry_run();
$graph->flush();
......
......@@ -5,23 +5,39 @@
require_once "lib/misc.php";
require_once "lib/config.php";
require_once "lib/logger.php";
require_once "lib/graph.php";
require_once "lib/packetlossTop.php";
require_once "lib/formElement.php";
require_once "lib/highlight.php";
# }}}
# Variables {{{
$debug = false;
$logging = false;
# }}}
$packetlossTop = new packetlossTop($config->packetloss_top);
$packetlossTop = new packetlossTop($config->abspath($config->packetloss_home, $config->packetloss_top));
# initialize form elements {{{
$form = array();
$form["subject"] = new FormElement( // checkbox
"subject",
$form["subject0"] = new FormElement( // checkbox
"subject0",
$packetlossTop->hostarr,
"" //array_keys($packetlossTop->hostarr)
);
$form["subject1"] = new FormElement( // checkbox
"subject1",
$packetlossTop->hostarr,
array_keys($packetlossTop->hostarr)
"" // array_keys($packetlossTop->hostarr)
);
$form["time_type"] = new FormElement( // radio
......@@ -36,9 +52,16 @@ $form["time_type"] = new FormElement( // radio
$form["times"] = new FormElement( // checkbox
"times",
$predefinedTimes,
$predefinedTimes = array(
"10m_10x_0" => "10 minutes (int 10 sec)",
"1h_60_0" => "1 hour (int 1 min)",
"3h_180_900" => "3 hours (int 3 min, max 15 min)",
"1d_300_3600" => "1 day (int 5 min, max 1 hour)",
"1w_1800_21600" => "1 week (int 30 min, max 6 hour)",
"1m_7200_86400" => "1 month (int 2 hour, max 1 day)",
),
array(
"10_1h"
"1h_60_0"
)
);
......@@ -61,14 +84,14 @@ $form["time_length_unit"] = new FormElement( // select - option
"Minutes"
);
$form["r1_number"] = new FormElement( // text
"r1_number",
$form["step_number"] = new FormElement( // text
"step_number",
"",
"10"
"60"
);
$form["r1_unit"] = new FormElement( // select - option
"r1_unit",
$form["step_unit"] = new FormElement( // select - option
"step_unit",
array(
"Seconds" => "Seconds",
"Minutes" => "Minutes",
......@@ -81,6 +104,37 @@ $form["r1_unit"] = new FormElement( // select - option
"Seconds"
);
$form["constep_number"] = new FormElement( // text
"constep_number",
"",
"180"
);
$form["constep_unit"] = new FormElement( // select - option
"constep_unit",
array(
"Seconds" => "Seconds",
"Minutes" => "Minutes",
"Hours" => "Hours",
"Days" => "Days",
"Weeks" => "Weeks",
"Months" => "Months",
"Years" => "Years"
),
"Seconds"
);
$form["consolidation"] = new FormElement( // checkboxes
"consolidation",
array(
"avg" => "Avg",
"max" => "Max",
"min" => "Min"
),
array(
"max"
)
);
$form["characteristics"] = new FormElement( // checkbox
"characteristics",
......@@ -101,8 +155,82 @@ $form["graph_size"] = new FormElement( // radio
"normal" => "Normal (400 × 200)",
"large" => "Large (500 × 300)"
),
"normal"
);
$form["features"] = new FormElement( // checkbox
"features",
array(
"drag" => "Draggable graphs",
),
array(
"drag"
)
);
$form["top"] = new FormElement(
"top",
array(
// "basic" => "Basic",
"int_stats" => array(
"label" => "Internal statistics (\"at host\")",
"description" => "Statistics generated at host/interface.\nDue to resource limits, some flows can be ignored or dropped already at host/interface, so some informations about them appers in 'internal stats'. However, they are not counted into 'external stats', as they are simply not shipped from host/interface to packetloss application."),
"ext_stats" => array(
"label" => "External statistics",
"description" => "Statistics generated by packetloss application."),
"devices" => array(
"label" => "Separate interfaces",
"description" => "Show statistics per interface, not just per host."),
"rd" => array(
"label" => "Separate directions",
"description" => "Resolve from/to direction."),
"peer" => array(
"label" => "Show 'Subject 2' stats too",
"description" => "Check this to see stats related to 'Subject 2 only' too.\n(If not checked, just stats related to 'Subject 1 only' and stats related to 'both Subject 1 and Subject 2' are shown.)"),
"hosts" => array(
"label" => "\"All hosts\" statistics",
"description" => "Show overall statistics, not specific for any of Subject 1 or Subject 2.\nNote: These stats should be implemented for host-to-host view soon..."),
// "single_stats" => "Single statistics"
),
array(
// "basic",
// "int_stats",
"ext_stats",
// "devices",
// "rd",
"peer",
// "hosts",
// "single_stats"
)
);
$form["top_ct"] = new FormElement(
"top",
array(
"c" => array(
"label" => "Current values",
"description" => "Values measured during last application life cycle (10 seconds)."),
"t" => array(
"label" => "Total values",
"description" => "Show total values, collected since the application started.\nNote: Most of stats are 'total' for now, so you should probably keep this checked.")
),
array(
"normal"
// "c",
"t"
)
);
$form["top_unit"] = new FormElement(
"top_unit",
array(
"flows" => array("label" => "Flows", "description" => "Check this if you are interested in flows counts."),
"pkts" => array("label" => "Packets", "description" => "Check this if you are interested in packets counts."),
"bytes" => array("label" => "Bytes", "description" => "Check this if you are interested in bytes counts."),
),
array(
"flows",
"pkts",
// "bytes",
)
);
......@@ -154,11 +282,18 @@ $form["time"] = new FormElement( // select - option (more selects)
<script type="text/javascript" src="js/misc.js"></script>
<script type="text/javascript" src="js/dom.js"></script>
<?php if($logging) { ?>
<script type="text/javascript" src="js/logger.js"></script>
<?php } ?>
<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript" src="js/packetlossTop.js"></script>
<script type="text/javascript" src="js/mouse.js"></script>
<script type="text/javascript" src="js/altitle.js"></script>
<style type="text/css">
/* <![CDATA[ */
/* <![CDATA[ {{{ */
div.clear {
clear: both
......@@ -196,11 +331,17 @@ $form["time"] = new FormElement( // select - option (more selects)
width: 20em;
margin-right: 5em;
}
.steps .widetd {
width: 50em;
}
.steps .medium {
width: 50%;
width: 30em;
}
.steps .wide {
width: 80%;
.steps .short {
width: 11em;
}
.steps .tiny {
width: 7em;
}
.steps .th {
/*border: 1px solid red;*/
......@@ -211,6 +352,18 @@ $form["time"] = new FormElement( // select - option (more selects)
.steps .td {
float: left;
}
.steps .widetd .th {
width: 20em;
}
.steps .medium .th {
width: 28em;
}
.steps .short .th {
width: 9em;
}
.steps .tiny .th {
width: 5em;
}
.graphs {
clear: left;
......@@ -233,6 +386,7 @@ $form["time"] = new FormElement( // select - option (more selects)
}
.thetop th {
border-bottom: 1px dashed #A0A0A0;
font-family: arial, helvetica, sans-serif;
}
.thetop td {
border-top: none;
......@@ -241,6 +395,7 @@ $form["time"] = new FormElement( // select - option (more selects)
border-left: none;
padding: 2px;
text-align: right;
font-family: arial, helvetica, sans-serif;
}
.thetop tr.delimiter {
border-top: 2px solid #808080;
......@@ -249,22 +404,38 @@ $form["time"] = new FormElement( // select - option (more selects)
text-align: right;
}
/* ]]> */
acronym.help {
border: 1px dashed #666666;
padding: 0em 0.2em;
color: #666666;
font-family: Verdana, lucida, helvetica, arial, sans-serif;
font-weight: bold;
font-size: 85%;
}
<?php if($logging) { ?>
#debug {
clear: left;
margin-top: 2em;
border-top: 5px solid #F0F0F0;
padding-top: 2em;
text-align: center;
}
#debug * {
color: #666666;
}
#debugarea {
background-color: #E0E0E0;
}
<?php } ?>
/* ]]> }}} */
</style>
<script type="text/javascript">
//<![CDATA[
/*
function packetloss_switch() {
var type = document.getElementById('packetloss_type').value;
var predefined = document.getElementById('packetloss_predefined').value;
var element = document.getElementById('packetloss');
if (type == 'packetloss')
element.src = 'graph/packetloss.php?predefined=' + predefined;
else
element.src = 'graph/packetcount.php?predefined=' + predefined;
}
*/
//<![CDATA[ {{{
function setTime(d, year, month, day, hours, minutes) {
year.value = d.getFullYear();
month.value = d.getMonth() + 1;
......@@ -272,7 +443,52 @@ $form["time"] = new FormElement( // select - option (more selects)
hours.value = d.getHours();
minutes.value = d.getMinutes();
}
//]]>
function setStep(time_length_number, time_length_unit, step_number, step_unit) {
step_number.value = time_length_number.value / 360;
step_unit.value = time_length_unit.value;
}
function setAvgMax(time_length_number, time_length_unit, constep_number, constep_unit) {
constep_number.value = time_length_number.value / 10;
constep_unit.value = time_length_unit.value;
}
function mark(element) {
var focusedRegExp = new RegExp("(^|\\s)focused(\\s|$)");
var isFocused = element.className.match(focusedRegExp);
if(!isFocused) element.className+=' focused';
else element.className=element.className.replace(focusedRegExp,''); // XXX can not start class="focused…"
}
function switch_subjects() { // TODO length == undefined
var h0i;
var h1i;
var subject0 = document.forms["form"].subject0;
var subject1 = document.forms["form"].subject1;
for(i = 0; i < subject0.length; i++)
if(subject0[i].checked) h0i = i;
for(i = 0; i < subject1.length; i++)
if(subject1[i].checked) h1i = i;
subject0[h1i].checked = true;
subject1[h0i].checked = true;
//alert(document.getElementById("_subject0_h" + h1i));
//alert(document.getElementById("_subject0_h" + h1i).className);
document.getElementById("l_subject0_h" + h0i).className = "";
document.getElementById("l_subject0_h" + h1i).className = "strong subj0";
document.getElementById("l_subject1_h" + h1i).className = "";
document.getElementById("l_subject1_h" + h0i).className = "strong subj1";
}
exists = false;