<!DOCTYPE html> <html> <!--<META http-equiv="refresh" content="60">--> <head> <title>DIY Radiation Monitor</title> <script src="jQuery.min.js"></script> </head> <body background="./static/chalk.jpg"> <center> <h1>DIY Radiation Monitor</h1> <hr> <table width="750" border="0" cellpadding="1"> <tr> <td align="center"> <b><font size="5"> <text id="date"></text> <text id="time"></text> </font></b> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td width="50%" align="center"> <b><font size="5"> Current Reading </font></b> <br><br> <b><font size="4"> Counts per minute: <text id="cpm"></text><br> Counts per second: <text id="cps"></text><br> uSv per hour: <text id="uSvPerHr"></text> </font></b> </td> <td width="50%" align="center" valign="center"> <b><font size="5"> Device Status </font></b> <br><br> <b><font size="4"> Mode: <text id="mode"></text><br> Status: <text id="status"></text> </font></b> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td align="center"> <img id="1-day-cpm"> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td align="center"> <img id="1-day-uSv"> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td align="center"> <img id="4-week-cpm"> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td align="center"> <img id="4-week-uSv"> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td align="center"> <img id="1-year-cpm"> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td align="center"> <img id="1-year-uSv"> </td> </tr> </table> </td> </tr> <tr> <td> <table width="100%" border="1", cellpadding="10"> <tr> <td> <b>NOTES:</b> <li>For more information visit <a href="http://www.eugenemakerspace.com" target="_new"><i>www.eugenemakerspace.com</i></a> <li>Project plans and notes available at <a href="http://github.com/fractalxaos/Radmon" target="_new"><i>GitHub.com</i></a> </td> </tr> </table> </td> </tr> </table> </center> <script> function getRadmon() { $.ajaxSetup({cache:false, url: "dynamic/radmonData.js", success: function(result){ jStr = result.slice(1,-2); dataObj = JSON.parse(jStr); //data = dataObj.radmon; parseRadmon(dataObj); } }); $.ajax(); } function getGraphs() { document.getElementById("1-day-cpm").src = "dynamic/radGraph1.png"; document.getElementById("1-day-uSv").src = "dynamic/radGraph2.png"; document.getElementById("4-week-cpm").src = "dynamic/radGraph3.png"; document.getElementById("4-week-uSv").src = "dynamic/radGraph4.png"; document.getElementById("1-year-cpm").src = "dynamic/radGraph5.png"; document.getElementById("1-year-uSv").src = "dynamic/radGraph6.png"; } function parseRadmon(dataItem) { var timeStamp var date; var time; var sTmp; timeStamp = dataItem.time; if (timeStamp != "") { date = timeStamp.split(" ")[0]; time = timeStamp.split(" ")[1]; $("#date").text(date); $("#time").text(time); } else { $("#date").text(""); $("#time").text(""); } $("#cps").text(dataItem.CPS); $("#cpm").text(dataItem.CPM); $("#uSvPerHr").text(dataItem.uSvPerHr); sTmp = (dataItem.Mode).toLowerCase(); $("#mode").text(sTmp); $("#status").text(dataItem.status); if (dataItem.status == "online") { document.getElementById("status").style.color = "green"; } else { document.getElementById("status").style.color = "red"; } } $(document).ready(function() { getRadmon(); getGraphs(); setInterval(getRadmon, 1000); setInterval(getGraphs, 60000); }); </script> </body> </html>