Commit fe08dde1 authored by 's avatar
Browse files

Added new GUI (PHP, AJAX).


git-svn-id: file:///home/svn/mapi/trunk@1335 8d5bb341-7cf1-0310-8cf6-ba355fef3186
parent 712da03a
......@@ -7,6 +7,7 @@
#define CGI_FILENAME BASENAME".cgi"
#define CGI_PACKETCOUNT_FILENAME "packetcount.cgi"
#define TOP_FILENAME BASENAME"_top.html" // right frame
#define TOP_FILENAME_CSV BASENAME"_top.csv"
static char cgi_head[] = "\
#!/usr/bin/rrdcgi\n\
......
html {
margin: 0px;
padding: 0px;
color: black;
background-color: #E0E0E0;
}
body {
margin: 20px;
color: black;
background-color: #E0E0E0;
font-size: 0.8em;
font-family: Verdana, lucida, helvetica, arial, sans-serif;
}
h1, h2, h3, h4, h5 {
margin: 0em 0em 0.15em 0em;
font-family: Verdana, lucida, helvetica, arial, sans-serif;
}
h1 {
text-align: left;
font-size: 150%;
}
h2 {
text-align: left;
font-size: 120%;
}
h3 {
text-align: left;
font-weight: 500;
font-size: 110%;
}
h4 {
text-align: left;
font-weight: 300;
font-size: 110%;
}
h5 {
text-align: left;
font-weight: 300;
font-size: 100%;
}
table {
margin: 0.5em auto 0.5em auto;
width: 70%;
/* border-style: none; */
border-collapse: collapse;
/* border-spacing: 0em; */
}
.table {
margin: 0.5em auto 0.5em auto;
width: 70%;
}
.table table {
margin: 0em auto 0em auto;
width: 100%;
}
table caption {
margin: 0em auto;
line-height: 150%;
font-weight: bold;
}
table summary {
font-style: italic;
}
th {
text-align: center;
font-family: arial, Verdana, lucida, helvetica, sans-serif;
font-weight: bold;
/*font-size: 10pt;*/
}
td {
border: 1px solid black;
font-family: arial, helvetica, sans-serif;
text-align: center;
}
tr:hover, .tr:hover {
background-color: #FFFFFF;
}
table.vertical th {
text-align: left;
}
table th.horizontal {
text-align: center;
}
form {
margin: 0em;
}
form input.text,
form input.password,
form input.checkbox,
form textarea {
background-color: white;
}
form input.focused,
form textarea.focused {
background-color: yellow;
}
fieldset {
border-width: 1px;
border-color: black;
border-style: solid;
margin: 1em 0em;
padding: 0.5em;
}
legend {
font-weight: bold;
}
label {
white-space: nowrap;
}
.note {
font-style: italic;
font-size: 85%;
}
.line {
display: block;
}
.floatleft {
float: left;
margin: 0em;
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 */
}
<?php
# Includes {{{
$DIR = "../";
require_once "${DIR}lib/expire.php";
require_once "${DIR}lib/config.php";
# }}}
readfile("$config->packetloss_top");
//$content = "";
//$fp = fopen($config->packetloss_top, "r");
//while (!feof($fp)) $content .= fgets($fp, 4096);
//echo $content;
//fclose($fp);
// vim: set foldmethod=marker foldmarker=\ {{{,\ }}} foldclose= foldcolumn=0 :
?>
# 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"
# rrds
packetloss_rrd = "/path/to/packetloss/packetloss.rrd"
packetcount_rrd = "/path/to/packetloss/packetloss_packets.rrd"
# packetloss top file
packetloss_top = "/path/to/packetloss/packetloss_top.csv"
# enable or disable tops
enable_packetloss_top
#enable_appmon_top
# keep as is
output = "-"
<?php
# Includes {{{
$DIR="../";
require_once "${DIR}lib/expire.php";
require_once "${DIR}lib/graph.php";
# }}}
$allowed_args = ",predefined,start,end,width,height,upperLimit,lowerLimit,onlyGraph,title,";
foreach(array_keys($_GET) as $key) {
if(strpos($allowed_args,",$key,") !== false) {
$$key = $_GET[$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", $predefined, "", "", $width, $height);
else $graph = new Graph("packetcount", "", $start, $end, $width, $height, $title);
//$graph->dry_run();
$graph->flush();
// vim: set foldmethod=marker foldmarker=\ {{{,\ }}} foldclose= foldcolumn=0 :
?>
<?php
# Includes {{{
$DIR="../";
require_once "${DIR}lib/expire.php";
require_once "${DIR}lib/graph.php";
# }}}
$allowed_args = ",predefined,start,end,width,height,upperLimit,lowerLimit,onlyGraph,title,";
foreach(array_keys($_GET) as $key) {
if(strpos($allowed_args,",$key,") !== false) {
$$key = $_GET[$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", $predefined, "", "", $width, $height);
else $graph = new Graph("packetloss", "", $start, $end, $width, $height, $title);
//$graph->dry_run();
$graph->flush();
// vim: set foldmethod=marker foldmarker=\ {{{,\ }}} foldclose= foldcolumn=0 :
?>
This diff is collapsed.
/*
* File name: ajax.js
* Date: 2007/09/20 08:07
* Author: Ales Friedl <ales.friedl@email.cz>
*
*/
// Request {{{
Request = new Function();
Request.prototype.request = function(url, params, rhandler) {
this.url = url;
// when GET, append parameters to URL
if (Ajax.options.method == "get" && params) {
var paramstr = "";
for (var param in params) {
paramstr += (paramstr == "" ? "" : "&") + param + "=" + params[param];
}
this.url += (this.url.indexOf('?') > -1 ? '&' : '?') + paramstr;
}
try {
this.connection = Ajax.getConnection();
Ajax.openConnection(this.connection, this.url);
this.connection.onreadystatechange = this.onStateChange_closure(rhandler);
this.body = Ajax.getBody();
this.connection.send(this.body);
}
catch (e) {
//alert(e);
window.status = e;
}
}
Request.prototype.onStateChange_closure = function(rhandler) {
var request = this;
var rhandler = rhandler;
return function() {
if(Ajax.states[request.connection.readyState] == "Complete") {
if (!request.connection.status || (request.connection.status >= 200 && request.connection.status < 300)) {
rhandler(request);
}
else //alert("Ajax Request Error: " + request.connection.status);
window.status="Ajax Request Error: " + request.connection.status;
}
}
}
// }}}
// Object Literal Ajax {{{
Ajax = {
author: "Aleš Friedl",
version: "2.0",
exists: false,
autorun: true,
init: function() {
if(Ajax.exists) return false;
Ajax.exists = true;
if(Ajax.autorun) Ajax.start();
},
start: function() {
},
getConnection: function() {
try {
return new XMLHttpRequest()
} catch(e) {}
try {
return new ActiveXObject("Msxml2.XMLHTTP")
} catch(e) {}
try {
return new ActiveXObject("Microsoft.XMLHTTP")
} catch(e) {}
return false;
},
openConnection: function(connection, url) {
connection.open(Ajax.options.method.toUpperCase(), url, Ajax.options.asynchronous);
Ajax.setRequestsHeaders(connection);
},
setRequestsHeaders: function(connection) {
for (var header in Ajax.requestsHeaders) {
connection.setRequestHeader(header, Ajax.requestHeaders[header]);
}
},
getBody: function() {
return (Ajax.method == "post" ? Ajax.params : null);
},
states: ["Uninitialized", "Loading", "Loaded", "Interactive", "Complete"],
options: {
method: "get",
asynchronous: true
},
headers: {
contentType: "application/x-www-form-urlencoded",
encoding: "UTF-8"
},
requestHeaders: {
"X-Requested-With": "XMLHttpRequest",
"Accept": "text/javascript, text/html, application/xml, text/xml, */*",
"Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
}
}
// }}}
window_onDOMContentLoaded_add(Ajax.init);
// vim:foldmethod=marker:foldmarker=\ {{{,\ }}}:foldclose=:foldcolumn=0
/*
* Filename: dom.js
* Author: Aleš Friedl <ales.friedl@email.cz>
*
*/
document.createHTMLElement = function(name, attrarr) {
// if (document.createElementNS) {
// var elem = document.createElementNS("http://www.w3.org/1999/xhtml", name);
// var useNS = elem.setAttributeNS; // Opera
// }
// else {
var elem = document.createElement(name);
var useNS = false;
// }
if (typeof attrarr != "undefined") {
for (var i in attrarr) {
switch (i) {
case "text": elem.appendChild(document.createTextNode(attrarr[i])); break;
case "class": elem.className = attrarr[i]; break;
case "style":
if(useNS) {
elem.setAttributeNS("http://www.w3.org/1999/xhtml", i, attrarr[i]);
}
else {
elem.setAttribute(i, attrarr[i]);
}
//elem.style.setAttribute(i,attrarr[i]); // Redmond
elem.style.cssText = attrarr[i]; // Redmond
break;
case "id":
default:
if(useNS) {
elem.setAttributeNS("http://www.w3.org/1999/xhtml", i, "");
}
else {
elem.setAttribute(i, "");
}
elem[i] = attrarr[i]; // Opera
}
}
}
return elem;
}
// vim: set foldmethod=marker foldmarker=\ {{{,\ }}} foldclose= foldcolumn=0 :
/*
* Filename: misc.js
* Author: Aleš Friedl <ales.friedl@email.cz>
*
*/
function window_onload_add(f) {
if (!window.addEventListener && !window.attachEvent) return false;
if (window.addEventListener) window.addEventListener("load", f, false); // W3C
else window.attachEvent("onload", f); // Redmond
return true;
}
function window_onDOMContentLoaded_add(f) {
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", f, false);
}
window_onload_add(f); // Redmond
}
// MSIE only?
function window_onresize_add(f) {
if (!window.addEventListener && !window.attachEvent) return false;
if (window.addEventListener) window.addEventListener("resize", f, false); // W3C
else window.attachEvent("onresize", f); // Redmond
return true;
}
monthNumberToLongName = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
// vim: set foldmethod=marker foldmarker=\ {{{,\ }}} foldclose= foldcolumn=0 :
/*
* Filename: mouse.js
* Date: 2007/01/25 18:43
* Author: Aleš Friedl <ales.friedl@email.cz>
*
*/
// Object Literal mouse {{{
var mouse = {
author: "Aleš Friedl",
version: "0.2",
exists: false,
autorun: true,
MX: 0,
MY: 0,
seeX: 800,
seeY: 600,
init: function() {
if(mouse.exists) return false;
mouse.exists = true;
if(mouse.autorun) mouse.start();
},
start: function() {
document.onmousemove = mouse.mousemove;
//if(document.captureEvents) document.captureEvents(Event.MOUSEMOVE);
},
stop: function() {
document.onmousemove = null
//if(document.releaseEvents) document.releaseEvents(Event.MOUSEMOVE);
},
mousemove: function(e) {
if(mouse.exists) {
if(e) {
mouse.MX = e.pageX
mouse.MY = e.pageY
}
else {
mouse.MX = window.event.clientX + (document.documentElement?document.documentElement.scrollLeft:document.body.scrollLeft)
mouse.MY = window.event.clientY + (document.documentElement?document.documentElement.scrollTop:document.body.scrollTop)
}
if(window.innerWidth) {
mouse.seeX = window.innerWidth + window.pageXOffset - 22;
mouse.seeY = window.innerHeight + window.pageYOffset;
}
else {
mouse.seeX = document.body.offsetWidth + (document.documentElement?document.documentElement.scrollLeft:document.body.scrollLeft - 22);
mouse.seeY = document.body.offsetHeight + (document.documentElement?document.documentElement.scrollTop:document.body.scrollTop);
}
//if(mirage) mirage.show();
//window.status = "seeX: "+mouse.seeX+" seeY: "+mouse.seeY+" MX: "+mouse.MX+" MY: "+mouse.MY+"";
}
}
}
// }}}
window_onDOMContentLoaded_add(mouse.init);
// vim: set foldmethod=marker foldmarker=\ {{{,\ }}} foldclose= foldcolumn=0 :
</
/*
* File name: packetlossTop.js
* Date: 2007/09/20 08:48
* Author: Ales Friedl <ales.friedl@email.cz>
*
*/
// Object Literal packetlossTop {{{
var packetlossTop = {
author: "Aleš Friedl",
version: "0.1",
exists: false,
autorun: true,
topfilename: "data/packetloss_top.php",
init: function() {
if(packetlossTop.exists) return false;
packetlossTop.exists = true;
if(packetlossTop.autorun) packetlossTop.start();
},
request: null,
process: false,
loop: true,