CalorieCalculatorJS

1
import {
2
    caloriesGoalDisplay,
3
    filterInput,
4
    productListContent,
5
    selectedProductsContainer,
6
    sortDirection,
7
    sortProductListBtn,
8
    storage,
9
    totalCaloriesDisplay
10
} from "../variables.js";
11
import {handleDragStart} from "./dragAndDropFunctions.js";
12
import currentDate from "../utils/currentDate.js";
13
import removeSelectedProduct from "./removeSelectedProduct.js";
14
import {checkDailyCaloriesLimit} from "./ProductManager.js";
15
import {displayChart} from "./chart.js";
16

17
// Отображение списка продуктов с учетом фильтрации и сортировки
18
export const displayProducts = () => {
19
    // Получение значения фильтра по имени
20
    const filterByName = filterInput.value.toLowerCase();
21
    // Загрузка сохраненных продуктов из localStorage
22
    const products = JSON.parse(localStorage.getItem(storage.products)) || [];
23

24
    // Фильтрация продуктов по имени
25
    const filteredProducts = products.filter(product =>
26
        product.name.toLowerCase().includes(filterByName)
27
    );
28

29
    // Сортировка продуктов по калориям
30
    const sortedProducts = filteredProducts.sort((a, b) => {
31
        const multiplier = sortDirection.ascending ? 1 : -1;
32
        return multiplier * (a.calories - b.calories);
33
    });
34

35
    // Отображение отфильтрованных и отсортированных продуктов
36
    if (sortedProducts.length === 0) {
37
        productListContent.innerHTML = '<h3>Нет сохраненных продуктов</h3>';
38
    } else {
39
        productListContent.innerHTML = '';
40
        sortedProducts.forEach(product => {
41
            const div = document.createElement('div');
42
            div.className = 'product-card';
43
            div.draggable = true;
44
            div.addEventListener('dragstart', (e) => handleDragStart(e, product.id));
45
            div.innerHTML = `<span class="product-card-title">${product.name}</span>
46
                            <span>${product.calories} ккал</span>
47
                            <p>${product.description}</p>
48
                            <button class="delete-btn" data-product-id="${product.id}">&times;</button>`;
49
            productListContent.appendChild(div);
50
        });
51
    }
52

53
    // Обновление текста кнопки сортировки
54
    sortProductListBtn.textContent = `Сортировать по калориям ${sortDirection.ascending ? '↑' : '↓'}`;
55
};
56

57
// Отображение целевых на текущую дату
58
export const displayGoals = () => {
59
    // Получение текущих целей из localStorage
60
    let goals = JSON.parse(localStorage.getItem(storage.goals)) || [];
61

62
    const currentGoals = goals.find(goal => goal.date === currentDate());
63
    if (currentGoals) {
64
        caloriesGoalDisplay.textContent = `Сегодняшняя цель по калориям: ${currentGoals.caloriesGoal} ккал`;
65
    } else {
66
        caloriesGoalDisplay.textContent = 'Цель не задана';
67
    }
68
};
69

70
// Рендеринг съеденных продуктов
71
export const displaySelectedProducts = () => {
72
    // Получение выбранных продуктов из localStorage
73
    let selectedProducts = JSON.parse(localStorage.getItem(storage.selectedProducts)) || [];
74

75
    // Поиск записи о продуктах для текущей даты
76
    let currentDateEntry = selectedProducts.find(entry => entry.date === currentDate());
77

78
    // Отображение выбранных продуктов
79
    if (currentDateEntry) {
80
        const totalCalories = currentDateEntry.products.reduce((sum, productGroup) => {
81
            return sum + productGroup.reduce((productSum, product) => productSum + parseInt(product.calories), 0);
82
        }, 0);
83

84
        // Отображение выбранных продуктов в списке
85
        selectedProductsContainer.innerHTML = '';
86

87
        currentDateEntry.products.forEach(productGroup => {
88
            productGroup.forEach(product => {
89
                const li = document.createElement('li');
90
                li.className = 'selected-product-card';
91

92
                li.innerHTML = `<span class="selected-product-card-title">${product.name}</span>
93
                                <span>${product.calories} ккал</span>
94
                                <button class="remove-btn" data-product-id="${product.id}">&times;</button>`;
95

96
                li.querySelector('.remove-btn').addEventListener('click', () => {
97
                    removeSelectedProduct(product.id);
98
                    displaySelectedProducts();
99
                });
100

101
                selectedProductsContainer.appendChild(li);
102
            });
103
        });
104

105
        // Отображение общей суммы калорий для текущей даты
106
        totalCaloriesDisplay.textContent = `Сегодняшний итог: ${totalCalories} ккал`;
107
    } else {
108
        // Отображение сообщения, если нет выбранных продуктов
109
        selectedProductsContainer.innerHTML = '<h3>На сегодня нет выбранных продуктов</h3>';
110
        totalCaloriesDisplay.textContent = 'Сумма калорий: 0 ккал';
111
    }
112

113
    // Проверка на превышение дневного лимита калорий и отображение графика
114
    checkDailyCaloriesLimit();
115
    displayChart();
116
};