forked from NoLog.cz/TrhlinaBar
73 lines
No EOL
2.1 KiB
HTML
73 lines
No EOL
2.1 KiB
HTML
{% extends 'base.html' %}
|
|
|
|
{% block content %}
|
|
<style>
|
|
.status-light {
|
|
/* Background color */
|
|
background-color: gray;
|
|
|
|
/* Rounded border */
|
|
border-radius: 9999px;
|
|
|
|
/* Size */
|
|
height: 0.5rem;
|
|
width: 0.5rem;
|
|
|
|
display: inline-flex;
|
|
margin-bottom: 0.5rem;
|
|
|
|
|
|
animation: blink 2s step-start 0s infinite;
|
|
}
|
|
|
|
@keyframes blink {
|
|
50% {
|
|
opacity: 0.8;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<section>
|
|
|
|
<h1><a class="status-light" id="status-light"></a> Čekám až nascanuješ pitíčko</h1>
|
|
<h5 id="status-message"></h5>
|
|
</section>
|
|
<form action="/checkout" method="post">
|
|
<input id="barcode-input-field" type="text" name="barcode" autofocus>
|
|
<input type="submit" hidden>
|
|
</form>
|
|
|
|
|
|
<p> Sem by mělo přijít jednoduché info o pokladně </p>
|
|
|
|
<a href="/admin" role="button" style="position: fixed; bottom: 10px; right: 10px;">⚙</a>
|
|
|
|
|
|
<script>
|
|
checkConnection();
|
|
setInterval(checkConnection, 5000);
|
|
function checkConnection() {
|
|
var request = new XMLHttpRequest();
|
|
request.open('GET', 'https://org.trhlina.org/login', true);
|
|
request.timeout = 500;
|
|
request.onreadystatechange = function(){
|
|
if (request.readyState === 4){
|
|
if (request.status === 200) {
|
|
document.getElementById("status-light").style.backgroundColor = "#16a34a";
|
|
document.getElementById("status-message").innerHTML = "";
|
|
document.getElementById("barcode-input-field").style.display = "block";
|
|
console.log("Connection to Grocy is OK")
|
|
}
|
|
else {
|
|
document.getElementById("status-light").style.backgroundColor = "red";
|
|
document.getElementById("status-message").innerHTML = "S pokladnou je něco špatně. Nemůže se připojit k databázi.";
|
|
document.getElementById("barcode-input-field").style.display = "none";
|
|
console.log("Connection to Grocy is not working")
|
|
}
|
|
}
|
|
};
|
|
request.send();
|
|
}
|
|
|
|
</script>
|
|
{% endblock %} |