Improved GUI and stats (EXPIRED_FLOWS changed too).

git-svn-id: file:///home/svn/mapi/trunk@1355 8d5bb341-7cf1-0310-8cf6-ba355fef3186

applications/packetloss/gui/css/packetloss.css

@@ -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;
+}

applications/packetloss/gui/data/packetloss_top.php

@@ -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);

applications/packetloss/gui/etc/packetloss.conf

 # 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"

applications/packetloss/gui/graph/packetcount.php

@@ -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();

applications/packetloss/gui/graph/packetloss.php

@@ -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();

applications/packetloss/gui/js/dom.js

@@ -4,6 +4,11 @@
  *
  */
 
+/* 
+ * author: "Aleš Friedl"
+ *  version: "0.2"
+ */
+
 document.createHTMLElement = function(name, attrarr) {	
 //	if (document.createElementNS) {
 //		var elem = document.createElementNS("http://www.w3.org/1999/xhtml", name);
@@ -17,6 +22,12 @@ document.createHTMLElement = function(name, attrarr) {
 		for (var i in attrarr) {
 			switch (i) {
 				case "text": elem.appendChild(document.createTextNode(attrarr[i])); break;
+				case "smarttext": { // visualise line-breaks and html eventually
+						if(attrarr[i].search("\n") !== false) elem.innerHTML = attrarr[i].replace(/\n/g, "<br />");
+						else elem.appendChild(document.createTextNode(attrarr[i]));
+						break;
+					}
+				case "html": elem.innerHTML = attrarr[i]; break;
 				case "class": elem.className = attrarr[i]; break;
 				case "style":
 					if(useNS) {

applications/packetloss/gui/js/packetlossTop.js

@@ -12,47 +12,60 @@ var packetlossTop = {
 	author: "Aleš Friedl",
 	version: "0.1",
 	
+	debug: false,
+	logging: true,
+
 	exists: false,
 
 	autorun: true,
+	running: false,
 
 	topfilename: "data/packetloss_top.php",
 
 	init: function() {
 		if(packetlossTop.exists) return false;
+		if(packetlossTop.logging) logger.smartlog("packetlossTop.js: Initialized...");
 		packetlossTop.exists = true;
 		if(packetlossTop.autorun) packetlossTop.start();
 	},
 
 	request: null,
-	process: false,
 	loop: true,
 	delay: 10000, // 10s
 	tid: 0,
+	threadid: 0,
 	counter: 0,
-	last_ts: 0,
+	last_ts: parseInt((new Date()).getTime() / 1000),
+	last_ts_tolerance: 10, // server-client startup tolerance
 	uptodate: 0,
 	rslash: ".*.*",
 
 	objarr: Array(),
 
 	bufferarr: Array(),
-	miscarr: Array(),
+	
+	arr: Array(),
+
 	hostarr: Array(),
-	top1arr: Array(),
-	top2arr: Array(),
 
 	start: function() {
-		packetlossTop.process = true;
+		if(packetlossTop.logging) logger.smartlog("packetlossTop.js: Started...");
+		packetlossTop.running = true;
+		packetlossTop.threadid++;
 		packetlossTop.refresh();
+
+		packetlossTop.buildHostArr();
 	},
 
 	stop: function() {
+		if(packetlossTop.logging) logger.smartlog("packetlossTop.js: Stopped...");
 		if(packetlossTop.tid) {
 			clearTimeout(packetlossTop.tid);
 			packetlossTop.tid = null;
+			if(packetlossTop.logging) logger.smartlog("packetlossTop.js: Some thread killed while sleeping ;)");
 		}
-		packetlossTop.process = false;
+		packetlossTop.threadid++;
+		packetlossTop.running = false;
 	},
 
 	restart: function() {
@@ -61,6 +74,7 @@ var packetlossTop = {
 	},
 
 	setRefreshDelay: function(delay) {
+		if(packetlossTop.logging) logger.smartlog("packetlossTop.js: Changed refresh delay to " + delay + "...");
 		if(delay == 0)
 			packetlossTop.stop();
 		else {
@@ -71,125 +85,90 @@ var packetlossTop = {
 
 	refresh: function() {
 		packetlossTop.__file2buffer();
-		packetlossTop.__buffer2host();
-		packetlossTop.__buffer2top1();
-		packetlossTop.__buffer2top2();
+		packetlossTop.__buffer2arr();
 	},
 
 	__file2buffer: function() {
+		if(packetlossTop.logging) logger.smartlog("packetlossTop.js: Reading file...");
 		packetlossTop.request = new Request();
 		packetlossTop.request.request(packetlossTop.topfilename, {}, packetlossTop.rhandler_closure()); // continue async
 	},
 
-	__buffer2misc: function() {
-		packetlossTop.miscarr = new Array();
+	__buffer2arr: function() {
+		packetlossTop.arr = new Array();
 
 		for(var i = 0; i < packetlossTop.bufferarr.length; i++) {
-			var arr = packetlossTop.bufferarr[i].split(";");
-			var mid = arr[0];
-			if(mid == "misc") {
-				var id    = arr[1];
-				var label = arr[2];
-				var value = arr[3];
-
-				if(id == "ts") {
-					packetlossTop.uptodate = (value > packetlossTop.last_ts);
-					packetlossTop.last_ts = value;
-				}
-				if(id == "ts" || id == "starttime") {
-					d = new Date();
-					d.setTime(value + "000");
-					value = (d.getHours() < 10 ? "0" + d.getHours() : d.getHours()) + 
-					        ":" +
-					        (d.getMinutes() < 10 ? "0" + d.getMinutes() : d.getMinutes()) +
-					        ":" +
-					        (d.getSeconds() < 10 ? "0" + d.getSeconds() : d.getSeconds()) +
-					        " " +
-					        d.getDate() +
-					        " " +
-					        monthNumberToLongName[d.getMonth()] +
-					        " " +
-					        d.getFullYear();
-				}
-				packetlossTop.miscarr.push({id: id, label: "", value: value});
+			var record = packetlossTop.bufferarr[i].split(";");
+			var category = record[0];
+			var h0       = record[1];
+			var d0       = record[2];
+			var relation = record[3];
+			var h1       = record[4];
+			var d1       = record[5];
+			var id       = record[6];
+			var label    = record[7];
+			var value    = record[8];
+			var unit     = record[9];
+
+			if(id == "ts") {
+				packetlossTop.uptodate = (parseInt(value) + packetlossTop.last_ts_tolerance) > packetlossTop.last_ts;
+				packetlossTop.last_ts_tolerance = 0;
+				packetlossTop.last_ts = parseInt(value);
 			}
-		}
-	},
-
-	__buffer2host: function() {
-		for(var i = 0; i < packetlossTop.bufferarr.length; i++) {
-			var arr = packetlossTop.bufferarr[i].split(";");
-			var hid = arr[0];
-			if(hid == "host") {
-				var hid    = arr[1];
-				var id    = arr[2];
-				var label = arr[3];
-				var value = arr[4];
-				packetlossTop.hostarr.push({
-					id: hid,
-					value: {
-						id   : id,
-						label: label,
-					  value: value
-					}
-				});
-			}
-		}
-	},
-
-	__buffer2top1: function() {
-		packetlossTop.top1arr = new Array();
-
-		for(var i = 0; i < packetlossTop.bufferarr.length; i++) {
-			var arr = packetlossTop.bufferarr[i].split(";");
-			var tid = arr[0];
-			if(tid == "top") {
-				var id    = arr[1];
-				var label = arr[2];
-				var value = arr[3];
-				packetlossTop.top1arr.push({
-					id   : id,
-          label: label,
-				  value: value
-				});
+			if(id == "ts" || id == "starttime") {
+				d = new Date();
+				d.setTime(value + "000");
+				value = (d.getHours() < 10 ? "0" + d.getHours() : d.getHours()) + 
+				        ":" +
+				        (d.getMinutes() < 10 ? "0" + d.getMinutes() : d.getMinutes()) +
+				        ":" +
+				        (d.getSeconds() < 10 ? "0" + d.getSeconds() : d.getSeconds()) +
+				        " " +
+				        d.getDate() +
+				        " " +
+				        monthNumberToLongName[d.getMonth()] +
+				        " " +
+				        d.getFullYear();
 			}
+			packetlossTop.arr.push({category: category, h0: h0, d0: d0, relation: relation, h1: h1, d1: d1, id: id, label: label, value: value, unit: unit});
 		}
+		if(packetlossTop.debug && packetlossTop.logging) logger.smartlog("packetlossTop.js: Stored " + packetlossTop.arr.length + " records");
 	},
 
-	__buffer2top2: function() {
-		packetlossTop.top2arr = new Array();
-
-		for(var i = 0; i < packetlossTop.bufferarr.length; i++) {
-			var arr = packetlossTop.bufferarr[i].split(";");
-			var tid = arr[0];
-			if(tid == "protocol") {
+	buildHostArr: function() {
+		for(var i = 0; i < packetlossTop.arr.length; i++) {
+			var record = packetlossTop.arr[i];
+			if(record["id"] == "hostname" && record["h0"] != "*") {
+				var h0    = record["h0"];
+				var value = record["value"];
+				packetlossTop.hostarr.push({