Fetenzentrale/templates/index.html

81 lines
2.9 KiB
HTML

{% extends 'base.html' %}
{% block content %}
<h1>{% block title %} Partey! {% endblock %}</h1>
<div class="grid-container">
<div class="savedLogs">
<h3>Logs</h3>
{% for log in logs %}
<div>
{{ log.datetime }}: {{ log.message }}
</div>
{% endfor %}
</div>
<div class="savedAlarms">
<h3>Upcoming Alarms</h3>
{% for alarm in alarms %}
<div>
{{ alarm.datetime }}: {{ alarm.message }}
</div>
{% endfor %}
</div>
<div class="log">
<form method="post" action="/sendLog">
<div class="form-group">
<label for="logMessage">logMessage</label>
<input type="text" name="logMessage"
class="form-control"
value="{{ request.form['logMessage'] }}"></input>
<input type="submit" id="saveLog" value="Speichern"/>
</div>
</form>
</div>
<div class="alarms">
<form method="post" action="/setAlarm">
<div class="form-group">
<label for="time">Time</label>
<input type="datetime-local" name="datetime"
class="form-control"
value="{{ request.form['datetime'] }}"></input>
<label for="alarmMessage">alarmMessage</label>
<input type="text" name="alarmMessage"
class="form-control"
value="{{ request.form['alarmMessage'] }}"></input>
<input type="submit" id="saveAlarm" value="Speichern"/>
</div>
</form>
</div>
<div>
<h3>Previous Alarm</h3>
Script runs once for whatever reason????
<script>
async function getAlarms(){
const response = await fetch("http://127.0.0.1:5000/alarms");
const alarms = await response.json();
return alarms
}
alarms = getAlarms();
function checkAlarms(){
console.log("hello")
for(alarm in alarms){
if(Date(alarm.datetime) <=new Date()){
console.log("ALARM!");
alert(alarm.message);
// post alerting alarm
}
}
setTimeout(checkAlarms, 15000);
}
checkAlarms();
</script>
{% for alarm in previousAlarms %}
<div>
{{ alarm.datetime }}: {{ alarm.message }}
</div>
{% endfor %}
</div>
</div>
{% endblock %}