Willamette Valley Mesh - Git Server
html/radmon.html
b528647b 
 <!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>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<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;
66d7b126 
       var hourminute;
b528647b
66d7b126 
       timeStamp = dataItem.date;
       if (timeStamp != "") {
b528647b 
         date = timeStamp.split(" ")[0];
         time = timeStamp.split(" ")[1];
66d7b126 
         hourminute = time.split(":")[0] + ":" + time.split(":")[1];
b528647b 
         $("#date").text(date);
66d7b126 
         $("#time").text(hourminute + " (PDT)");
b528647b 
       } else {
         $("#date").text("");
         $("#time").text("");
66d7b126 
       }
b528647b 
       
       $("#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();
66d7b126 
       setInterval(getRadmon, 10000);
b528647b 
       setInterval(getGraphs, 60000);
     });
 
   </script>
 </body>
 </html>