esp
This commit is contained in:
@@ -7,7 +7,7 @@ esp = Blueprint('eps', __name__, url_prefix='/unsecure/esp')
|
||||
|
||||
MQTT_BROKER = "localhost" # oder IP/Domain
|
||||
MQTT_PORT = 1883
|
||||
MQTT_TOPIC = "iot/machine"
|
||||
MQTT_TOPIC = "coffee/command"
|
||||
|
||||
@esp.route('/')
|
||||
def fetch_command():
|
||||
@@ -17,16 +17,11 @@ def fetch_command():
|
||||
|
||||
@esp.route('/toggle-machine', methods=['POST'])
|
||||
def toggle_machine():
|
||||
pCd = shared.pending_command
|
||||
shared.reset_command()
|
||||
pCd['command'] = 'machineToggle'
|
||||
pCd['command-URL'] = 'NO_URL'
|
||||
pCd['command-expected'] = 'machineStatusResponse'
|
||||
pCd['command-expected-URL'] = 'http://lires.de/unsecure/esp/machine-status'
|
||||
|
||||
testData = {'test': 'Live-Daten', 'status': 'OK', 'counter': 0}
|
||||
client = mqtt.Client()
|
||||
client.connect(MQTT_BROKER, MQTT_PORT, 60)
|
||||
client.publish(MQTT_TOPIC, json.dumps(pCd))
|
||||
client.publish(MQTT_TOPIC, json.dumps(testData))
|
||||
client.disconnect()
|
||||
|
||||
return jsonify({"status": json.dumps(pCd)})
|
||||
return jsonify({"status": json.dumps(testData)})
|
||||
@@ -6,5 +6,5 @@ def reset_command():
|
||||
'command': None,
|
||||
'command-URL': None,
|
||||
'command-expected': None,
|
||||
'command-expected-URL': None
|
||||
'command-expected-topic': None
|
||||
}
|
||||
@@ -116,7 +116,7 @@ header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 30px;
|
||||
max-height: 62vh;
|
||||
max-height: 70vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@@ -134,11 +134,6 @@ header {
|
||||
transition: background 0.3s;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.grid-button:hover {
|
||||
background: #7f8c8d;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* Rahmen + Titel für den rechten Block */
|
||||
.stats-box {
|
||||
border: 2px solid #000;
|
||||
@@ -182,8 +177,8 @@ header {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 12px;
|
||||
font-size: 20px;
|
||||
color: #ff0000;
|
||||
font-size: 24px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.clickable .center-number {
|
||||
@@ -194,16 +189,36 @@ header {
|
||||
.grid-button .top-left-text {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 12px;
|
||||
font-size: 20px;
|
||||
color: #ff0000;
|
||||
left: 16px;
|
||||
font-size: 24px;
|
||||
color: #000000;
|
||||
}
|
||||
.grid-button .center-number {
|
||||
margin-top: 40px;
|
||||
margin-top: 85px;
|
||||
width: 100%;
|
||||
height: 80%;
|
||||
font-size: 48px;
|
||||
font-weight: bold;
|
||||
color: #222;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.deniePress:hover{
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.blink-orange {
|
||||
background-color: orange;
|
||||
animation: pulse-orange 1.0s infinite;
|
||||
}
|
||||
|
||||
@keyframes pulse-orange {
|
||||
0% { background-color: orange; }
|
||||
50% { background-color: #fdbb57; } /* etwas heller */
|
||||
100% { background-color: orange; }
|
||||
}
|
||||
.initBackRed {
|
||||
background-color: red;
|
||||
}
|
||||
.initBackRed:Hover{
|
||||
background-color: rgb(255, 37, 37);
|
||||
}
|
||||
|
||||
@@ -21,29 +21,30 @@
|
||||
|
||||
<section class="left">
|
||||
<div class="info">ESP-Conn Infos</div>
|
||||
<div class="action-button"> MAKE ME A COFFEE...</div>
|
||||
|
||||
<div class="button-grid">
|
||||
<div class="grid-button" onclick="toggleMachine()">
|
||||
<div class="grid-button deniePress">
|
||||
<div class="top-left-text">Kaffeeee</div>
|
||||
<div class="center-number">Kaffee Machen</div>
|
||||
</div>
|
||||
<div class="grid-button initBackRed" id="machine-status-butt" onclick="toggleMachine()">
|
||||
<div class="top-left-text">Maschine</div>
|
||||
<div class="center-number" id="machine-status">AUS</div>
|
||||
</div>
|
||||
<div class="grid-button">
|
||||
<div class="grid-button deniePress">
|
||||
<div class="top-left-text">Maschiene</div>
|
||||
<div class="center-number">Nicht Bereit</div>
|
||||
</div>
|
||||
<div class="grid-button">
|
||||
<div class="top-left-text">irgendwas kommt hier noch</div>
|
||||
<div class="center-number">XXX</div>
|
||||
</div>
|
||||
<div class="grid-button">
|
||||
|
||||
<div class="grid-button deniePress">
|
||||
<div class="top-left-text">Fehler</div>
|
||||
<div class="center-number">Wasser leer?</div>
|
||||
</div>
|
||||
<div class="grid-button">
|
||||
<div class="grid-button deniePress">
|
||||
<div class="top-left-text">Wasser</div>
|
||||
<div class="center-number">Aufgefüllt</div>
|
||||
</div>
|
||||
<div class="grid-button">
|
||||
<div class="grid-button deniePress">
|
||||
<div class="top-left-text">Bohnen</div>
|
||||
<div class="center-number">Nachgefüllt</div>
|
||||
</div>
|
||||
@@ -77,17 +78,19 @@
|
||||
</main>
|
||||
<script>
|
||||
function toggleMachine() {
|
||||
fetch('/unsecure/esp/toggle-machine', { method: 'POST' })
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
//console.log(data);
|
||||
const inner = JSON.parse(data.status);
|
||||
if (inner.command === 'machineToggle') {
|
||||
document.getElementById("machine-status").innerText = "PENDING";
|
||||
} else {
|
||||
document.getElementById("machine-status").innerText = "SOME_ERR";
|
||||
}
|
||||
});
|
||||
document.getElementById("machine-status").innerText = "PENDING";
|
||||
document.getElementById("machine-status-butt").classList.add("blink-orange");
|
||||
// fetch('/unsecure/esp/toggle-machine', { method: 'POST' })
|
||||
// .then(res => res.json())
|
||||
// .then(data => {
|
||||
// //console.log(data);
|
||||
// const inner = JSON.parse(data.status);
|
||||
// if (inner.command === 'machineToggle') {
|
||||
|
||||
// } else {
|
||||
// document.getElementById("machine-status").innerText = "SOME_ERR";
|
||||
// }
|
||||
// });
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user