Keith Solomon
9e32b1b179
Add a Flask backend + SQLite + HTML/CSS/JS PWA that: - Polls the CYD /api/latest endpoint - Stores readings, sessions, and freeform notes in SQLite - Displays probe cards with target setpoints and preset options - Renders temperature history with Chart.js - Serves a PWA manifest and dark-themed dashboard Also update cyd-bridge/README.md with verified bringup instructions.
65 lines
2.0 KiB
HTML
65 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>ThermoPro CYD Dashboard</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
|
<link rel="manifest" href="{{ url_for('static', filename='manifest.json') }}">
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>ThermoPro CYD Dashboard</h1>
|
|
<div id="status-bar">
|
|
<span id="cyd-status">Checking CYD...</span>
|
|
<span id="battery-status">--</span>
|
|
<span id="signal-status">--</span>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<section id="session-controls">
|
|
<div class="panel">
|
|
<h2>Session</h2>
|
|
<div id="active-session">No active session.</div>
|
|
<form id="new-session-form">
|
|
<input type="text" id="session-name" placeholder="Session name" required>
|
|
<textarea id="session-notes" placeholder="Notes (freeform)"></textarea>
|
|
<button type="submit">Start New Session</button>
|
|
</form>
|
|
<button id="end-session-btn" disabled>End Session</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="probe-cards">
|
|
<!-- Cards injected by JS -->
|
|
</section>
|
|
|
|
<section id="charts">
|
|
<div class="panel">
|
|
<h2>Temperature History</h2>
|
|
<div class="chart-controls">
|
|
<label>Range:
|
|
<select id="chart-range">
|
|
<option value="15">15 min</option>
|
|
<option value="60" selected>1 hour</option>
|
|
<option value="240">4 hours</option>
|
|
<option value="720">12 hours</option>
|
|
</select>
|
|
</label>
|
|
<button id="refresh-chart-btn">Refresh Chart</button>
|
|
</div>
|
|
<canvas id="temp-chart"></canvas>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>
|
|
<div id="last-updated">--</div>
|
|
</footer>
|
|
|
|
<script src="{{ url_for('static', filename='app.js') }}"></script>
|
|
</body>
|
|
</html>
|