wip http display
authorEugene Crosser <crosser@average.org>
Tue, 22 Dec 2015 00:18:54 +0000 (03:18 +0300)
committerEugene Crosser <crosser@average.org>
Tue, 22 Dec 2015 00:18:54 +0000 (03:18 +0300)
web/index.html

index b29c00f6d7bbcc52c8906a2977a668b6e09dc619..2f99eeb4990b2db001697e88d896c54eb221ca79 100644 (file)
   function gotdata(data) {
     canvas = document.getElementById("plot");
     context = canvas.getContext("2d");
   function gotdata(data) {
     canvas = document.getElementById("plot");
     context = canvas.getContext("2d");
-    ww = canvas.offsetWidth;
-    wh = canvas.offsetHeight;
+    ww = canvas.width;
+    wh = canvas.height;
     tmin = data.range.lo;
     tmax = data.range.hi;
     tmin = data.range.lo;
     tmax = data.range.hi;
-    document.getElementById("cold").innerHTML = data.current.cold;
-    document.getElementById("hot").innerHTML = data.current.hot;
+    document.getElementById("cold").innerHTML = data.current.cold / 100;
+    document.getElementById("hot").innerHTML = data.current.hot / 100;
     drawplot(data.cold, "blue");
     drawplot(data.hot, "red");
   }
     drawplot(data.cold, "blue");
     drawplot(data.hot, "red");
   }
@@ -50,12 +50,13 @@ h1 {
   text-align: center;
 }
 br {
   text-align: center;
 }
 br {
-  clear: all;
+  clear: both;
 }
 div#currentvals {
 }
 div#currentvals {
-  width: 16em;
+  width: 14em;
   margin-left: auto;
   margin-right: auto;
   margin-left: auto;
   margin-right: auto;
+  margin-bottom: 10px;
   text-align: center;
   font-size: 150%;
 }
   text-align: center;
   font-size: 150%;
 }
@@ -63,7 +64,7 @@ div.current {
   position: relative;
   padding: 0.2em;
   border: solid 1px black;
   position: relative;
   padding: 0.2em;
   border: solid 1px black;
-  margin: 1em;
+  margin: 0.2em;
 }
 div#cold {
   float: left;
 }
 div#cold {
   float: left;
@@ -74,8 +75,13 @@ div#hot {
   background-color: #ffd0e0;
 }
 canvas#plot {
   background-color: #ffd0e0;
 }
 canvas#plot {
+  padding-left: 0;
+  padding-right: 0;
   margin-left: auto;
   margin-right: auto;
   margin-left: auto;
   margin-right: auto;
+  display: block;
+  width: 640px;
+  height: 480px;
   border: solid 1px black;
 }
 </style>
   border: solid 1px black;
 }
 </style>
@@ -95,6 +101,7 @@ canvas#plot {
 <script>
   var xmlhttp = new XMLHttpRequest();
   var url = "query.cgi";
 <script>
   var xmlhttp = new XMLHttpRequest();
   var url = "query.cgi";
+  var qstr = "?lo=2015-12-19+00:00:00&hi=2015-12-20+00:00:00";
 
   xmlhttp.onreadystatechange = function() {
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
 
   xmlhttp.onreadystatechange = function() {
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
@@ -103,7 +110,7 @@ canvas#plot {
       gotdata(myData);
     }
   }
       gotdata(myData);
     }
   }
-  xmlhttp.open("GET", url, true);
+  xmlhttp.open("GET", url+qstr, true);
   xmlhttp.send();
 </script>
 </body>
   xmlhttp.send();
 </script>
 </body>