commit 2e7ca7f1cf1da8f44f3a308e950a75a3d2c13283 Author: xbl Date: Thu Mar 13 20:27:37 2025 +0100 initial commit diff --git a/html/img/down.png b/html/img/down.png new file mode 100644 index 0000000..2fe9943 Binary files /dev/null and b/html/img/down.png differ diff --git a/html/img/favicon.png b/html/img/favicon.png new file mode 100644 index 0000000..ee7e45a Binary files /dev/null and b/html/img/favicon.png differ diff --git a/html/img/hb.png b/html/img/hb.png new file mode 100644 index 0000000..316bcbc Binary files /dev/null and b/html/img/hb.png differ diff --git a/html/style.css b/html/style.css new file mode 100644 index 0000000..6f4dc9f --- /dev/null +++ b/html/style.css @@ -0,0 +1,395 @@ +@font-face { + font-family: FiraSans; + src: url("fonts/FiraSans-Medium.otf") format: ("opentype"); +} + +* { + font-family: "FiraSans", sans-serif; + box-sizing: border-box; +} + +body { + background-color: #101010; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + min-height: 100vh; + padding-bottom: 100px; + overflow-x: hidden; + overflow-y: hidden; +} + +/* Popup container */ +.popup { + position: relative; + display: inline-block; + cursor: pointer; +} + +/* Popup */ + +.popup h5 { + margin-top: 0px; + border: 1px solid #248bcc; + border-radius: 25px; + font-size: 15px; + color: white; + position: relative; + padding-left: 7px; + padding-right: 7px; +} + +.popup h5:hover { + background-color: #248bcc; +} + +.popup { + display: block; + position: relative; + margin: auto; + text-align: center; +} + +.popup .popuptext { + background-color: #101010; + position: absolute; + z-index: 512; + visibility: hidden; + width: 100%; + color: #fff; + text-align: left; + top: 100%; + left: 50%; + margin-left: -50%; + border: 1px solid #248bcc; + border-radius: 25px; +} + +.popup .popuptext p { + color: white; + font-size: 15px; + margin: 0; +} + +.popup .popuptext .emo { + margin-top: 15px; + text-align: center; +} +.popup .popuptext .emo a { + padding-left: 15px; + padding-right: 15px; + font-size: 69px; + text-decoration: none; +} + +.popup .popuptext .text { + padding-left: 25px; +} + +.popup .popuptext .text p { + margin-bottom: 25px; + margin-top: 25px; +} + +.popup .popuptext .sources { + padding-left: 25px; +} +.popup .popuptext .sources a { + color: #248bcc; + padding-top: 0px; + margin-top: 0px; +} + +/* Hide and show the popup */ +.popup .show { + position: absolute; + z-index: 512; + visibility: visible; +} + +.main { + border: 1px solid; + border-color: #248bcc; + border-radius: 25px 0 0 25px; + float: left; + width: 100%; +} + +.header { + display: block; + font-size: 13px; +} + +.logo { + margin-top: 7px; + width: 100%; + align: center; +} + +.conditions { + padding-left: 20px; + padding-right: 20px; + width: 20%; + text-align: left; + overflow: hidden; + float: left; + color: grey; +} + +.current { + padding-bottom: 5px; + padding-top: 5px; + color: #101010; + text-align: center; + border-radius: 15px; + background-color: #248bcc; +} + +.current .update { + padding: 0px; + margin: 0px; + font-weight: normal; + color: white; + font-size: 15px; +} + +.current .wttr { + margin: 0; + color: #101010; + font-size: 25px; + font-weight: bold; +} + +.current .danger { + margin: 0; + text-align: center; + background-color: #248bcc; + border-radius: 0 0 25px 25px; + color: white; + font-size: 15px; +} + +.current .level { + font-size: 25px; + font-weight: bold; + margin: 0px; +} + +.danger p { + color: #101010; + font-weight: normal; + margin: 0; + font-weight: none; + color: white; + font-size: 15px; +} + +.cat { + font-size: 15px; +} + +.data { + margin-top: 5px; + font-weight: bold; + font-size: 25px; + padding-bottom: 5px; + padding-top: 5px; + color: white; + border-bottom: 1px solid #248bcc; + border-left: 1px solid #248bcc; + border-radius: 25px; +} + +.cat p { + padding-left: 24px; +} + +.datapoint { + padding-top: 10px; + padding-bottom: 0; + padding-left: 10px; + margin-top: 30px; + margin-bottom: 0; +} + + +.video { + position: relative; + z-index: -1; +} + +.video img { + width: 80%; + max-height: inherit; + max-width: inherit; + padding-top: 5px; + padding-right: 5px; +} + +.footer { + position: absolute; + bottom: 0; + width: 100%; + text-align: center; +} + +.footer p { + font-size: 13px; + color: #FFFFFF; +} + +.footer a { + font-size: 13px; + color: #FFFFFF; + text-decoration: none; +} + +.footer a:hover { + text-decoration: underline; +} + +@media only screen and (max-width: 1100px) { + .popup .show { + position: absolute; + z-index: 512; + visibility: visible; + } + .main { + margin: 0; + padding: 0; + border-radius: 25px 25px 0px 0px; + } + .conditions, .video { + width: 100%; + } + .conditons { + font-size: 13px; + width: 100%; + } + .conditions .cat { + width: 50%; + display: inline; + float: left; + overflow: hidden; + padding-left: 5%; + padding-right: 5%; + } + .header { + margin-bottom: 0px; + margin-top: 5px; + } + .header img { + margin-top: 10px; + } + .logo { + max-height: 75px; + object-fit: contain; + } + +.popup .popuptext { + top: 0%; + left: 50%; + margin-top: -15%; + margin-left: -50%; + border-radius: 15px; +} + +.popup .popuptext p { + font-size: 10px; + margin: 0; + padding: 0; +} + +.popup .popuptext .emo { + margin-top: 5px; + text-align: center; +} +.popup .popuptext .emo a { + padding-left: 15px; + padding-right: 15px; + font-size: 36px; +} + +.popup .popuptext .text { + margin: 0; + padding: 0; + padding-left: 15px; +} + +.popup .popuptext .text p { + margin: 0; + padding: 0; + padding-bottom: 10px; + padding-top: 10px; +} + +.popup .popuptext .sources { + padding-left: 15px; +} +.popup .popuptext .sources p { + margin: 0; + padding: 0; + padding-top: 5px; +} +.popup .popuptext .sources a { + margin-top: 0; + padding-top: 0px; + font-size: 10px; +} + + .popup h5 { + margin-bottom: 5px; + margin-top: 0px; + } + .current { + border-radius: 9px; + } + .current .update { + padding: 0; + margin: 0; + font-size: 10px; + } + .current .wttr { + margin: 0; + padding: 0; + font-size: 15px; + } + .current .danger { + padding: 0; + margin: 0; + font-size: 10px; + } + .current .level { + padding: 0; + margin: 0; + font-size: 13px; + } + .danger p { + padding: 0; + margin: 0; + color: white; + font-size: 10px; + } + .cat p { + margin: 0; + padding-left: 12px; + } + .data { + margin-top: 0; + margin-bottom: 0; + padding-top: 0; + padding-bottom: 0px; + font-size: 13px; + } + .datapoint { + margin: 0; + padding-bottom: 0px; + font-size: 10px; + } + .video img { + margin-top: 15px; + width: 100%; + padding-left: 5px; + } +} diff --git a/index.sh b/index.sh new file mode 100755 index 0000000..e153b64 --- /dev/null +++ b/index.sh @@ -0,0 +1,183 @@ +#!/bin/bash +# + +data="/var/www/hardbrugg.ch/data/" + +## Read old data +atemp_old="$(cat $data/atemp.data)" +depth_old="$(cat $data/depth.data)" +disch_old="$(cat $data/disch.data)" +wtemp_old="$(cat $data/wtemp.data)" + +# Get new data +## 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 -A 1 nowcast-card-temperature | tail -n 1 | grep -Eo '\-?[0-9]*' > $data/atemp.data + +## 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 + +## 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 + +## Water Temp +curl -s https://hydroproweb.zh.ch/Listen/AktuelleWerte/AktWassertemp.html | grep -A 3 Letten | grep '' | grep -Eo '[0-9]*\.[0-9]' > $data/wtemp.data + +## 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 + +## Generate Visitor Number +visit_num="$(shuf -i 111111-420069 -n 1)" + +# Read new data +atemp_new="$(cat $data/atemp.data)" +depth_new="$(cat $data/depth.data)" +disch_new="$(cat $data/disch.data)" +wtemp_new="$(cat $data/wtemp.data)" + +# Compare old and new data +## Air Temp +if [ $atemp_old -lt $atemp_new ] +then + echo "${atemp_new}° C ↗" > $data/atemp.datatrend +elif [ $atemp_old -gt $atemp_new ] +then + echo "${atemp_new}° C ↘" > $data/atemp.datatrend +else + echo "${atemp_new}° C ➡" > $data/atemp.datatrend +fi + +## Depth +if (( $(echo "$disch_old < $disch_new" | bc -l) )) +then + echo "${depth_new} m ↗" > $data/depth.datatrend +elif (( $(echo "$disch_old > $disch_new" | bc -l) )) +then + echo "${depth_new} m ↘" > $data/depth.datatrend +else + echo "${depth_new} m ➡" > $data/depth.datatrend +fi + +## Discharge +if (( $(echo "$disch_old < $disch_new" | bc -l) )) +then + echo "${disch_new}0 L ↗" > $data/disch.datatrend +elif (( $(echo "$disch_old > $disch_new" | bc -l) )) +then + echo "${disch_new}0 L ↘" > $data/disch.datatrend +else + echo "${disch_new}0 L ➡" > $data/disch.datatrend +fi + +## Water Temp +if (( $(echo "$wtemp_old < $wtemp_new" | bc -l) )) +then + echo "${wtemp_new}° C ↗" > $data/wtemp.datatrend +elif (( $(echo "$wtemp_old > $wtemp_new" | bc -l) )) +then + echo "${wtemp_new}° C ↘" > $data/wtemp.datatrend +else + echo "${wtemp_new}° C ➡" > $data/wtemp.datatrend +fi + +# Determine Danger Level +disch_dng="$(cat $data/disch.data)" + +if [ $disch_dng -le 35000 ] +then + dangr="color:#00FF00\">1" +elif [ $disch_dng -gt 35000 ] && [ $disch_dng -le 45000 ] + +then + dangr="color:#FFFF00\">2" +elif [ $disch_dng -gt 45000 ] && [ $disch_dng -le 53000 ] + +then + dangr="color:#FFA500\">3" +elif [ $disch_dng -gt 53000 ] && [ $disch_dng -le 60000 ] + +then + dangr="color:#FF0000\">4" +else + dangr="color:#9A0000\">5" +fi + +# Read current data +atemp="$(cat $data/atemp.datatrend)" +depth="$(cat $data/depth.datatrend)" +disch="$(cat $data/disch.datatrend)" +wtemp="$(cat $data/wtemp.datatrend)" + +utime="$(ls -la $data/atemp.data | awk '{print $8 }')" +wttr="$(cat $data/wttr.data)" + +# Write index.html +echo -e " + + + + hardbrugg.ch + + + + + + + +
+
+

+
+
+
ℹ
+
+ +

🗺 📧

+

Made with bash.

+

No cookies, no bullshit.

+

Updated every 20 minutes.

+

Using open data from:

+
ag.ch wetteronline.ch wttr.in zh.ch
+

Thank you!

+ +
+
+

Updated at ${utime}

+

$wttr

+

Danger Level

+

+

+
+

Air Temperature

+

${atemp}

+
+
+
+
+

Water Temperature

+

${wtemp}

+
+
+

Discharge per Second

+

${disch}

+
+
+

Depth

+

≈${depth}

+
+
+
+ \"Looks +
+
+
+

Gmacht mit 🔮 z'Züri. | humans.txt

+
+ +" > /var/www/hardbrugg.ch/html/index.html +# EOF diff --git a/monitor/atemp.snmp b/monitor/atemp.snmp new file mode 100644 index 0000000..756e000 --- /dev/null +++ b/monitor/atemp.snmp @@ -0,0 +1,11 @@ +#!/usr/bin/env bash +# + +if [ $1 = -g ] +then + echo "1.3.6.42.69.11" + echo "INTEGER" + cat /var/www/hardbrugg.ch/data/atemp.data +fi + +# EOF diff --git a/monitor/depth.snmp b/monitor/depth.snmp new file mode 100644 index 0000000..5d6af43 --- /dev/null +++ b/monitor/depth.snmp @@ -0,0 +1,11 @@ +#!/usr/bin/env bash +# + +if [ $1 = -g ] +then + echo "1.3.6.42.69.12" + echo "INTEGER" + cat /var/www/hardbrugg.ch/data/depth.data +fi + +# EOF diff --git a/monitor/disch.snmp b/monitor/disch.snmp new file mode 100644 index 0000000..e2f0993 --- /dev/null +++ b/monitor/disch.snmp @@ -0,0 +1,11 @@ +#!/usr/bin/env bash +# + +if [ $1 = -g ] +then + echo "1.3.6.42.69.13" + echo "INTEGER" + cat /var/www/hardbrugg.ch/data/disch.data +fi + +# EOF diff --git a/monitor/wtemp.snmp b/monitor/wtemp.snmp new file mode 100644 index 0000000..7816952 --- /dev/null +++ b/monitor/wtemp.snmp @@ -0,0 +1,11 @@ +#!/usr/bin/env bash +# + +if [ $1 = -g ] +then + echo "1.3.6.42.69.14" + echo "INTEGER" + cat /var/www/hardbrugg.ch/data/wtemp.data +fi + +# EOF