modified: html/style.css

modified:   index.sh
This commit is contained in:
root
2026-03-05 19:15:46 +01:00
parent 1bd6a2679b
commit b2338f3d60
2 changed files with 53 additions and 31 deletions

View File

@ -187,6 +187,7 @@ body {
.cat { .cat {
font-size: 15px; font-size: 15px;
position: relative;
} }
.data { .data {
@ -198,13 +199,16 @@ body {
color: white; color: white;
border-bottom: 1px solid #248bcc; border-bottom: 1px solid #248bcc;
border-left: 1px solid #248bcc; border-left: 1px solid #248bcc;
border-radius: 25px; border-radius: 25px 0px 25px 25px;
} }
.plot { .plot {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 102% 100%; background-size: 102% 100%;
background-position: -2px 0px; background-position: -2px 0px;
background-image:
linear-gradient(to right, rgba(0,0,0,0) 0%, #101010 39%);
linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0));
} }
@ -235,7 +239,7 @@ body {
} }
.footer { .footer {
position: absolute; flex-shrink: 0;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
text-align: center; text-align: center;
@ -399,4 +403,3 @@ body {
width: 100%; width: 100%;
padding-left: 5px; padding-left: 5px;
} }
}

View File

@ -1,6 +1,5 @@
#!/bin/bash #!/bin/bash
# #
if ping -c 1 google.com; then
data="/var/www/hardbrugg.ch/data" data="/var/www/hardbrugg.ch/data"
query="$(shuf -i 10000-99999 -n 1)" query="$(shuf -i 10000-99999 -n 1)"
@ -13,19 +12,43 @@ wtemp_old="$(cat $data/wtemp.data)"
# Get new data # Get new data
## Air Temp ## Air Temp
curl -A "Mozilla/5.0 (X11; Linux x86_64; rv:60.0) Gecko/20100101 Firefox/81.0" -s https://www.wetteronline.ch/wettertrend/zuerich | grep -o -P '.{0,1}current-temperature.{0,11}' | grep -Eo '\-?[0-9]*' | tail -n 1 > "$data"/atemp.data & curl -A "Mozilla/5.0 (X11; Linux x86_64; rv:60.0) Gecko/20100101 Firefox/81.0" -s https://www.wetteronline.ch/wettertrend/zuerich | grep -o -P '"air-temp.{0,9}' | grep -Eo '\-?[0-9]+' > "$data"/atemp.data 2>> error.log
if [ ! -s "$data/atemp.data" ]; then
echo "$(date): atemp empty, wait a minute or something" >> /tmp/error.log
sleep 30
curl -A "Mozilla/5.0 (X11; Linux x86_64; rv:60.0) Gecko/20100101 Firefox/81.0" -s https://www.wetteronline.ch/wettertrend/zuerich | grep -o -P '"air-temp.{0,9}' | grep -Eo '\-?[0-9]+' > "$data"/atemp.data 2>> error.log
fi
## Depth ## Depth
curl -s https://www.ag.ch/app/hydrometrie/station/?id=11626 | grep -m 9 td | tail -n 1 | grep -Eo '[0-9][0-9][0-9].[0-9][0-9]' | awk '{print $1-398}' > "$data"/depth.data & curl -s https://www.ag.ch/app/hydrometrie/station/?id=11626 | grep -m 9 td | tail -n 1 | grep -Eo '[0-9][0-9][0-9].[0-9][0-9]' | awk '{print $1-398}' > "$data"/depth.data
if [ ! -s "$data/depth.data" ]; then
echo "$(date): depth empty, wait a minute or something" >> /tmp/error.log
sleep 30
curl -s https://www.ag.ch/app/hydrometrie/station/?id=11626 | grep -m 9 td | tail -n 1 | grep -Eo '[0-9][0-9][0-9].[0-9][0-9]' | awk '{print $1-398}' > "$data"/depth.data
fi
## Discharge ## Discharge
curl -s --user-agent "Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/538.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36" https://hydroproweb.zh.ch/Listen/AktuelleWerte/aktuelle_werte.html | grep -A 3 Unterhard | grep nbsp | grep -Eo '[0-9]*[.][0-9]*' | sed 's/\.//' > "$data"/disch.data & curl -s --user-agent "Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/538.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36" https://hydroproweb.zh.ch/Listen/AktuelleWerte/aktuelle_werte.html | grep -A 3 Unterhard | grep nbsp | grep -Eo '[0-9]*[.][0-9]*' | sed 's/\.//; s/$/0/' > "$data"/disch.data
if [ ! -s "$data/disch.data" ]; then
echo "$(date): disch empty, wait a minute or something" >> /tmp/error.log
sleep 30
curl -s --user-agent "Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/538.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36" https://hydroproweb.zh.ch/Listen/AktuelleWerte/aktuelle_werte.html | grep -A 3 Unterhard | grep nbsp | grep -Eo '[0-9]*[.][0-9]*' | sed 's/\.//; s/$/0/' > "$data"/disch.data
fi
## Water Temp ## Water Temp
curl -s https://hydroproweb.zh.ch/Listen/AktuelleWerte/AktWassertemp.html | grep -A 3 Letten | grep '<FONT COLOR=#000000>' | grep -Eo '[0-9]*\.[0-9]' > "$data"/wtemp.data & curl -s https://hydroproweb.zh.ch/Listen/AktuelleWerte/AktWassertemp.html | grep -A 3 Letten | grep '<FONT COLOR=#000000>' | grep -Eo '[0-9]+\.[0-9]' > "$data"/wtemp.data
if [ ! -s "$data/wtemp.data" ]; then
echo "$(date): wtemp empty, wait a minute or something" >> /tmp/error.log
sleep 30
curl -s https://hydroproweb.zh.ch/Listen/AktuelleWerte/AktWassertemp.html | grep -A 3 Letten | grep '<FONT COLOR=#000000>' | grep -Eo '[0-9]+\.[0-9]' > "$data"/wtemp.data
fi
## Weather ## Weather
curl -s -N wttr.in/zuerich > $data/wttr.dataraw && grep -m 2 -Eo "[A-Z][a-z][a-z]* *[A-Za-z]* *[A-Za-z]* *[A-Za-z]*" "$data"/wttr.dataraw | tail -n 1 > "$data"/wttr.data & curl -s -N wttr.in/zuerich > $data/wttr.dataraw && grep -m 2 -Eo "[A-Z][a-z][a-z]* *[A-Za-z]* *[A-Za-z]* *[A-Za-z]*" "$data"/wttr.dataraw | tail -n 1 > "$data"/wttr.data
## Wait for data to be fetched ## Wait for data to be fetched
wait wait
@ -42,7 +65,7 @@ wtemp_new="$(cat $data/wtemp.data)"
# Write plot data # Write plot data
echo "$(date +%Y%m%d%H%M) $atemp_new" >> "$data"/atemp.plot echo "$(date +%Y%m%d%H%M) $atemp_new" >> "$data"/atemp.plot
echo "$(date +%Y%m%d%H%M) $depth_new" >> "$data"/depth.plot echo "$(date +%Y%m%d%H%M) $depth_new" >> "$data"/depth.plot
echo "$(date +%Y%m%d%H%M) ${disch_new}0" >> "$data"/disch.plot echo "$(date +%Y%m%d%H%M) ${disch_new}" >> "$data"/disch.plot
echo "$(date +%Y%m%d%H%M) $wtemp_new" >> "$data"/wtemp.plot echo "$(date +%Y%m%d%H%M) $wtemp_new" >> "$data"/wtemp.plot
# Clean plot data and create plot images # Clean plot data and create plot images
@ -84,12 +107,12 @@ fi
## Discharge ## Discharge
if (( $(echo "$disch_old < $disch_new" | bc -l) )) if (( $(echo "$disch_old < $disch_new" | bc -l) ))
then then
echo "${disch_new}0 L ↗" > "$data"/disch.datatrend echo "${disch_new} L ↗" > "$data"/disch.datatrend
elif (( $(echo "$disch_old > $disch_new" | bc -l) )) elif (( $(echo "$disch_old > $disch_new" | bc -l) ))
then then
echo "${disch_new}0 L ↘" > "$data"/disch.datatrend echo "${disch_new} L ↘" > "$data"/disch.datatrend
else else
echo "${disch_new}0 L ➡" > "$data"/disch.datatrend echo "${disch_new} L ➡" > "$data"/disch.datatrend
fi fi
## Water Temp ## Water Temp
@ -106,18 +129,18 @@ fi
# Determine Danger Level # Determine Danger Level
disch_dng="$(cat $data/disch.data)" disch_dng="$(cat $data/disch.data)"
if [ $disch_dng -le 35000 ] if [ $disch_dng -le 350000 ]
then then
dangr="color:#00FF00\">1" dangr="color:#00FF00\">1"
elif [ $disch_dng -gt 35000 ] && [ $disch_dng -le 45000 ] elif [ $disch_dng -gt 350000 ] && [ $disch_dng -le 450000 ]
then then
dangr="color:#FFFF00\">2" dangr="color:#FFFF00\">2"
elif [ $disch_dng -gt 45000 ] && [ $disch_dng -le 53000 ] elif [ $disch_dng -gt 450000 ] && [ $disch_dng -le 530000 ]
then then
dangr="color:#FFA500\">3" dangr="color:#FFA500\">3"
elif [ $disch_dng -gt 53000 ] && [ $disch_dng -le 60000 ] elif [ $disch_dng -gt 530000 ] && [ $disch_dng -le 600000 ]
then then
dangr="color:#FF0000\">4" dangr="color:#FF0000\">4"
@ -131,7 +154,7 @@ depth="$(cat $data/depth.datatrend)"
disch="$(cat $data/disch.datatrend)" disch="$(cat $data/disch.datatrend)"
wtemp="$(cat $data/wtemp.datatrend)" wtemp="$(cat $data/wtemp.datatrend)"
utime="$(ls -la $data/atemp.data | awk '{print $8 }')" utime="$(ls -la $data/wtemp.data | awk '{print $8 }')"
wttr="$(cat $data/wttr.data)" wttr="$(cat $data/wttr.data)"
# Write index.html # Write index.html
@ -177,19 +200,19 @@ echo -e "<!DOCTYPE html>
</div> </div>
<div class=cat> <div class=cat>
<p class=datapoint>Air Temperature</p> <p class=datapoint>Air Temperature</p>
<p class=\"data plot\" style=\"background-image: linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.39)), url(img/atemp.png?with=${query})\">${atemp}</p> <p class=\"data plot\" style=\"background-image: linear-gradient(to left, rgba(255,255,255,1) 1%, rgba(0,0,0,0) 2%, rgba(0,0,0,0) 69%, rgba(16,16,16,1) 100%), url(img/atemp.png?with=${query})\">${atemp}</p>
</div> </div>
<div class=cat> <div class=cat>
<p class=datapoint>Water Temperature</p> <p class=datapoint>Water Temperature</p>
<p class=\"data plot\" style=\"background-image: linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.39)), url(img/wtemp.png?with=${query})\">${wtemp}</p> <p class=\"data plot\" style=\"background-image: linear-gradient(to left, rgba(255,255,255,1) 1%, rgba(0,0,0,0) 2%, rgba(0,0,0,0) 69%, rgba(16,16,16,1) 100%), url(img/wtemp.png?with=${query})\">${wtemp}</p>
</div> </div>
<div class=cat> <div class=cat>
<p class=datapoint>Discharge per Second</p> <p class=datapoint>Discharge per Second</p>
<p class=\"data plot\" style=\"background-image: linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.39)), url(img/disch.png?with=${query})\">${disch}</p> <p class=\"data plot\" style=\"background-image: linear-gradient(to left, rgba(255,255,255,1) 1%, rgba(0,0,0,0) 2%, rgba(0,0,0,0) 69%, rgba(16,16,16,1) 100%), url(img/disch.png?with=${query})\">${disch}</p>
</div> </div>
<div class=cat> <div class=cat>
<p class=datapoint>Depth</p> <p class=datapoint>Depth</p>
<p class=\"data plot\" style=\"background-image: linear-gradient(rgba(255,255,255,0), rgba(0,0,0,0.39)), url(img/depth.png?with=${query})\">&asymp;${depth}</p> <p class=\"data plot\" style=\"background-image: linear-gradient(to left, rgba(255,255,255,1) 1%, rgba(0,0,0,0) 2%, rgba(0,0,0,0) 69%, rgba(16,16,16,1) 100%), url(img/depth.png?with=${query})\">&asymp;${depth}</p>
</div> </div>
</div> </div>
<div class=video> <div class=video>
@ -197,13 +220,9 @@ echo -e "<!DOCTYPE html>
</div> </div>
</div> </div>
<div class=footer> <div class=footer>
<p>Gmacht mit 🔮 z'Züri. | <a href=https://6bit.ch/humans.txt>humans.txt</a></p> <p>Gmacht mit <a href="https://6bit.ch">🔮</a> z'Züri.</p>
</div> </div>
</body> </body>
</html>" > /var/www/hardbrugg.ch/html/index.html </html>" > /var/www/hardbrugg.ch/html/index.html
else
logger -i "ping failed, skipping data aggregation."
exit 1
fi
# EOF # EOF