diff --git a/js/views/RecipeDetail.js b/js/views/RecipeDetail.js
index 3482329..d43ed9b 100644
--- a/js/views/RecipeDetail.js
+++ b/js/views/RecipeDetail.js
@@ -12,31 +12,32 @@ export function getRecipeDetailHTML() {
-
Fluffy Pancakes
+ Serek wiejski z orzechami i owocami
- Breakfast
- Vegetarian
+ Śniadanie
+ Wegetariańskie
+ Słodkie
-
15 min
-
320 cal
+
5 min
+
642 kcal
- 2
+ 1
@@ -45,34 +46,67 @@ export function getRecipeDetailHTML() {
-
-
-
+
+
+
-
+
+
+
+
+
`;
}
export function setupRecipeDetail() {
- let currentServings = 2;
- const defaultServings = 2;
+ let currentServings = 1; // Domślnie 1 porcja dla tego przepisu
+ const defaultServings = 1;
+ let currentlySwapping = null;
+
+ // Dane do dynamicznego modala
+ const swapOptions = {
+ 'orzechy': [
+ { name: 'Orzechy włoskie', hint: 'Bazowe', color: 'gray' },
+ { name: 'Migdały', hint: '+ Białko', color: 'blue' },
+ { name: 'Orzechy laskowe', hint: 'Klasyk', color: 'gray' },
+ { name: 'Orzechy nerkowca', hint: 'Słodsze', color: 'gray' },
+ { name: 'Orzechy pekan', hint: '+ Tłuszcz', color: 'green' }
+ ],
+ 'owoce1': [
+ { name: 'Truskawki', hint: 'Bazowe', color: 'gray' },
+ { name: 'Gruszka konferencja', hint: '+ Węgle', color: 'blue' },
+ { name: 'Banany', hint: '+ Kalorie', color: 'green' }
+ ],
+ 'owoce2': [
+ { name: 'Borówki ameryk.', hint: 'Bazowe', color: 'gray' },
+ { name: 'Jagody leśne', hint: 'Sezonowe', color: 'blue' },
+ { name: 'Maliny', hint: '- Kalorie', color: 'green' }
+ ]
+ };
window.switchTab = (tabId, clickedBtn) => {
document.querySelectorAll('.tab-content').forEach(el => {
@@ -149,9 +229,64 @@ export function setupRecipeDetail() {
if (!isNaN(baseAmount)) {
let newAmount = baseAmount * ratio;
- newAmount = Number.isInteger(newAmount) ? newAmount : parseFloat(newAmount.toFixed(2));
+ newAmount = Number.isInteger(newAmount) ? newAmount : parseFloat(newAmount.toFixed(1));
el.innerText = `${newAmount} ${unit}`;
}
});
};
+
+ window.openSwapModal = (type) => {
+ currentlySwapping = type;
+
+ let title = '';
+ if(type === 'orzechy') title = 'Orzechy';
+ if(type === 'owoce1') title = 'Owoce bazy';
+ if(type === 'owoce2') title = 'Dodatki owocowe';
+
+ document.getElementById('swap-title-target').innerText = title;
+
+ // Wygeneruj opcje na podstawie słownika
+ const container = document.getElementById('swap-options-container');
+ container.innerHTML = swapOptions[type].map(opt => {
+ let badgeClass = 'text-gray-600 bg-gray-200'; // Domyślny gray
+ if (opt.color === 'blue') badgeClass = 'text-blue-600 bg-blue-100';
+ if (opt.color === 'green') badgeClass = 'text-green-600 bg-green-100';
+
+ return `
+
+ `;
+ }).join('');
+
+ const backdrop = document.getElementById('swap-backdrop');
+ backdrop.classList.remove('hidden');
+ setTimeout(() => backdrop.classList.remove('opacity-0'), 10);
+
+ const modal = document.getElementById('swap-modal');
+ modal.classList.remove('translate-y-full');
+ modal.classList.add('translate-y-0');
+ };
+
+ window.closeSwapModal = () => {
+ const backdrop = document.getElementById('swap-backdrop');
+ backdrop.classList.add('opacity-0');
+ setTimeout(() => backdrop.classList.add('hidden'), 300);
+
+ const modal = document.getElementById('swap-modal');
+ modal.classList.remove('translate-y-0');
+ modal.classList.add('translate-y-full');
+ };
+
+ window.confirmSwap = (newItemName) => {
+ if (currentlySwapping === 'orzechy') {
+ document.getElementById('ingredient-orzechy').innerText = newItemName;
+ } else if (currentlySwapping === 'owoce1') {
+ document.getElementById('ingredient-owoce1').innerText = newItemName;
+ } else if (currentlySwapping === 'owoce2') {
+ document.getElementById('ingredient-owoce2').innerText = newItemName;
+ }
+ closeSwapModal();
+ };
}
\ No newline at end of file