Real-time Environmental Monitoring

This topic has 1 reply, 1 voice, and was last updated 9 years, 1 month ago by Coos.

Viewing 2 posts - 1 through 2 (of 2 total)

Author

Posts

March 23, 2015 at 11:12 pm #1673

Participant

I want my arduino home server application that has a web-interface to display a partial content of the uRM JSON page. So that only the cpm data can be embedded somewhere in the existing webpage that is sent by the arduino.
The Arduino server cannot be a client at the same time for reading the uRM data so it should be done on the client side.
Possibly it can be done with a java script.
My knowledge of java script is minimal.

Has someone here written something a script like that, and is willing to share that ?
Or does there exist a ready script to do this trick ?

The code my arduino-server sents to the client is this:


<!DOCTYPE html><html><head>
<meta name="viewport" content="width=339, initial-scale=1.0, minimum-scale=1.0" >
<script>
function GAI()
{nocache="&nocache="+Math.random()*1000000;
var request=new XMLHttpRequest();
request.onreadystatechange=function()
{if(this.readyState==4)
{if(this.status==200)
{if(this.responseXML!=null)
{document.getElementById("INPC").innerHTML=this.responseXML.getElementsByTagName("SbC")[0].childNodes[0].nodeValue;
document.getElementById("INP0").innerHTML=this.responseXML.getElementsByTagName("Sb")[0].childNodes[0].nodeValue;
document.getElementById("ARY0").innerHTML=this.responseXML.getElementsByTagName("Ai")[0].childNodes[0].nodeValue;
document.getElementById("INP1").innerHTML=this.responseXML.getElementsByTagName("Sb")[1].childNodes[0].nodeValue;
document.getElementById("ARY1").innerHTML=this.responseXML.getElementsByTagName("Ai")[1].childNodes[0].nodeValue;
document.getElementById("INP2").innerHTML=this.responseXML.getElementsByTagName("Sb")[2].childNodes[0].nodeValue;
document.getElementById("ARY2").innerHTML=this.responseXML.getElementsByTagName("Ai")[2].childNodes[0].nodeValue;
document.getElementById("INP3").innerHTML=this.responseXML.getElementsByTagName("Sb")[3].childNodes[0].nodeValue;
document.getElementById("ARY3").innerHTML=this.responseXML.getElementsByTagName("Ai")[3].childNodes[0].nodeValue;
document.getElementById("INP4").innerHTML=this.responseXML.getElementsByTagName("Sb")[4].childNodes[0].nodeValue;
document.getElementById("ARY4").innerHTML=this.responseXML.getElementsByTagName("Ai")[4].childNodes[0].nodeValue;
document.getElementById("INP5").innerHTML=this.responseXML.getElementsByTagName("Sb")[5].childNodes[0].nodeValue;
document.getElementById("ARY5").innerHTML=this.responseXML.getElementsByTagName("Ai")[5].childNodes[0].nodeValue;
document.getElementById("INP6").innerHTML=this.responseXML.getElementsByTagName("Sb")[6].childNodes[0].nodeValue;
document.getElementById("ARY6").innerHTML=this.responseXML.getElementsByTagName("Ai")[6].childNodes[0].nodeValue;
document.getElementById("INP7").innerHTML=this.responseXML.getElementsByTagName("Sb")[7].childNodes[0].nodeValue;
document.getElementById("ARY7").innerHTML=this.responseXML.getElementsByTagName("Ai")[7].childNodes[0].nodeValue;
document.getElementById("INP8").innerHTML=this.responseXML.getElementsByTagName("Sb")[8].childNodes[0].nodeValue;
document.getElementById("ARY8").innerHTML=this.responseXML.getElementsByTagName("Ai")[8].childNodes[0].nodeValue;
document.getElementById("INP9").innerHTML=this.responseXML.getElementsByTagName("Sb")[9].childNodes[0].nodeValue;
document.getElementById("ARY9").innerHTML=this.responseXML.getElementsByTagName("Ai")[9].childNodes[0].nodeValue;
}}}}
request.open("GET","Ajax"+nocache,true);
request.send(null);
setTimeout("GAI()",16385);}
function GR(Rb)
{var str="";
str=Rb.name+"="+Rb.value;
var nocache="nocache="+Math.random()*1000000;
var request=new XMLHttpRequest();
request.open("GET","Ajax?"+"&"+str+nocache,true);
request.send(null);}
</script>
<style>
body{background-color:#272010;font-family:arial;}
h3{font-size:90%;color:#FF7733;}
p{font-size:126%;color:#FFFFFF;}
b{color:#272010;}
</style>
</head>
<body onload="GAI()">
<form>
<div>
<p><h3> ON<b>___</b>OFF<b>___</b>AUTO<b>___</b>v.303 - Updated - <span id="INPC">_</span></h3></p>
<p><input type="radio"name="L0"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L0"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L0"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY0">_</span> <b>__</b><span id="INP0">_</span><b>_</b>IP-Camera </p>
<p><input type="radio"name="L1"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L1"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L1"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY1">_</span> <b>__</b><span id="INP1">_</span><b>_</b>Living    </p>
<p><input type="radio"name="L2"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L2"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L2"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY2">_</span> <b>__</b><span id="INP2">_</span><b>_</b>Bedroom   </p>
<p><input type="radio"name="L3"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L3"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L3"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY3">_</span> <b>__</b><span id="INP3">_</span><b>_</b>Kitchen   </p>
<p><input type="radio"name="L4"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L4"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L4"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY4">_</span> <b>__</b><span id="INP4">_</span><b>_</b>Washroom  </p>
<p><input type="radio"name="L5"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L5"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L5"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY5">_</span> <b>__</b><span id="INP5">_</span><b>_</b>Fake TV   </p>
<p><input type="radio"name="L6"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L6"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L6"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY6">_</span> <b>__</b><span id="INP6">_</span><b>_</b>IKEA Lamp </p>
<p><input type="radio"name="L7"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L7"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L7"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY7">_</span> <b>__</b><span id="INP7">_</span><b>_</b>Kitchen   </p>
<p><input type="radio"name="L8"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L8"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L8"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY8">_</span> <b>__</b><span id="INP8">_</span><b>_</b>Backlight </p>
<p><input type="radio"name="L9"value="ON"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L9"value="OF"onclick="GR(this);"/><b>__</b>
<input type="radio"name="L9"value="NO"onclick="GR(this);"/><b>___</b>
<span id="ARY9">_</span> <b>__</b><span id="INP9">_</span><b>_</b>Reserve   </p>
</div></form></body></html>

The javascript in this source was not written by me, I just wrote the html part with a lot of help from this excellent tutorial:

This topic was modified 9 years, 1 month ago by uRADMonitor. Reason: moved to community section

March 23, 2015 at 11:13 pm #1674

Coos

Participant

the link vanished, so this link :
http://startingelectronics.com/tutorials/arduino/ethernet-shield-web-server-tutorial/

Author

Posts

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

Java script for reading uRM data ?