commit f2808e50cd9e352d8a66990cea670b023b5445f4
parent 7621f510d49e4a97bcbf56608eba3f5f3d85eb86
Author: Dominik Schmidt <das1993@hotmail.com>
Date: Mon, 11 Jun 2018 01:20:29 +0000
Merge laundrysorcery.local:LaundrySorcery
Diffstat:
| www/details.html | | | 33 | +++++++++++++++++++++++++++++++++ |
| www/index.cgi | | | 73 | ++++++++++++++++++++++++++++++++++++++++++------------------------------- |
2 files changed, 75 insertions(+), 31 deletions(-)
diff --git a/www/details.html b/www/details.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<HTML>
+ <head>
+ <title>LaundrySorcery</title>
+ <meta charset="UTF-8"/>
+ <style type="text/CSS">
+ </style>
+ </head>
+ <body>
+ <div id="CtrlPanel"><form action="control.cgi" method="GET"><input type="submit" name="restart" value="Restart"/> <input type="submit" name="reboot" value="Reboot"/> <input type="submit" name="shutdown" value="Shutdown" /></form></div>
+ <H1>Light Sensor Data</H1>
+ <div id="SensorPanel">
+ <div><img src="light_5min.cgi" /></div>
+ <div><img src="light_1h.cgi" /></div>
+ <div><img src="light_1d.cgi" /></div>
+ </div>
+ <script type="text/javascript">
+ <!--
+ panel=document.getElementById("SensorPanel");
+ function updatePanels(){
+ panels=panel.getElementsByTagName("img");
+ for(i=0; i<panels.length; i++){
+ if(!panels[i].orig_src){
+ panels[i].orig_src=panels[i].src;
+ }
+ panels[i].src=panels[i].orig_src+"#"+new Date().getTime();
+ }
+ }
+ setInterval(updatePanels,10*1000);
+ -->
+ </script>
+ </body>
+</HTML>
diff --git a/www/index.cgi b/www/index.cgi
@@ -11,31 +11,63 @@ Content-Type: text/html
<title>LaundrySorcery</title>
<meta charset="UTF-8"/>
<style type="text/CSS">
- #statusLine{
+ body{
+ background-color:black;
+ color:gray;
+ font-family:sans;
+ }
+ #status{
text-align:center;
+ font-size:x-large;
+ }
+ #power{
+ font-size:xx-large;
+ }
+ .on #power{
+ color:limegreen;
+ text-shadow:0px 0px 2px;
+ }
+ .off #power{
+ color:#752222;
+ }
+ #footer{
+ position:fixed;
+ top:100%;
+ left:100%;
+ transform:translate(-100%,-100%);
+ font-size:small;
}
- #delta_t{
- font-weight:bold;
+ a{
+ color:gold;
}
</style>
</head>
<body>
- <div id="CtrlPanel"><form action="control.cgi" method="GET"><input type="submit" name="restart" value="Restart"/><input type="submit" name="reboot" value="Reboot"/> <input type="submit" name="shutdown" value="Shutdown" /></form></div>
- <H1>Laundry Status</H1>
- <div id="statusLine">The laundry machine is <span id="delta_t"></span></div>
+ <div id="status">
+ <div id="power">⏻</div>
+ <div id="delta_t"></div>
+ </div>
+ <div id="footer">
+ <a href="details.html">Details</a>
+ </div>
<script type="text/JavaScript">
<!--
delta_t=${RTIME};
function updateDisplay(){
var dt=document.getElementById("delta_t");
+ var st=document.getElementById("status");
+ var txt="";
+ var classn="";
if(delta_t < 0){
- dt.textContent="off since "+timeSince(-delta_t);
- dt.class="off";
+ txt="since "+timeSince(-delta_t);
+ classn="off";
}
else{
- dt.textContent="on since "+timeSince(delta_t);
- dt.class="on";
+ txt="since "+timeSince(delta_t);
+ classn="on";
}
+ dt.textContent=txt;
+ st.setAttribute("class",classn);
}
setInterval(function(){ if(delta_t>=0){delta_t++}else{delta_t--}; updateDisplay();}, 1000);
setInterval(function(){ readTextFile("print_delta_t.cgi");}, 5*1000);
@@ -76,27 +108,6 @@ Content-Type: text/html
updateDisplay();
-->
</script>
- <H1>Light Sensor Data</H1>
- <div id="SensorPanel">
- <div><img src="light_5min.cgi" /></div>
- <div><img src="light_1h.cgi" /></div>
- <div><img src="light_1d.cgi" /></div>
- </div>
- <script type="text/javascript">
- <!--
- panel=document.getElementById("SensorPanel");
- function updatePanels(){
- panels=panel.getElementsByTagName("img");
- for(i=0; i<panels.length; i++){
- if(!panels[i].orig_src){
- panels[i].orig_src=panels[i].src;
- }
- panels[i].src=panels[i].orig_src+"#"+new Date().getTime();
- }
- }
- setInterval(updatePanels,10*1000);
- -->
- </script>
</body>
</HTML>
EOF
