<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Readings</title>
<link rel="stylesheet" type="text/css" href="wifi_style.css"></link>
<link rel="stylesheet" type="text/css" href="readings.css"></link>
<script type="text/javascript" src="js/prototype/prototype.js"></script>
<script type="text/javascript" src="js/bramus/jsProgressBarHandler.js"></script>
</head>
<body onload='create()'>
<script type="text/javascript"> 
var xmlhttp;
var NUMOFTRANSMITTERS = 12;
function request(url)
{
    var params="user=datetime&seq=12345678";
	xmlhttp=GetXmlHttpObject();
	if (xmlhttp!=null)
	{
		xmlhttp.open("POST",url,true);
		xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.setRequestHeader("Content-length", params.length);
        xmlhttp.setRequestHeader("Connection", "close");
	    xmlhttp.onreadystatechange=stateChanged;
		xmlhttp.send(params);
	}
	else
	{
		alert("Your browser does not support XMLHTTP.");
	}
}
function GetXmlHttpObject()
{
    xmlhttp=null;
	if (window.XMLHttpRequest)
  	{
		xmlhttp=new XMLHttpRequest();
	}
	else if (window.ActiveXObject)
	{
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
    return xmlhttp;
}
function stateChanged() {
	if (xmlhttp.readyState==4) {
		if(xmlhttp.status==200)	{
			document.getElementById("msgboard").style.display="none";
			document.getElementById("dashboard").style.display="inline-block";
		
			var response = xmlhttp.responseText;
			var res=response.split("\n");
			var tx_cnt=0;
			for (i=0;i<res.length;i++) {
				var field = res[i].split(",");
				if(field.length>=10 && tx_cnt<NUMOFTRANSMITTERS) {//otherwise it is some unrelated info/page
					for(var j=0;j<field.length;j++) {
						var getStr = field[j].split("=");
						if(getStr.length >=1 ) {
							var value = "";
							for(var k=1;k<getStr.length;k++)
								value += getStr[k]+" ";
							value = value.substring(0,value.length-1);
							if(getStr[0]=="ip"||getStr[0]=="label"
							||getStr[0]=="rlabel1"||getStr[0]=="rd1"
							||getStr[0]=="rlabel2"||getStr[0]=="rd2"
							||getStr[0]=="rlabel3"||getStr[0]=="rd3"
							||getStr[0]=="rlabel4"||getStr[0]=="rd4"
							||getStr[0]=="lastupdate") {
								document.getElementById(getStr[0]+tx_cnt).innerHTML = value;
							}
							else if(getStr[0]=="mac") {
								document.getElementById(getStr[0]+tx_cnt).innerHTML = value.substring(9);
								var macNoColon=value.split(":");
								document.getElementById('hyperName'+tx_cnt).href = "servlet2?MAC="+macNoColon[0]+macNoColon[1]+macNoColon[2]+macNoColon[3]+macNoColon[4]+macNoColon[5];
							}
							else if((getStr[0]=="runit1"||getStr[0]=="runit2"||getStr[0]=="runit3"||getStr[0]=="runit4")){
								document.getElementById(getStr[0]+tx_cnt).innerHTML = value;
								var clr="black";
								if(value=="C"||value=="F") {
									clr = "rgb(138,66,0)";
								}
								else if(value=="%") {
									clr = "rgb(0,0,204)";
								}
								else if(value=="hPa"||value=="inHg"||value=="mmHg") {
									clr = "rgb(0,128,0)";
								}
								else {
									clr = "rgb(96,96,96)";
								}
								var index=getStr[0].charAt(5);
								document.getElementById("rlabel"+index+tx_cnt).style.color = clr;
								var rdclr = clr;
								var rd = document.getElementById("rd"+index+tx_cnt).innerHTML;
								if(rd=="Open"||rd=="Disabled"||rd=="Cal"||rd=="Lost")
									rdclr = "rgb(255,0,0)";
								document.getElementById("rd"+index+tx_cnt).style.color = rdclr;
								document.getElementById("runit"+index+tx_cnt).style.color = clr;
							}
							else if(getStr[0]=="signal") {
								var msg="";
								var clr="black";
								if(value>75)
									msg="Excellent";
								else if(value>50)
									msg="Good";
								else if(value>25)
									msg="Fair";
								else {
									msg="Poor";
									clr="red";
								}
								document.getElementById(getStr[0]+tx_cnt).innerHTML = msg;
								document.getElementById(getStr[0]+tx_cnt).style.color = clr;
								signalbararray[tx_cnt].setPercentage(value);
							}
							else if(getStr[0]=="batt") {
								var msg="";
								var clr="black";
								if(value>0.9)
									msg="Good";
								else {
									msg="Poor";
									clr="red";
								}
								document.getElementById(getStr[0]+tx_cnt).innerHTML = msg;
								document.getElementById(getStr[0]+tx_cnt).style.color = clr;
								value=(value-0.6)*100;// /(1.6-0.6)=/1;
								battbararray[tx_cnt].setPercentage(parseInt(value));
							}
							else if(getStr[0]=="errMsg1") {
								if(value=='Lost') {
									document.getElementById(getStr[0]+tx_cnt).style.display = "block";
									document.getElementById("signalbar"+tx_cnt).style.display = "none";
									document.getElementById("battbar"+tx_cnt).style.display = "none";
									document.getElementById("batt"+tx_cnt).style.color = "#7F7F7F";
									document.getElementById("signal"+tx_cnt).style.color = "#7F7F7F";
								}
								else {
									document.getElementById(getStr[0]+tx_cnt).style.display = "none";
									document.getElementById("signalbar"+tx_cnt).style.display = "inline-block";
									document.getElementById("battbar"+tx_cnt).style.display = "inline-block";
								}									
							}
						}
					}
					document.getElementById("transmitter"+tx_cnt).style.display="inline-block";
					tx_cnt++;
				}
				else
				{
					var getStr = field[0].split("=");
					if(getStr[0]=="totaltransmitters") {
						totaltransmitters = getStr[1];
						if((start+count)>=totaltransmitters)
							document.getElementById('next').style.display="none";
						else
							document.getElementById('next').style.display="block";
					}
					else if(getStr[0].indexOf("<!DOCTYPE") === 0)
					{
						document.getElementById("boardmsg").innerHTML="Please refresh";
						document.getElementById("msgboard").style.display="block";
						document.getElementById("dashboard").style.display="none";						
					}
				}
			}
			for(var j=tx_cnt;j<NUMOFTRANSMITTERS;j++)
			{
				document.getElementById("transmitter"+j).style.display="none";
			}
			//reset coupon size if needed
			if(tx_cnt==0) {
				document.getElementById("boardmsg").innerHTML="No device detected";
				document.getElementById("msgboard").style.display="block";
				document.getElementById("dashboard").style.display="none";
			}
			if(tx_cnt<=2) {
				var divs = new Array('transmitterDiv','row1','label','rlabel','reading','unit','rowType3','statusLabel','errMsg1');
				for(var i=0;i<divs.length;i++)
				{
					replaceClass(divs[i],divs[i]+'Big');
				}
			}
			else {
				var divs = new Array('transmitterDiv','row1','label','rlabel','reading','unit','rowType3','statusLabel','errMsg1');
				for(var i=0;i<divs.length;i++)
				{
					replaceClass(divs[i]+'Big',divs[i]);
				}
			}
		}
		else
		{
			document.getElementById("boardmsg").innerHTML="No response";
			document.getElementById("msgboard").style.display="block";
			document.getElementById("dashboard").style.display="none";
		}
	}
}
function replaceClass(oldclassname,newclassname) {
	node = document.getElementsByTagName("body")[0];
	var els = node.getElementsByTagName("*");
	for(var i=0,j=els.length; i<j; i++)
	{
		if(els[i].className==oldclassname)
			els[i].className=newclassname;
	}
	return;
}
function create() {
	var signalbar;
	var battbar;
	for(var i=0;i<NUMOFTRANSMITTERS;i++) {
		signalbar = "signalbar"+i;
		signalbararray[i] = new JS_BRAMUS.jsProgressBar(
			$(signalbar),
			0,
			{
			showText	: false,
			animate		: false,
			width		: 80,
			height		: 8,
			boxImage	: 'images/bramus/custom1_box.gif',
			barImage	: 'images/bramus/custom2_bar.png'
			}
		);
		battbar = "battbar"+i;
		battbararray[i] = new JS_BRAMUS.jsProgressBar(
			$(battbar),
			0,
			{
			showText	: false,
			animate		: false,
			width		: 80,
			height		: 8,
			boxImage	: 'images/bramus/custom1_box.gif',
			barImage	: 'images/bramus/custom2_bar.png'
			}
		);
	}
}
var start=0;
var count=12;
var totaltransmitters=0;
function nextHandler()
{
	start+=count;
	if(start>=totaltransmitters)
		start=totaltransmitters-1;
	if(start<=0)
		document.getElementById('prev').style.display="none";
	else
		document.getElementById('prev').style.display="block";
	clearInterval(intervalid);
	intervalid=setInterval("request('readingsRsp?start="+start+"&count="+count+"')",2000);
}
function prevHandler()
{
	start-=count;
	if(start<0)
		start=0;
	clearInterval(intervalid);
	intervalid=setInterval("request('readingsRsp?start="+start+"&count="+count+"')",2000);
	if(start<=0)
		document.getElementById('prev').style.display="none";
	else
		document.getElementById('prev').style.display="block";
}
</script>

<div id="wrap">
<div id="tabs">
<ul>
	<li id="current"><a href="reading_html"><span>Readings</span></a></li>
	<li><a href="flashChartConf"><span>Chart</span></a></li>		
	<li><a href="servlet2"><span>Setup</span></a></li>
	<li><a href="retrieveSet"><span>Data</span></a></li>
</ul>
</div>
<div id='header'> &#160; </div>

<div style="display:inline-block;height:100px;text-align:center;font-weight:bold;" name="msgboard" id="msgboard">
<span name="boardmsg" id="boardmsg">Loading ...</span>
</div>
<div class="displayAreaDiv" name="dashboard" id="dashboard">
<script type="text/javascript">
var signalbararray = new Array();
var battbararray = new Array();
for(var i=0;i<NUMOFTRANSMITTERS;i++)
{
	if(i%4==0)
		document.write("<div>");
	
	document.write(
	"<span class='transmitterDiv' id='transmitter"+i+"' name='transmitter"+i+"'>"+
		"<div class='row1'>"+
			"<span class='ipaddress' id='ip"+i+"' name='ip"+i+"'></span><span id='mac"+i+"' name='mac"+i+"'></span>"+
		"</div>"+
		"<div class='rowType1'>"+
			"<a class='hypername' id='hyperName"+i+"' name='hyperName"+i+"' href=''><span class='label' id='label"+i+"' name='label"+i+"'></span></a>"+
		"</div>"+
		"<div class='rowType2'>"+
			"<span class='rlabel' id='rlabel1"+i+"' name='rlabel1"+i+"'></span><span class='reading' id='rd1"+i+"' name='rd1"+i+"'></span><span class='unit' id='runit1"+i+"' name='runit1"+i+"'></span>"+
		"</div>"+
		"<div class='rowType2'>"+
			"<span class='rlabel' id='rlabel2"+i+"' name='rlabel2"+i+"'></span><span class='reading' id='rd2"+i+"' name='rd2"+i+"'></span><span class='unit' id='runit2"+i+"' name='runit2"+i+"'></span>"+
		"</div>"+
		"<div class='rowType2'>"+
			"<span class='rlabel' id='rlabel3"+i+"' name='rlabel3"+i+"'></span><span class='reading' id='rd3"+i+"' name='rd3"+i+"'></span><span class='unit' id='runit3"+i+"' name='runit3"+i+"'></span>"+
		"</div>"+
		"<div class='rowType2'>"+
			"<span class='rlabel' id='rlabel4"+i+"' name='rlabel4"+i+"'></span><span class='reading' id='rd4"+i+"' name='rd4"+i+"'></span><span class='unit' id='runit4"+i+"' name='runit4"+i+"'></span>"+
		"</div>"+
		"<div class='rowType3'>"+
			"<span class='status' id='signal"+i+"' name='signal"+i+"'></span><span class='statusLabel'>Signal </span><span id='signalbar"+i+"' name='signalbar"+i+"'></span>"+
		"</div>"+
		"<div class='rowType3'>"+
			"<span class='status' id='batt"+i+"' name='batt"+i+"'></span><span class='statusLabel'>Battery </span><span id='battbar"+i+"' name='battbar"+i+"'></span>"+
		"</div>"+
		"<div class='row1'>"+
			"<span class='lastupdate' id='lastupdate"+i+"' name='lastupdate"+i+"'></span><span>Updated</span>"+
		"</div>"+
		"<div class='errMsg1' id='errMsg1"+i+"' name='errMsg1"+i+"'> Lost </div>"+
	"</span>"
	);
	
	if(i%4==3)
		document.write("</div>");
}
for(var j=0;j<NUMOFTRANSMITTERS;j++)
{
	document.getElementById("transmitter"+j).style.display="none";
}
var intervalid=setInterval("request('readingsRsp?start=0&count=12')",2000);
</script>

<div style='text-align: left;'>
<span style='margin-left:50px;display:inline-block;width:50px'><a style='display:none' id='prev' name='prev' href="#" onClick='prevHandler();return false;'>Prev</a></span>
<span style='margin-right:50px;float:right'><a style='display:none' id='next' name='next' href="#" onClick='nextHandler();return false;'>Next</a></span>
</div>

</div>

</div>
</body>
</html>
