...

View Full Version : Abstracting functions



pthartmann
03-29-2011, 09:17 PM
It seems a better approach would be to use jquery and an AJAX manager.

However, as I'm new'er to Javascript - and my functions seem to work independently, I thought I would seek help working with what I have:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
<style type=text/css>
DIV {COLOR: #009900; }
</style>
<TITLE>Universal Ground Station</TITLE>

<script type="text/javascript">
var state = 4;

function ajax_object() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
} else if(window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
} else {
alert("Your Browser does not support AJAX!\nTry Firefox?");
}
}

function ajax_request(url, data, callback)
{
var xhrobj = ajax_object();
xhrobj.open("GET", url);
xhrobj.setRequestHeader("X-Requested-With", "XMLHttpRequest");

xhrobj.onreadystatechange = function()
{
if (xhrobj.readyState == 4 && xhrobj.status == 200)
{
if (xhrobj.responseText)
{
callback(xhrobj.responseText);
}
}
};
xhrobj.send(data);
}

//XmlHttpRequest object
var directionReq = ajax_object();

function setdirection(directionstate) {
state = directionstate;
//alert("directionstate: " + directionstate);
if (directionReq.readyState == 4 || directionReq.readyState == 0) {
//ajax_request('http://192.168.1.120/shp.shp?directionstate=' + directionstate + '&ms=' + new Date().getTime(), null, function(data){ return });
directionReq.open("GET", 'http://192.168.1.120/shp.shp?directionstate=' + directionstate + '&ms=' + new Date().getTime(), true);

directionReq.onreadystatechange = handledirectionState;
directionReq.send(null);
state = 4;
}
}

function handledirectionState() {

if (directionReq.readyState == 4) {

var div = document.getElementById('directionStatusIndicator');
var str = directionReq.responseText;
//alert("response: " + directionReq);
div.innerHTML = str;

if ((typeof(str) == 'undefined') || (str == '')) {
if (state > '0') {
div.innerHTML = "<strong style='color:orange;font-size:26px;'>On</strong>";
} else {
div.innerHTML = "<strong style='color:gray;font-size:26px;'>Waiting for input</strong>";
}
} else {
div.innerHTML = str;
}
}
}
var xmlhttp = ajax_object();
function loadXMLDoc(url)
{

var txt,x,xx,i, j;
//ajax_request("send.xml", null, function(data){ return });
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
txt="<table border='1'><tr><th>Acceleration X</th><th>Acceleration Y</th><th>Acceleration Z</th><th>Roll Degrees</th><th>Pitch Degrees</th><th>Yaw Degrees</th></tr>";
x=xmlhttp.responseXML.documentElement.getElementsByTagName("DATA");
for (i=0;i<x.length;i++)
{
txt=txt + "<tr>";
xx=x[i].getElementsByTagName("A_X");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[i].getElementsByTagName("A_Y");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[i].getElementsByTagName("A_Z");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[i].getElementsByTagName("R_D");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[i].getElementsByTagName("P_D");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[i].getElementsByTagName("Y_D");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
txt=txt + "</tr>";
}

txt=txt + "</table>";

document.getElementById('txtDATAInfo').innerHTML=txt;

txt="<table border='1'><tr><th>Altitude in Inches</th><th>Behavior</th><th>Heading</th><th>Location</th><th>Battery Life</th><th>Sensor Feedback</th></tr>";
x=xmlhttp.responseXML.documentElement.getElementsByTagName("DATA");
for (j=0;j<x.length;j++)
{

txt=txt + "<tr>";
xx=x[j].getElementsByTagName("A_I");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[j].getElementsByTagName("B");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[j].getElementsByTagName("H");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[j].getElementsByTagName("L");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[j].getElementsByTagName("B_L");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
xx=x[j].getElementsByTagName("S_F");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td> </td>";
}
}
txt=txt + "</tr>";
}

txt=txt + "</table>";


document.getElementById('txtDATA2Info').innerHTML=txt;
}
}
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function begin(a)
{
state = a
if (state == '0') {(setdirection(0));}
else if (state == '1') {
clearInterval(refreshIntervalId);
(setdirection(1));
}
else if (state == '2') {
clearInterval(refreshIntervalId);
(setdirection(2));
}
else if (state == '3') {
clearInterval(refreshIntervalId);
(setdirection(3));
}
else {
var refreshIntervalId = (setInterval("loadXMLDoc('send.xml')",1100));
}
//else {}

}
</script>
</head>
<body bgcolor="#000000" onLoad="begin(4);">
<div align=center><table border="10"cellpadding="0"cellspacing="1"width="640"height="480"><tr><td bgcolor="white"align="center"valign="middle"><img src="http://192.168.1.101:8070/video.mjpg"></td></tr></table></div><br>
<div align=center> <input type="button" name="Up" value="Up" onclick="begin(0)" /><br>
<input type="button" name="Left" value="Left" onclick="begin(1)" />
<input type="button" name="Right" value="Right" onclick="begin(2)" /><br>
<input type="button" name="Down" value="Down" onclick="begin(3)" />

<div id="directionStatusIndicator"><strong style="color:green">Waiting for input.</strong> </div>
</div><br>
<div align="center" id="txtDATAInfo">
</div><br>
<div align="center" id="txtDATA2Info">
</div>

</body>
</html>

Basically, I'm trying to continuously parse an XML file. Concurrently, with a user input, I'm trying to write to a div.innerHTML.

Both functions work independently. I was advised they would work together if I abstracted the functions. I've tried, repeatedly, please help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum