server 3 holy shit

This commit is contained in:
derlole
2025-04-16 11:24:43 +00:00
parent ff9cdf1969
commit 92212ba8f9
6 changed files with 336 additions and 19 deletions

View File

@@ -1,21 +1,84 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>ESP Steuerung</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>gimmiCoffee</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<h1>ESP8266 Fernsteuerung</h1>
<header>
<div class="site-title">gimmiCoffee</div>
<div class="user-actions">
<span class="username">Max Mustermann</span>
<a href="/logout" class="logout">Logout</a>
</div>
</header>
<form id="befehlForm">
<label for="befehl">Befehl:</label>
<input type="text" id="befehl" name="befehl" required>
<button type="submit">Senden</button>
</form>
<main class="main-container">
<p id="status"></p>
<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">
<div class="top-left-text">Maschiene</div>
<div class="center-number">AUS</div>
</div>
<div class="grid-button">
<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 nocht</div>
<div class="center-number">XXX</div>
</div>
<div class="grid-button">
<div class="top-left-text">Fehler</div>
<div class="center-number">Wasser leer?</div>
</div>
<div class="grid-button">
<div class="top-left-text">Wasser</div>
<div class="center-number">Aufgefüllt</div>
</div>
<div class="grid-button">
<div class="top-left-text">Bohnen</div>
<div class="center-number">Nachgefüllt</div>
</div>
</div>
</section>
<script src="{{ url_for('static', filename='script.js') }}"></script>
<section class="right stats-box">
<h2 class="stats-title">Statistiken</h2>
<div class="clickable">
<div class="top-left-text">Coffee made</div>
<div class="center-number">XXX</div>
</div>
<div class="clickable">
<div class="top-left-text">Bohnen Füllstand</div>
<div class="center-number">XX%</div>
</div>
<div class="clickable">
<div class="top-left-text">Wasser Füllstand</div>
<div class="center-number">XX%</div>
</div>
<div class="clickable">
<div class="top-left-text">Bohnen nachgefüllt</div>
<div class="center-number">XX</div>
</div>
<div class="clickable">
<div class="top-left-text">Wasser nachgefüllt</div>
<div class="center-number">XX</div>
</div>
</section>
</main>
</body>
</html>
</html>
<!--<script src="{{ url_for('static', filename='script.js') }}"></script>-->

25
templates/test.html Normal file
View File

@@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Live Update</title>
<script src="https://cdn.socket.io/4.6.1/socket.io.min.js"></script>
</head>
<body>
<h2>Daten vom Server</h2>
<p><strong>Test:</strong> <span id="test"></span></p>
<p><strong>Status:</strong> <span id="status"></span></p>
<p><strong>Counter:</strong> <span id="counter"></span></p>
<script>
const socket = io();
socket.on('update_data', (data) => {
document.getElementById('test').textContent = data.test;
document.getElementById('status').textContent = data.status;
document.getElementById('counter').textContent = data.counter;
console.log('Neue Daten:', data);
});
</script>
</body>
</html>