updated the tracker to have more features

This commit is contained in:
2025-09-30 11:09:12 -07:00
parent 78e39abb90
commit 3b0ffccc0b
4 changed files with 329 additions and 35 deletions

View File

@@ -8,13 +8,33 @@
</div>
<div class="modal-body">
<input type="hidden" id="editTrackedMealId" value="">
<div id="editMealFoodsList">
<!-- Foods will be loaded here -->
</div>
<div class="mt-3">
<button class="btn btn-outline-primary" onclick="addFoodToTrackedMeal()">
<i class="bi bi-plus"></i> Add Food
</button>
<div class="row">
<div class="col-md-6">
<h6>Add Food to Tracked Meal</h6>
<form id="addFoodToTrackedMealForm">
<input type="hidden" id="tracked_meal_id_for_food" name="tracked_meal_id">
<div class="mb-3">
<label class="form-label">Select Food</label>
<select class="form-control" id="foodSelectTrackedMeal" name="food_id" required>
<option value="">Choose food...</option>
{% for food in foods %}
<option value="{{ food.id }}">{{ food.name }}</option>
{% endfor %}
</select>
</div>
<div class="mb-3">
<label class="form-label">Quantity</label>
<input type="number" step="0.01" class="form-control" name="quantity" value="1" required>
</div>
<button type="button" class="btn btn-success" onclick="addFoodToTrackedMeal()">Add Food</button>
</form>
</div>
<div class="col-md-6">
<h6>Current Foods in Tracked Meal</h6>
<div id="editMealFoodsList">
<!-- Foods will be loaded here -->
</div>
</div>
</div>
</div>
<div class="modal-footer">

View File

@@ -341,6 +341,7 @@
// Load foods for editing
async function loadTrackedMealFoods(trackedMealId) {
document.getElementById('tracked_meal_id_for_food').value = trackedMealId;
try {
const response = await fetch(`/tracker/get_tracked_meal_foods/${trackedMealId}`);
const data = await response.json();
@@ -349,25 +350,21 @@
container.innerHTML = '';
if (data.status === 'success') {
data.meal_foods.forEach(food => {
const foodDiv = document.createElement('div');
foodDiv.className = 'mb-2 p-2 border rounded';
foodDiv.innerHTML = `
<div class="d-flex justify-content-between align-items-center">
<div>
<strong>${food.food_name}</strong>
<small class="text-muted">(${food.serving_size} ${food.serving_unit})</small>
</div>
<div>
<input type="number" class="form-control w-25 d-inline me-2" value="${food.quantity}" data-food-id="${food.id}" min="0" step="0.1">
<button class="btn btn-sm btn-outline-danger" onclick="removeTrackedFood(${food.id})">
<i class="bi bi-trash"></i>
</button>
</div>
</div>
`;
container.appendChild(foodDiv);
});
if (data.meal_foods.length === 0) {
container.innerHTML = '<em>No foods added yet</em>';
} else {
data.meal_foods.forEach(food => {
const foodDiv = document.createElement('div');
foodDiv.className = 'd-flex justify-content-between align-items-center mb-2 p-2 bg-light rounded';
foodDiv.innerHTML = `
<span>${food.quantity} × ${food.food_name}</span>
<button class="btn btn-sm btn-outline-danger" onclick="removeFoodFromTrackedMeal(${food.id})">
<i class="bi bi-trash"></i>
</button>
`;
container.appendChild(foodDiv);
});
}
}
} catch (error) {
console.error('Error loading meal foods:', error);
@@ -375,27 +372,55 @@
}
// Add food to tracked meal
function addFoodToTrackedMeal() {
// Implementation for adding new food - would need a food selection modal
alert('Add food functionality to be implemented');
async function addFoodToTrackedMeal() {
const form = document.getElementById('addFoodToTrackedMealForm');
const formData = new FormData(form);
const trackedMealId = formData.get('tracked_meal_id');
try {
const response = await fetch('/tracker/add_food_to_tracked_meal', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
tracked_meal_id: parseInt(formData.get('tracked_meal_id')),
food_id: parseInt(formData.get('food_id')),
quantity: parseFloat(formData.get('quantity'))
})
});
const result = await response.json();
if (result.status === 'success') {
// Reset form and reload current foods
form.reset();
document.getElementById('tracked_meal_id_for_food').value = trackedMealId;
await loadTrackedMealFoods(trackedMealId);
} else {
alert('Error adding food: ' + result.message);
}
} catch (error) {
alert('Error adding food: ' + error.message);
}
}
// Remove tracked food
async function removeTrackedFood(trackedFoodId) {
// Remove food from tracked meal
async function removeFoodFromTrackedMeal(mealFoodId) {
if (confirm('Remove this food from the tracked meal?')) {
try {
const response = await fetch(`/tracker/remove_tracked_food/${trackedFoodId}`, {
const response = await fetch(`/tracker/remove_food_from_tracked_meal/${mealFoodId}`, {
method: 'DELETE'
});
const result = await response.json();
if (result.status === 'success') {
loadTrackedMealFoods(document.getElementById('editTrackedMealId').value);
const trackedMealId = document.getElementById('editTrackedMealId').value;
await loadTrackedMealFoods(trackedMealId);
} else {
alert('Error: ' + result.message);
alert('Error removing food: ' + result.message);
}
} catch (error) {
alert('Error: ' + error.message);
alert('Error removing food: ' + error.message);
}
}
}