diff --git a/main.js b/main.js index a71e591..e8600d7 100644 --- a/main.js +++ b/main.js @@ -114,7 +114,7 @@ async function addMenuItem(food) { nodeRoot.setAttribute("data-food-name", food.name); itemName.textContent = food.name; - itemKcal.textContent = `${nutritions100.kcal} kcal/100${food.unit}`; + itemKcal.textContent = `${formatValue(nutritions100.kcal)} kcal/100${food.unit}`; itemUnit.textContent = food.unit; fatAmount.textContent = `${food.fat}g`; @@ -163,22 +163,36 @@ async function addMenuItem(food) { function updateFoodAmount(food, amount, kcalAmount, fatAmount, carbsAmount, sugarAmount, proteinsAmount, alcAmount) { const {fat, carbs, sugar, proteins, alc, kcal} = calculateKcal(food, amount); - kcalAmount.textContent = `${parseInt(kcal)}kcal`; - fatAmount.textContent = `${parseInt(fat)}g`; - carbsAmount.textContent = `${parseInt(carbs)}g`; - sugarAmount.textContent = `${parseInt(sugar)}g`; - proteinsAmount.textContent = `${parseInt(proteins)}g`; - alcAmount.textContent = `${parseInt(alc)}g`; + setAmount(kcalAmount, kcal, "kcal"); + setAmount(fatAmount, fat, "g"); + setAmount(carbsAmount, carbs, "g"); + setAmount(sugarAmount, sugar, "g"); + setAmount(proteinsAmount, proteins, "g"); + setAmount(alcAmount, alc, "g"); + updateSummary(); } +function setAmount(element, amount, unit) { + element.textContent = `${formatValue(amount)}${unit}`; + element.setAttribute("data-value", amount); +} + +function formatValue(value) { + if (value > 0 && value < 1) { + return "<1" + } + + return Math.round(value); +} + function calculateKcal(food, amount) { - const fat = Math.round(food.fat / 100 * amount) - const carbs = Math.round(food.carbs / 100 * amount); - const sugar = Math.round(food.sugar / 100 * amount); - const proteins = Math.round(food.proteins / 100 * amount); - const alc = Math.round(amount * food.alc / 100); - const kcal = Math.round(fat * 9 + carbs * 4 + proteins * 4 + alc * 7); + const fat = food.fat / 100 * amount; + const carbs = food.carbs / 100 * amount; + const sugar = food.sugar / 100 * amount; + const proteins = food.proteins / 100 * amount; + const alc = amount * food.alc / 100; + const kcal = fat * 9 + carbs * 4 + proteins * 4 + alc * 7; const score = kcal / amount; return {fat, carbs, sugar, proteins, alc, kcal, score} } @@ -195,20 +209,20 @@ function updateSummary() { let alc = 0; for (let menuItem of menuItems) { - energy += parseInt(menuItem.querySelector(".menu-item-energy").textContent); - fat += parseInt(menuItem.querySelector(".menu-item-fat").textContent); - carbs += parseInt(menuItem.querySelector(".menu-item-carbs").textContent); - sugar += parseInt(menuItem.querySelector(".menu-item-sugar").textContent); - proteins += parseInt(menuItem.querySelector(".menu-item-proteins").textContent); - alc += parseInt(menuItem.querySelector(".menu-item-alc").textContent); + energy += parseFloat(menuItem.querySelector(".menu-item-energy").getAttribute("data-value")); + fat += parseFloat(menuItem.querySelector(".menu-item-fat").getAttribute("data-value")); + carbs += parseFloat(menuItem.querySelector(".menu-item-carbs").getAttribute("data-value")); + sugar += parseFloat(menuItem.querySelector(".menu-item-sugar").getAttribute("data-value")); + proteins += parseFloat(menuItem.querySelector(".menu-item-proteins").getAttribute("data-value")); + alc += parseFloat(menuItem.querySelector(".menu-item-alc").getAttribute("data-value")); } - summaryEnergy.textContent = `${energy}kcal`; - summaryFat.textContent = `${fat}g`; - summaryCarbs.textContent = `${carbs}g`; - summarySugar.textContent = `${sugar}g`; - summaryProteins.textContent = `${proteins}g`; - summaryAlc.textContent = `${alc}g`; + summaryEnergy.textContent = `${formatValue(energy)}kcal`; + summaryFat.textContent = `${formatValue(fat)}g`; + summaryCarbs.textContent = `${formatValue(carbs)}g`; + summarySugar.textContent = `${formatValue(sugar)}g`; + summaryProteins.textContent = `${formatValue(proteins)}g`; + summaryAlc.textContent = `${formatValue(alc)}g`; } function getScoreColor(density, unit) {