graphs.html

asterisk 的图形管理界面

<!--
 * Asterisk-GUI	-	an Asterisk configuration interface
 *
 * SVG Graphing Capability For the Asterisk Gui.
 *
 * Copyright (C) 2006-2007, Digium, Inc.
 *
 * Brandon Kruse <[e-mail]>
 *
 * See http://www.asterisk.org for more information about
 * the Asterisk project. Please do not directly contact
 * any of the maintainers of this project for assistance;
 * the project provides a web site, mailing lists and IRC
 * channels for your use.
 *
 * This program is free software, distributed under the terms of
 * the GNU General Public License Version 2. See the LICENSE file
 * at the top of the source tree.
 *
-->
<script src="scripts/prototype.js"></script>
<script src="scripts/rico.js"></script>
<script src="scripts/astman.js"></script>
<script src="scripts/tooltip.js"></script>
<link href="stylesheets/rico.css" media="all" rel="Stylesheet" type="text/css" />
<link href="stylesheets/schwing.css" media="all" rel="Stylesheet" type="text/css" />

<script>

/* I am planning to add tons of graphs besides just CPU, this is more or less a Proof of Concept */
var tabs = new Array('tab1'); 
var divs_tohide = new Array('cpu_div');

function update_graph(graph) {
	var tmp_command = "sh /etc/asterisk/scripts/graphs.sh cpu > /var/lib/asterisk/static-http/config/graphs/data_cpu.html";
	parent.astmanEngine.run_tool(tmp_command);
	return true;
	}

function load_graphs() {
	var _sm = _$('status_message').style ;
	_sm.display = "" ;	
	
	var opt = {
		method: 'get',
		asynchronous: true,
		onComplete: function(originalRequest){
			_sm.display = 'none' ;
			_$('todaylog').innerHTML = (originalRequest.responseText) ? "<PRE>"+originalRequest.responseText.escapeHTML() +"</PRE>" : "No log messages found on this Day" ;
			
		},
		onFailure: function(t) {
			_sm.display = 'none' ;
			gui_alert("Config Error: " + t.status + ": " + t.statusText);
		}
	};
	opt.parameters="";
	var tmp = new Ajax.Request("graphs/cpu_data", opt);
	return true;
}

function show_window(x){
	for(i=0; i < tabs.length ; i++){
		document.getElementById(tabs[i]).className = "tab";
	}

	document.getElementById(tabs[x-1]).className = "tabselected";
	document.getElementById(tabs[x-1]).blur();

	clearInterval(interval_handler); /*stop our other real-time refreshers... */

	switch(x){
		case 1:
		var divs_toshow = new Array('cpu_div');
		var interval_handler = setInterval("update_graph()",5000);
		break;
	}
	for(var i=0; i < divs_tohide.length; i++ )
		_$(divs_tohide[i]).style.display = "none";
	for(var i=0; i < divs_toshow.length; i++ )
		_$(divs_toshow[i]).style.display = "";

	return true;
}

function getsysinfohtml(){
	var opt = {
		method: 'get',
		asynchronous: true,
		onComplete: function(originalRequest){
			_$('sysinfohtml').innerHTML = originalRequest.responseText;
			_$('osversion').innerHTML = _$('si_uname').innerHTML;
			_$('uptime').innerHTML = _$('si_uptime').innerHTML;
			_$('asterisk').innerHTML =_$('si_astver').innerHTML + "<BR>" + "Asterisk GUI-version " + asterisk_guiversion.substr(1) ;
			_$('today').innerHTML = _$('si_date').innerHTML;
			_$('hostname').innerHTML =_$('si_hostname').innerHTML;
			_$('ifconfig').innerHTML =_$('si_ifconfig').innerHTML;
			_$('diskusage').innerHTML = _$('si_du').innerHTML;
			_$('memoryusage').innerHTML =_$('si_free').innerHTML;

			var divs_toshow = new Array('osversion_div', 'uptime_div', 'asterisk_div', 'today_div','hostname_div');
			for(var i=0; i < divs_toshow.length; i++ ){ _$(divs_toshow[i]).style.display = ""; }

			document.getElementById(tabs[0]).className = "tabselected";
			load_todayslog();
		},
		onFailure: function(t) {
			_$('status_message').style.display='none';
			gui_alert("Config Error: " + t.status + ": " + t.statusText);
		}
	};
	opt.parameters="";
	var tmp = new Ajax.Request("./bkps/sysinfo_output.html", opt);
	return true;
}


function localajaxinit(){
	setWindowTitle("Resource and Monitoring Graphs");
	var date = new Date() ; 
	parent.loadscreen(this);
	show_window(1);
}

function free_mem(){
	if( navigator.userAgent.indexOf("MSIE") == -1 ){ return true; }
	try{
		purge( document.body );
	} catch(e){ }
}

</script>
<body id="foo" onload="localajaxinit()" bgcolor="EFEFEF"  onunload="free_mem()">
<div class="mainscreenTitleBar">
	<span style="margin-left: 4px;font-weight:bold;">Graphs: </span>
	<span style="cursor: pointer; cursor: hand;" onclick="window.location.href=window.location.href;" >&nbsp;<img src="images/refresh.png" title=" Refresh " border=0 >&nbsp;</span>
</div>
<div class="mainscreenContentBox" id="userscontent">
<table class="mainscreenTable" align="center">
	<tr valign="top" height="18">	
			<td align="left">

				<a href="#" class="tab" onclick="return show_window(1);" id="tab1"  onmouseover="show_tooltip('en', 'graph', 0);">CPU</a>&nbsp;&nbsp;
				<div id="graphshtml" style="display:none"></div>

				<div id="information" style=" border: solid 0px black; background: transparent; padding: 4px; height:440px; width:95%;">
						<BR>
						<div id="cpu_div" style="display:none">
								<div id="cpu" style="font-family:courier; font-size:10pt;"></div><BR>
								<embed id="cpu_embed" type="image/svg+xml" src="graphs/graph_cpu.svgz"
									width="500" height="250" /> 
						</div>
				</div>
			</td>
	</tr>
	<tr><td valign="top" align=center><div  id='status'></div></td></tr>
	<tr><td></td></tr>
</table>
</div>
</body>