lukas/weight_tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

feat: usability

Browse Source
This commit is contained in:
Lukas Wölfer
2026-04-11 14:48:43 +02:00
parent 7010aee5b2
commit b922a610e6
4 changed files with 51 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
templates/index.html
View File

@@ -1,10 +1,46 @@
<!DOCTYPE html>
<html>
<head>
<title>Weight Tracker</title>
<script src="https://unpkg.com/htmx.org@1.9.10"></script>
<script>
function fillCurrentDateTime() {
// Fill date and time with current values
const now = new Date();
// Format date as YYYY-MM-DD
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
document.getElementById('date').value = `${year}-${month}-${day}`;
// Format time as HH:MM
const hours = String(now.getHours()).padStart(2, '0');
const minutes = String(now.getMinutes()).padStart(2, '0');
document.getElementById('time').value = `${hours}:${minutes}`;
// Fill weight with the latest weight from the list
const weightElements = document.querySelectorAll('#weights p');
if (weightElements.length > 0) {
const latestWeightText = weightElements[0].textContent;
// Extract weight value from format "YYYY-MM-DD: XX.X kg by username"
const match = latestWeightText.match(/(\d+\.?\d*)\s*kg/);
if (match) {
document.getElementById('weight').value = match[1];
}
}
}
function showInputDialog() {
fillCurrentDateTime();
document.getElementById('inputDialog').showModal();
}
</script>
<link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
<h1>Weight Tracker</h1>
<div id="weights">
@@ -12,16 +48,20 @@
<p>{{ weight.date }}: {{ weight.weight }} kg by {{ weight.user_id }}</p>
{% endfor %}
</div>
<button onclick="document.getElementById('inputDialog').showModal()">Add Weight</button>
<button onclick="showInputDialog()">Add Weight</button>
<dialog id="inputDialog">
<h1>Add Weight</h1>
<form hx-post="/input" hx-target="#weights" hx-swap="innerHTML" hx-on:htmx:after-request="document.getElementById('inputDialog').close()">
<form hx-post="/input" hx-target="#weights" hx-swap="innerHTML"
hx-on:htmx:after-request="document.getElementById('inputDialog').close()">
<label for="date">Date:</label>
<input type="date" id="date" name="date" required><br>
<label for="time">Time:</label>
<input type="time" id="time" name="time" required><br>
<label for="weight">Weight (kg):</label>
<input type="number" step="0.1" id="weight" name="weight" required><br>
<button type="submit">Submit</button>
</form>
</dialog>
</body>
</html>

20
templates/input.html
View File

@@ -1,20 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Add Weight</title>
<script src="https://unpkg.com/htmx.org@1.9.10"></script>
<link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
<h1>Add Weight</h1>
<form hx-post="/input" hx-target="#result" hx-swap="innerHTML">
<label for="date">Date:</label>
<input type="date" id="date" name="date" required><br>
<label for="weight">Weight (kg):</label>
<input type="number" step="0.1" id="weight" name="weight" required><br>
<button type="submit">Submit</button>
</form>
<div id="result"></div>
<a href="/">Back to Tracker</a>
</body>
</html>