mirror of
https://github.com/sstent/foodplanner.git
synced 2026-01-25 03:01:35 +00:00
705 lines
34 KiB
HTML
705 lines
34 KiB
HTML
{% extends "base.html" %}
|
|
{% block content %}
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<!-- Date Navigation -->
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<button class="btn btn-outline-secondary" onclick="navigateDate('{{ prev_date }}')"
|
|
data-testid="navigate-yesterday">
|
|
<i class="bi bi-chevron-left"></i> Yesterday
|
|
</button>
|
|
<div class="text-center">
|
|
<h3 data-testid="current-date-display">{{ current_date.strftime('%A, %B %d, %Y') }}</h3>
|
|
{% if is_modified %}
|
|
<span class="badge bg-warning text-dark">Custom</span>
|
|
{% else %}
|
|
<span class="badge bg-success">As Planned</span>
|
|
{% endif %}
|
|
</div>
|
|
<button class="btn btn-outline-secondary" onclick="navigateDate('{{ next_date }}')"
|
|
data-testid="navigate-tomorrow">
|
|
Tomorrow <i class="bi bi-chevron-right"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Template Actions -->
|
|
<div class="d-flex justify-content-center gap-2 mb-4">
|
|
<button class="btn btn-success" onclick="saveAsTemplate()" data-testid="save-as-template">
|
|
<i class="bi bi-save"></i> Save as Template
|
|
</button>
|
|
<button class="btn btn-primary" onclick="applyTemplate()" data-testid="apply-template">
|
|
<i class="bi bi-upload"></i> Apply Template
|
|
</button>
|
|
{% if is_modified %}
|
|
<button class="btn btn-outline-primary" onclick="resetToPlan()" data-testid="reset-to-plan">
|
|
<i class="bi bi-arrow-counterclockwise"></i> Reset to Plan
|
|
</button>
|
|
{% endif %}
|
|
<button class="btn btn-outline-danger" onclick="resetPage()" data-testid="reset-page">
|
|
<i class="bi bi-x-circle"></i> Reset Page
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Meal Times -->
|
|
{% set meal_times = ["Breakfast", "Lunch", "Dinner", "Snack 1", "Snack 2", "Beverage 1", "Beverage 2"] %}
|
|
{% for meal_time in meal_times %}
|
|
<div class="card mb-3">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<h5 class="mb-0">{{ meal_time }}</h5>
|
|
<div class="d-flex gap-2">
|
|
<button class="btn btn-sm btn-outline-success" onclick="addMealToTime('{{ meal_time }}')"
|
|
data-testid="add-meal-{{ meal_time|slugify }}">
|
|
<i class="bi bi-plus"></i> Add Meal
|
|
</button>
|
|
<button class="btn btn-sm btn-info text-white" onclick="addSingleFoodToTime('{{ meal_time }}')"
|
|
data-testid="add-food-{{ meal_time|slugify }}">
|
|
<i class="bi bi-plus-circle"></i> Add Food
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div id="meals-{{ meal_time|slugify }}">
|
|
{% set meals_for_time = [] %}
|
|
{% for tracked_meal in tracked_meals %}
|
|
{% if tracked_meal.meal_time == meal_time %}
|
|
{% set _ = meals_for_time.append(tracked_meal) %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{% if meals_for_time %}
|
|
{% for tracked_meal in meals_for_time %}
|
|
{# 1. Create stable slugs #}
|
|
{% set meal_time_slug = meal_time|slugify %}
|
|
{% set meal_name_safe = tracked_meal.meal.name|slugify %}
|
|
|
|
{# 2. Construct the core Unique Meal ID for non-ambiguous locating #}
|
|
{% set unique_meal_id = meal_time_slug + '-' + meal_name_safe + '-' + loop.index|string %}
|
|
<div class="mb-3 p-3 bg-light rounded" data-testid="meal-card-{{ unique_meal_id }}">
|
|
<div class="d-flex justify-content-between align-items-center mb-2">
|
|
<div>
|
|
<strong data-testid="meal-name-{{ unique_meal_id }}">{{ tracked_meal.meal.name
|
|
}}</strong>
|
|
</div>
|
|
<div>
|
|
<button class="btn btn-sm btn-outline-secondary me-1"
|
|
onclick="editTrackedMeal('{{ tracked_meal.id }}')" title="Edit Meal"
|
|
data-testid="edit-meal-{{ unique_meal_id }}">
|
|
<i class="bi bi-pencil"></i>
|
|
</button>
|
|
<button class="btn btn-sm btn-outline-danger"
|
|
onclick="removeMeal('{{ tracked_meal.id }}')"
|
|
data-testid="delete-meal-{{ unique_meal_id }}">
|
|
<i class="bi bi-trash"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Food Breakdown -->
|
|
<div class="ms-3">
|
|
{% set overrides = {} %}
|
|
{% set all_override_ids = [] %}
|
|
{% set deleted_food_ids = [] %}
|
|
{% for tmf in tracked_meal.tracked_foods %}
|
|
{% if not tmf.is_deleted %}
|
|
{% set _ = overrides.update({tmf.food_id: tmf}) %}
|
|
{% else %}
|
|
{% set _ = deleted_food_ids.append(tmf.food_id) %}
|
|
{% endif %}
|
|
{% set _ = all_override_ids.append(tmf.food_id) %}
|
|
{% endfor %}
|
|
|
|
{% set meal_totals = {'carbs': 0, 'fiber': 0, 'fat': 0, 'protein': 0, 'calories': 0} %}
|
|
{% set state = {'has_foods': False} %}
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-sm table-striped small mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 40%">Food</th>
|
|
<th class="text-end">Carbs</th>
|
|
<th class="text-end">Fiber</th>
|
|
<th class="text-end">Net Carbs</th>
|
|
<th class="text-end">Fat</th>
|
|
<th class="text-end">Protein</th>
|
|
<th class="text-end">Cals</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{# Display base meal foods, applying overrides #}
|
|
{% for meal_food in tracked_meal.meal.meal_foods %}
|
|
{% if meal_food.food_id not in deleted_food_ids and meal_food.food_id not in
|
|
overrides.keys() %}
|
|
{% set _ = state.update({'has_foods': True}) %}
|
|
{% set food = meal_food.food %}
|
|
{% set qty = meal_food.quantity %}
|
|
{% set mult = qty / food.serving_size if food.serving_size > 0 else 0 %}
|
|
{% set row_carbs = (food.carbs or 0) * mult %}
|
|
{% set row_fiber = (food.fiber or 0) * mult %}
|
|
{% set row_fat = (food.fat or 0) * mult %}
|
|
{% set row_protein = (food.protein or 0) * mult %}
|
|
{% set row_cals = (food.calories or 0) * mult %}
|
|
|
|
{# Accumulate Totals #}
|
|
{% set _ = meal_totals.update({'carbs': meal_totals.carbs + row_carbs}) %}
|
|
{% set _ = meal_totals.update({'fiber': meal_totals.fiber + row_fiber}) %}
|
|
{% set _ = meal_totals.update({'fat': meal_totals.fat + row_fat}) %}
|
|
{% set _ = meal_totals.update({'protein': meal_totals.protein + row_protein}) %}
|
|
{% set _ = meal_totals.update({'calories': meal_totals.calories + row_cals}) %}
|
|
|
|
{% set food_name_safe = food.name|slugify %}
|
|
<tr data-testid="food-row-{{ unique_meal_id }}-{{ food_name_safe }}">
|
|
<td>
|
|
{{ food.name }}
|
|
<span class="text-muted ms-1">({{ qty|round(1) }} {{ food.serving_unit
|
|
}})</span>
|
|
</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_carbs) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_fiber) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_carbs - row_fiber) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_fat) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_protein) }}g</td>
|
|
<td class="text-end fw-bold">{{ "%.0f"|format(row_cals) }}</td>
|
|
</tr>
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{# Display overridden/new foods #}
|
|
{% for food_id, tmf in overrides.items() %}
|
|
{% set _ = state.update({'has_foods': True}) %}
|
|
{% set food = tmf.food %}
|
|
{% set qty = tmf.quantity %}
|
|
{# Overrides are always in grams #}
|
|
{% set mult = qty / food.serving_size if food.serving_size > 0 else 0 %}
|
|
{% set row_carbs = (food.carbs or 0) * mult %}
|
|
{% set row_fiber = (food.fiber or 0) * mult %}
|
|
{% set row_fat = (food.fat or 0) * mult %}
|
|
{% set row_protein = (food.protein or 0) * mult %}
|
|
{% set row_cals = (food.calories or 0) * mult %}
|
|
|
|
{# Accumulate Totals #}
|
|
{% set _ = meal_totals.update({'carbs': meal_totals.carbs + row_carbs}) %}
|
|
{% set _ = meal_totals.update({'fiber': meal_totals.fiber + row_fiber}) %}
|
|
{% set _ = meal_totals.update({'fat': meal_totals.fat + row_fat}) %}
|
|
{% set _ = meal_totals.update({'protein': meal_totals.protein + row_protein}) %}
|
|
{% set _ = meal_totals.update({'calories': meal_totals.calories + row_cals}) %}
|
|
|
|
{% set food_name_safe = food.name|slugify %}
|
|
<tr class="table-info"
|
|
data-testid="food-row-{{ unique_meal_id }}-{{ food_name_safe }}">
|
|
<td>
|
|
{{ food.name }} <i class="bi bi-pencil-fill x-small text-muted"
|
|
title="Custom Quantity"></i>
|
|
<span class="text-muted ms-1">({{ qty|round(1) }} g)</span>
|
|
</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_carbs) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_fiber) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_carbs - row_fiber) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_fat) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(row_protein) }}g</td>
|
|
<td class="text-end fw-bold">{{ "%.0f"|format(row_cals) }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
|
|
{% if not state.has_foods %}
|
|
<tr>
|
|
<td colspan="6" class="text-center text-muted">No foods in this meal</td>
|
|
</tr>
|
|
{% else %}
|
|
{# Summary Row #}
|
|
<tr class="table-secondary fw-bold">
|
|
<td>Total</td>
|
|
<td class="text-end">{{ "%.1f"|format(meal_totals.carbs) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(meal_totals.fiber) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(meal_totals.carbs - meal_totals.fiber)
|
|
}}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(meal_totals.fat) }}g</td>
|
|
<td class="text-end">{{ "%.1f"|format(meal_totals.protein) }}g</td>
|
|
<td class="text-end">{{ "%.0f"|format(meal_totals.calories) }}</td>
|
|
</tr>
|
|
{% endif %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% else %}
|
|
<p class="text-muted mb-0">No meals tracked</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Right Column - Nutrition Totals -->
|
|
<div class="col-md-4">
|
|
<div class="sticky-top" style="top: 20px;">
|
|
<!-- Daily Totals Card -->
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">Daily Totals</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row text-center">
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong class="h4 text-primary">{{ "%.0f"|format(day_totals.calories) }}</strong>
|
|
<div class="small text-muted">Calories</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong class="h4 text-success">{{ "%.1f"|format(day_totals.protein) }}g</strong>
|
|
<div class="small text-muted">Protein ({{ day_totals.protein_pct }}%)</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong>{{ "%.1f"|format(day_totals.carbs) }}g</strong>
|
|
<div class="small text-muted">Carbs ({{ day_totals.carbs_pct }}%)</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong class="h4 text-danger">{{ "%.1f"|format(day_totals.fat) }}g</strong>
|
|
<div class="small text-muted">Fat ({{ day_totals.fat_pct }}%)</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong>{{ "%.1f"|format(day_totals.fiber) }}g</strong>
|
|
<div class="small text-muted">Fiber</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong class="h4 text-warning">{{ "%.1f"|format(day_totals.net_carbs) }}g</strong>
|
|
<div class="small text-muted">Net Carbs</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong>{{ "%.0f"|format(day_totals.sugar) }}g</strong>
|
|
<div class="small text-muted">Sugar</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 mb-3">
|
|
<div class="border rounded p-2">
|
|
<strong>{{ "%.0f"|format(day_totals.sodium) }}mg</strong>
|
|
<div class="small text-muted">Sodium</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Macro Balance Card -->
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">Macro Balance</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<div class="d-flex justify-content-between small mb-1">
|
|
<span class="text-success fw-bold">Protein</span>
|
|
<span>{{ day_totals.protein_pct }}%</span>
|
|
</div>
|
|
<div class="progress" style="height: 10px;">
|
|
<div class="progress-bar bg-success" role="progressbar"
|
|
style="width: {{ day_totals.protein_pct }}%"
|
|
aria-valuenow="{{ day_totals.protein_pct }}" aria-valuemin="0" aria-valuemax="100">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<div class="d-flex justify-content-between small mb-1">
|
|
<span class="fw-bold" style="color: #0d6efd;">Carbs</span>
|
|
<span>{{ day_totals.carbs_pct }}%</span>
|
|
</div>
|
|
<div class="progress" style="height: 10px;">
|
|
<div class="progress-bar" role="progressbar" style="width: {{ day_totals.carbs_pct }}%"
|
|
aria-valuenow="{{ day_totals.carbs_pct }}" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
<div class="mb-0">
|
|
<div class="d-flex justify-content-between small mb-1">
|
|
<span class="text-danger fw-bold">Fat</span>
|
|
<span>{{ day_totals.fat_pct }}%</span>
|
|
</div>
|
|
<div class="progress" style="height: 10px;">
|
|
<div class="progress-bar bg-danger" role="progressbar"
|
|
style="width: {{ day_totals.fat_pct }}%" aria-valuenow="{{ day_totals.fat_pct }}"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% include 'modals/add_meal.html' %}
|
|
{% include 'modals/save_template.html' %}
|
|
{% include 'modals/apply_template.html' %}
|
|
{% include 'modals/edit_tracked_meal.html' %}
|
|
{% include 'modals/add_single_food.html' %}
|
|
|
|
<script>
|
|
// Date navigation
|
|
function navigateDate(date) {
|
|
const url = new URL(window.location);
|
|
url.searchParams.set('date', date);
|
|
window.location.href = url.toString();
|
|
}
|
|
|
|
// Add meal to specific time
|
|
function addMealToTime(mealTime) {
|
|
console.log('addMealToTime called with:', mealTime);
|
|
document.getElementById('mealTimeDisplay').textContent = mealTime;
|
|
document.getElementById('addMealTime').value = mealTime;
|
|
new bootstrap.Modal(document.getElementById('addMealModal')).show();
|
|
console.log('addMealModal should be shown.');
|
|
}
|
|
|
|
// Submit add meal form
|
|
async function submitAddMeal() {
|
|
const form = document.getElementById('addMealForm');
|
|
const formData = new FormData(form);
|
|
|
|
try {
|
|
const response = await fetch('/tracker/add_meal', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
bootstrap.Modal.getInstance(document.getElementById('addMealModal')).hide();
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Remove meal
|
|
async function removeMeal(trackedMealId) {
|
|
if (confirm('Remove this meal from the tracker?')) {
|
|
try {
|
|
const response = await fetch(`/tracker/remove_meal/${trackedMealId}`, {
|
|
method: 'DELETE'
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
}
|
|
|
|
// Save as template
|
|
function saveAsTemplate() {
|
|
new bootstrap.Modal(document.getElementById('saveTemplateModal')).show();
|
|
}
|
|
|
|
// Submit save template
|
|
async function submitSaveTemplate() {
|
|
const form = document.getElementById('saveTemplateForm');
|
|
const formData = new FormData(form);
|
|
|
|
try {
|
|
const response = await fetch('/tracker/save_template', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
bootstrap.Modal.getInstance(document.getElementById('saveTemplateModal')).hide();
|
|
alert('Template saved successfully!');
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Apply template
|
|
function applyTemplate() {
|
|
new bootstrap.Modal(document.getElementById('applyTemplateModal')).show();
|
|
}
|
|
|
|
// Submit apply template
|
|
async function submitApplyTemplate() {
|
|
const form = document.getElementById('applyTemplateForm');
|
|
const formData = new FormData(form);
|
|
|
|
try {
|
|
const response = await fetch('/tracker/apply_template', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
bootstrap.Modal.getInstance(document.getElementById('applyTemplateModal')).hide();
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Reset to plan
|
|
async function resetToPlan() {
|
|
if (confirm('Reset this day back to the original plan? All custom changes will be lost.')) {
|
|
const formData = new FormData();
|
|
formData.append('person', '{{ person }}');
|
|
formData.append('date', '{{ current_date.isoformat() }}');
|
|
|
|
try {
|
|
const response = await fetch('/tracker/reset_to_plan', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
}
|
|
|
|
// Edit tracked meal
|
|
let removedFoodIds = [];
|
|
|
|
function editTrackedMeal(trackedMealId) {
|
|
removedFoodIds = []; // Reset the array when a new meal is edited
|
|
document.getElementById('editTrackedMealId').value = trackedMealId;
|
|
loadTrackedMealFoods(trackedMealId);
|
|
new bootstrap.Modal(document.getElementById('editTrackedMealModal')).show();
|
|
}
|
|
|
|
// Load foods for editing
|
|
async function loadTrackedMealFoods(trackedMealId) {
|
|
console.log('loadTrackedMealFoods called with:', 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();
|
|
console.log('Response from get_tracked_meal_foods:', data);
|
|
|
|
const container = document.getElementById('editMealFoodsList');
|
|
container.innerHTML = '';
|
|
|
|
if (data.status === 'success') {
|
|
if (data.meal_foods.length === 0) {
|
|
container.innerHTML = '<em>No foods added yet</em>';
|
|
console.log('No foods found for tracked meal.');
|
|
} else {
|
|
data.meal_foods.forEach(food => {
|
|
const foodDiv = document.createElement('div');
|
|
foodDiv.className = 'd-flex justify-content-between align-items-center mb-2';
|
|
foodDiv.innerHTML = `
|
|
<span>${food.food_name}</span>
|
|
<div class="input-group w-50">
|
|
<input type="number" step="0.01" class="form-control form-control-sm" value="${food.quantity.toFixed(2)}" data-food-id="${food.food_id}" data-item-id="${food.id}" data-is-custom="${food.is_custom}" data-testid="food-quantity-${food.food_id}">
|
|
<span class="input-group-text">g</span>
|
|
<button type="button" class="btn btn-sm btn-outline-danger" onclick="removeFoodFromTrackedMeal(${food.food_id}, ${food.id}, ${food.is_custom})" data-testid="delete-food-${food.food_id}">
|
|
<i class="bi bi-trash"></i>
|
|
</button>
|
|
</div>
|
|
`;
|
|
container.appendChild(foodDiv);
|
|
console.log('Added food to modal:', food.food_name, 'Quantity:', food.quantity);
|
|
});
|
|
}
|
|
} else {
|
|
console.error('Error status in response:', data.message);
|
|
}
|
|
} catch (error) {
|
|
console.error('Error loading tracked meal foods:', error);
|
|
alert('Error loading tracked meal foods.');
|
|
}
|
|
}
|
|
|
|
function removeFoodFromTrackedMeal(foodId, itemId, isCustom) {
|
|
// Find the button that was clicked
|
|
const button = event.target.closest('button');
|
|
if (button) {
|
|
// Find the parent div and remove it
|
|
const foodDiv = button.closest('.d-flex');
|
|
if (foodDiv) {
|
|
// We need to push the foodId, not the itemId, to the removedFoodIds array
|
|
// The backend expects food_id for removals to mark the correct override
|
|
removedFoodIds.push(foodId);
|
|
foodDiv.remove();
|
|
console.log('Removed food with foodId:', foodId, 'itemId:', itemId, 'isCustom:', isCustom, 'and removedFoodIds is now:', removedFoodIds);
|
|
}
|
|
}
|
|
}
|
|
|
|
async function saveTrackedMeal() {
|
|
const trackedMealId = document.getElementById('editTrackedMealId').value;
|
|
const inputs = document.querySelectorAll('#editMealFoodsList input[type="number"]');
|
|
|
|
const foods = [];
|
|
inputs.forEach(input => {
|
|
const foodData = {
|
|
id: parseInt(input.dataset.itemId), // Pass the item ID to the backend
|
|
food_id: parseInt(input.dataset.foodId),
|
|
grams: parseFloat(input.value), // Renamed to grams to match backend
|
|
is_custom: input.dataset.isCustom === 'true'
|
|
};
|
|
foods.push(foodData);
|
|
});
|
|
|
|
const payload = {
|
|
tracked_meal_id: trackedMealId,
|
|
foods: foods,
|
|
removed_food_ids: removedFoodIds
|
|
};
|
|
|
|
console.log('Payload being sent to /tracker/update_tracked_meal_foods:', JSON.stringify(payload, null, 2));
|
|
|
|
try {
|
|
const response = await fetch('/tracker/update_tracked_meal_foods', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(payload)
|
|
});
|
|
const result = await response.json();
|
|
if (result.status === 'success') {
|
|
bootstrap.Modal.getInstance(document.getElementById('editTrackedMealModal')).hide();
|
|
location.reload();
|
|
} else {
|
|
alert('Error saving tracked meal: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
console.error('Error saving tracked meal:', error);
|
|
alert('Error saving tracked meal.');
|
|
}
|
|
}
|
|
|
|
// Save as new meal
|
|
async function saveAsNewMeal() {
|
|
const mealName = prompt('Enter name for new meal:');
|
|
if (!mealName) return;
|
|
|
|
const trackedMealId = document.getElementById('editTrackedMealId').value;
|
|
const inputs = document.querySelectorAll('#editMealFoodsList input[type="number"]');
|
|
|
|
const foods = [];
|
|
inputs.forEach(input => {
|
|
foods.push({
|
|
food_id: parseInt(input.dataset.foodId),
|
|
quantity: parseFloat(input.value) // Quantity is now grams
|
|
});
|
|
});
|
|
|
|
try {
|
|
const response = await fetch('/tracker/save_as_new_meal', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({
|
|
tracked_meal_id: trackedMealId,
|
|
new_meal_name: mealName,
|
|
foods: foods
|
|
})
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
bootstrap.Modal.getInstance(document.getElementById('editTrackedMealModal')).hide();
|
|
alert('New meal saved successfully!');
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Show add single food modal and pre-select meal time
|
|
function addSingleFoodToTime(mealTime) {
|
|
document.getElementById('addSingleFoodMealTime').value = mealTime;
|
|
new bootstrap.Modal(document.getElementById('addSingleFoodModal')).show();
|
|
}
|
|
|
|
|
|
// Submit add single food form
|
|
async function submitAddSingleFood() {
|
|
const form = document.getElementById('addSingleFoodForm');
|
|
const formData = new FormData(form);
|
|
|
|
try {
|
|
const response = await fetch('/tracker/add_food', {
|
|
method: 'POST',
|
|
body: JSON.stringify(Object.fromEntries(formData)), // Convert FormData to JSON
|
|
headers: { 'Content-Type': 'application/json' }
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
bootstrap.Modal.getInstance(document.getElementById('addSingleFoodModal')).hide();
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Reset page (clear all meals and foods)
|
|
async function resetPage() {
|
|
if (confirm('Are you sure you want to clear all meals and foods for this day? This action cannot be undone.')) {
|
|
const formData = new FormData();
|
|
formData.append('person', '{{ person }}');
|
|
formData.append('date', '{{ current_date.isoformat() }}');
|
|
|
|
try {
|
|
const response = await fetch('/tracker/clear_page', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 'success') {
|
|
location.reload();
|
|
} else {
|
|
alert('Error: ' + result.message);
|
|
}
|
|
} catch (error) {
|
|
alert('Error: ' + error.message);
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %} |