103 lines
4.8 KiB
HTML
103 lines
4.8 KiB
HTML
|
||
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>{{ title }}</title>
|
||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
||
<link rel="icon" href="{{ url_for('static', filename='gimmiCoffee_Logo.png') }}" type="image/png">
|
||
<script src="https://cdn.socket.io/4.6.1/socket.io.min.js"></script>
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<div class="site-title">gimmiCoffee</div>
|
||
<div class="user-actions">
|
||
<span class="username">{{ username }}</span>
|
||
<a onclick="logout()" class="logout">Logout</a>
|
||
</div>
|
||
</header>
|
||
<div id="waterData" style="display: none;">{{ water | tojson }}</div>
|
||
<div id="beansData" style="display: none;">{{ beans | tojson }}</div>
|
||
<div id="machineData" style="display: none;">{{ machine | tojson }}</div>
|
||
<div id="espData" style="display: none;">{{ esp_conn_infos | tojson }}</div>
|
||
<main class="main-container">
|
||
|
||
<section class="left">
|
||
<div class="info" id="infoMain">
|
||
<div style="flex: 1; display: flex; align-items: center;">
|
||
<strong>ESP-Connection Infos</strong>
|
||
</div>
|
||
|
||
<div style="flex: 1;">
|
||
<p><strong>Global IP:</strong> <span id="ip_global">–</span></p>
|
||
<p><strong>Local IP:</strong> <span id="ip_local">–</span></p>
|
||
</div>
|
||
|
||
<div style="flex: 1;">
|
||
<p><strong>Valid Connection:</strong> <span id="valid_connection">–</span></p>
|
||
<p><strong>Last Seen:</strong> <span id="last_seen">–</span></p>
|
||
</div>
|
||
|
||
<div class="validationButtonOuter">
|
||
<div onclick="tryValidateConnection()" class="validButt" id="validButt">Validate Connection</div>
|
||
</div>
|
||
</div>
|
||
<div class="button-grid">
|
||
<div class="grid-button deniePress" id="make-coffee-butt">
|
||
<div class="top-left-text">Kaffeeee</div>
|
||
<div class="center-number">Kaffee Machen</div>
|
||
</div>
|
||
<div class="grid-button deniePress" 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 deniePress" id="machine-error-butt">
|
||
<div class="top-left-text">Fehler</div>
|
||
<div class="center-number" id="machiene-error-text">Keiner</div>
|
||
</div>
|
||
<div class="grid-button deniePress initBackRed" id="machine-ready-butt">
|
||
<div class="top-left-text">Maschine</div>
|
||
<div class="center-number" id="machiene-ready-text">Nicht Bereit</div>
|
||
</div>
|
||
<div class="grid-button defaultGray" onclick="waterRefill()">
|
||
<div class="top-left-text">Wasser</div>
|
||
<div class="center-number">Nachgefüllt?</div>
|
||
</div>
|
||
<div class="grid-button defaultGray" onclick="beansRefill()">
|
||
<div class="top-left-text">Bohnen</div>
|
||
<div class="center-number">Nachgefüllt?</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="right stats-box">
|
||
<h2 class="stats-title">Statistiken</h2>
|
||
<div class="clickable" onclick="showCoffeeHistory()">
|
||
<div class="top-left-text">Coffee made</div>
|
||
<div class="center-number">{{ coffee_count }}</div>
|
||
</div>
|
||
<div class="clickable" onclick=" window.location.href = '/unsecure/beans'">
|
||
<div class="top-left-text">Bohnen Füllstand</div>
|
||
<div class="center-number" id="beans-fill">XX%</div>
|
||
</div>
|
||
<div class="clickable" onclick=" window.location.href = '/unsecure/water'">
|
||
<div class="top-left-text">Wasser Füllstand</div>
|
||
<div class="center-number" id="water-fill">XX%</div>
|
||
</div>
|
||
<div class="clickable not">
|
||
<div class="top-left-text">Bohnen nachgefüllt</div>
|
||
<div class="center-number" id="beans-filled">XX</div>
|
||
</div>
|
||
<div class="clickable not">
|
||
<div class="top-left-text">Wasser nachgefüllt</div>
|
||
<div class="center-number" id="water-filled">XX</div>
|
||
</div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<script src="{{ url_for('static', filename='script.js') }}"></script>
|
||
<script src="{{ url_for('static', filename='socketio.js') }}"></script>
|
||
</body>
|
||
</html> |