Revert to version d7b9033

This commit is contained in:
Flatlogic Bot 2026-01-26 21:27:59 +00:00
parent 3e6a0105dd
commit 7643a96d2f
2 changed files with 128 additions and 152 deletions

View File

@ -113,11 +113,11 @@ const app = {
app.state.recipes = data.recipes;
} else {
console.error('Failed to load recipes:', data.error);
app.dom.recipeCardsContainer.innerHTML = '<div class="col-12"><p class="text-center text-danger">Ошибка загрузки рецептов.</p></div>';
app.dom.recipeCardsContainer.innerHTML = '<div class="col-12"><p class="text-center text-danger">Error loading recipes.</p></div>';
}
} catch (error) {
console.error('Error:', error);
app.dom.recipeCardsContainer.innerHTML = '<div class="col-12"><p class="text-center text-danger">Не удалось подключиться к серверу.</p></div>';
app.dom.recipeCardsContainer.innerHTML = '<div class="col-12"><p class="text-center text-danger">Could not connect to the server.</p></div>';
}
},
async saveRecipe(formData) {
@ -156,7 +156,7 @@ const app = {
renderRecipeCards(recipes) {
app.dom.recipeCardsContainer.innerHTML = '';
if (!recipes || recipes.length === 0) {
app.dom.recipeCardsContainer.innerHTML = '<div class="col-12"><p class="text-center text-muted">Ваши сохраненные рецепты появятся здесь.</p></div>';
app.dom.recipeCardsContainer.innerHTML = '<div class="col-12"><p class="text-center text-muted">Your saved recipes will appear here.</p></div>';
return;
}
@ -197,14 +197,14 @@ const app = {
const text = document.createElement('p');
text.className = 'card-text text-muted';
text.textContent = `${recipe.ingredients.length} ингредиентов`;
text.textContent = `${recipe.ingredients.length} ingredients`;
const buttonGroup = document.createElement('div');
buttonGroup.className = 'mt-auto pt-2';
buttonGroup.innerHTML = `
<button class="btn btn-light btn-sm view-recipe"><i class="bi bi-eye"></i> Просмотр</button>
<button class="btn btn-light btn-sm edit-recipe"><i class="bi bi-pencil"></i> Изменить</button>
<button class="btn btn-danger btn-sm delete-recipe" title="Удалить"><i class="bi bi-trash"></i></button>
<button class="btn btn-light btn-sm view-recipe"><i class="bi bi-eye"></i> View</button>
<button class="btn btn-light btn-sm edit-recipe"><i class="bi bi-pencil"></i> Edit</button>
<button class="btn btn-danger btn-sm delete-recipe" title="Delete"><i class="bi bi-trash"></i></button>
`;
cardBody.appendChild(titleWrapper);
@ -280,7 +280,7 @@ const app = {
}
const item = combinedIngredients.get(key);
item.additionalQty += prod.quantity;
const source = prod.source || 'Дополнительный продукт';
const source = prod.source || 'Additional product';
if (!item.sources.includes(source)) {
item.sources.push(source);
}
@ -292,10 +292,10 @@ const app = {
// 3. Group for display
const groups = {
'Food': { ingredients: [], label: 'Еда' },
'Drinks': { ingredients: [], label: 'Напитки' },
'Cooking and serving': { ingredients: [], label: 'Приготовление и сервировка' },
'Tableware and consumables': { ingredients: [], label: 'Посуда и расходники' }
'Food': { ingredients: [] },
'Drinks': { ingredients: [] },
'Cooking and serving': { ingredients: [] },
'Tableware and consumables': { ingredients: [] }
};
combinedIngredients.forEach((item, key) => {
@ -321,7 +321,7 @@ const app = {
const group = groups[groupName];
if (group.ingredients.length > 0) {
totalIngredients += group.ingredients.length;
html += `<h4 class="mt-3">${group.label}</h4>`;
html += `<h4 class="mt-3">${groupName}</h4>`;
html += '<ul class="list-group list-group-flush">';
group.ingredients.forEach((item, index) => {
const totalQty = item.recipeQty + item.additionalQty;
@ -355,7 +355,7 @@ const app = {
}
if (totalIngredients === 0) {
html += '<div class="text-center text-muted p-4"><p>Ваш список покупок пуст. Добавьте рецепт, и его ингредиенты появятся здесь.</p></div>';
html += '<div class="text-center text-muted p-4"><p>Your shopping list is empty. Add a recipe, and its ingredients will appear here.</p></div>';
}
app.dom.shoppingListContainer.innerHTML = html;
@ -365,21 +365,21 @@ const app = {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
},
addIngredientRow(ingredient = { name: '', quantity: '', unit: 'г' }) {
addIngredientRow(ingredient = { name: '', quantity: '', unit: 'g' }) {
const row = document.createElement('div');
row.className = 'ingredient-row mb-3';
const units = ['г', 'кг', 'мл', 'л', 'шт', 'уп'];
const units = ['g', 'kg', 'ml', 'l', 'piece', 'pack'];
const unitButtons = units.map(u =>
`<button type="button" class="btn ${ingredient.unit === u ? 'btn-secondary' : 'btn-outline-secondary'} unit-btn">${u}</button>`
).join('');
row.innerHTML = `
<div class="mb-2">
<input type="text" class="form-control" placeholder="Название ингредиента" aria-label="Ingredient Name" value="${ingredient.name}">
<input type="text" class="form-control" placeholder="Ingredient Name" aria-label="Ingredient Name" value="${ingredient.name}">
</div>
<div class="d-flex align-items-center">
<input type="number" class="form-control me-2" placeholder="Кол-во" aria-label="Quantity" min="0" step="any" value="${ingredient.quantity}" style="width: 100px;">
<input type="number" class="form-control me-2" placeholder="Qty" aria-label="Quantity" min="0" step="any" value="${ingredient.quantity}" style="width: 100px;">
<div class="btn-group unit-selector me-2" role="group" aria-label="Unit selector">
${unitButtons}
</div>
@ -396,9 +396,9 @@ const app = {
app.dom.guestCountInput.value = '1';
app.dom.ingredientsContainer.innerHTML = '';
app.ui.addIngredientRow();
app.dom.newRecipeBtn.textContent = 'Сохранить рецепт';
app.dom.newRecipeBtn.textContent = 'Save Recipe';
app.dom.cancelEditBtn.style.display = 'none';
document.getElementById('recipe-form-modal-label').textContent = 'Добавить рецепт';
document.getElementById('recipe-form-modal-label').textContent = 'Add a Recipe';
},
populateFormForEdit(recipeId) {
const recipe = app.state.recipes.find(r => r.id == recipeId);
@ -416,9 +416,9 @@ const app = {
app.ui.addIngredientRow();
}
app.dom.newRecipeBtn.textContent = 'Обновить рецепт';
app.dom.newRecipeBtn.textContent = 'Update Recipe';
app.dom.cancelEditBtn.style.display = 'block';
document.getElementById('recipe-form-modal-label').textContent = 'Изменить рецепт';
document.getElementById('recipe-form-modal-label').textContent = 'Edit Recipe';
app.dom.recipeFormModal.show();
app.dom.recipeNameInput.focus();
@ -442,7 +442,7 @@ const app = {
}
document.getElementById('view-recipe-name').textContent = recipe.name;
document.getElementById('view-recipe-category').textContent = recipe.category || 'Без категории';
document.getElementById('view-recipe-category').textContent = recipe.category || 'No category';
document.getElementById('view-recipe-guests').textContent = recipe.guests;
const ingredientsList = document.getElementById('view-recipe-ingredients');
@ -501,10 +501,10 @@ const app = {
if (app.state.user) {
nav.innerHTML = `
<li class="nav-item me-3 d-none d-lg-block">
<span class="text-muted">Добро пожаловать, ${app.state.user.email}</span>
<span class="text-muted">Welcome, ${app.state.user.email}</span>
</li>
<li class="nav-item">
<button class="btn btn-outline-primary btn-sm" id="logout-btn">Выйти</button>
<button class="btn btn-outline-primary btn-sm" id="logout-btn">Logout</button>
</li>
`;
if (guestView) guestView.classList.add('d-none');
@ -579,7 +579,7 @@ const app = {
app.dom.aiScanBtn.addEventListener('click', async function() {
const file = app.dom.recipeImage.files[0];
if (!file) {
alert('Пожалуйста, сначала выберите изображение.');
alert('Please select an image first.');
return;
}
@ -608,16 +608,16 @@ const app = {
app.ui.addIngredientRow({
name: ing.name || '',
quantity: ing.quantity || '',
unit: ing.unit || 'г'
unit: ing.unit || 'g'
});
});
}
} else {
alert('Ошибка ИИ сканера: ' + result.error);
alert('AI Scan failed: ' + result.error);
}
} catch (error) {
console.error('Error during AI scan:', error);
alert('Произошла ошибка при сканировании ИИ.');
alert('An error occurred during AI scanning.');
} finally {
app.dom.aiScanBtn.disabled = false;
app.dom.aiScanLoading.classList.add('d-none');
@ -643,7 +643,7 @@ const app = {
app.dom.newRecipeBtn.addEventListener('click', async function() {
const recipeData = app.ui.getRecipeDataFromForm();
if (!recipeData) {
alert('Пожалуйста, заполните название рецепта, категорию, количество гостей и хотя бы один ингредиент перед сохранением.');
alert('Please fill out the recipe name, category, guests, and at least one ingredient before saving.');
return;
}
@ -679,7 +679,7 @@ const app = {
app.dom.recipeFormModal.hide();
});
} else {
alert('Не удалось сохранить рецепт: ' + data.error);
alert('Failed to save recipe: ' + data.error);
}
});
@ -691,7 +691,7 @@ const app = {
const recipeId = card.getAttribute('data-id');
if (target && target.classList.contains('delete-recipe')) {
if (confirm('Вы уверены, что хотите удалить этот рецепт?')) {
if (confirm('Are you sure you want to delete this recipe?')) {
app.api.deleteRecipe(recipeId);
}
}
@ -745,7 +745,7 @@ const app = {
name: properName,
quantity: 0,
unit: unit,
source: 'Дополнительный продукт'
source: 'Additional product'
};
app.state.additionalProducts.push(productToModify);
}
@ -769,7 +769,7 @@ const app = {
name: properName,
quantity: 0,
unit: unit,
source: 'Дополнительный продукт'
source: 'Additional product'
};
app.state.additionalProducts.push(productToModify);
}
@ -885,7 +885,7 @@ const app = {
const category = app.dom.productCategory.value;
if (!name || isNaN(quantity) || quantity <= 0 || !unit) {
alert('Пожалуйста, заполните все поля корректными значениями.');
alert('Please fill out all fields with valid values.');
return;
}
@ -899,7 +899,7 @@ const app = {
if (existingProduct) {
existingProduct.quantity += quantity;
} else {
const newProduct = { name, quantity, unit, source: 'Дополнительный продукт', category: category };
const newProduct = { name, quantity, unit, source: 'Additional product', category: category };
app.state.additionalProducts.push(newProduct);
}

208
index.php
View File

@ -5,20 +5,20 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- SEO & Meta Tags -->
<title>SmartRecipe Умный помощник по рецептам и покупкам</title>
<meta name="description" content="Сохраняйте рецепты из Pinterest и Instagram, создавайте рецепты по фото с помощью ИИ, сравнивайте цены в магазинах и делите чеки с друзьями.">
<meta name="keywords" content="рецепты ИИ, список покупок, планировщик питания, распознавание блюд, сравнение цен, разделение чека">
<title>Smart Recipe & Shopping List</title>
<meta name="description" content="Manage your recipes and generate smart shopping lists. Identify dishes with AI and calculate ingredients effortlessly.">
<meta name="keywords" content="recipe manager, shopping list generator, AI recipe scanner, cooking organizer, meal planner">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:title" content="SmartRecipe — Умный помощник по рецептам и покупкам">
<meta property="og:description" content="ИИ-помощник для создания рецептов по фото, сравнения цен и организации совместных покупок.">
<meta property="og:title" content="Smart Recipe & Shopping List">
<meta property="og:description" content="Manage your recipes and generate smart shopping lists.">
<meta property="og:image" content="">
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="SmartRecipe — Умный помощник по рецептам и покупкам">
<meta name="twitter:description" content="ИИ-помощник для создания рецептов по фото, сравнения цен и организации совместных покупок.">
<meta name="twitter:title" content="Smart Recipe & Shopping List">
<meta name="twitter:description" content="Manage your recipes and generate smart shopping lists.">
<meta name="twitter:image" content="">
<!-- Styles -->
@ -27,7 +27,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>_v4">
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>_v3">
</head>
<body>
@ -36,7 +36,7 @@
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="/">
<i class="bi bi-book-half me-2" style="color: var(--accent-color);"></i>
<span class="fw-bold">СмартРецепт</span>
<span class="fw-bold">SmartRecipe</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
@ -58,34 +58,10 @@
<!-- Left Column: Image -->
<div class="col-lg-6 d-none d-lg-block auth-image-container">
<div class="auth-image-overlay d-flex align-items-center justify-content-center p-5 text-white">
<div class="auth-branding-content text-start">
<div class="text-center mb-4">
<i class="bi bi-book-half display-1" style="color: #FF7F50; filter: drop-shadow(0 0 10px rgba(255, 127, 80, 0.3));"></i>
<h1 class="display-3 fw-bold mt-2">СмартРецепт</h1>
</div>
<p class="lead fs-5 mb-4">Это не просто кулинарная книга. Это ваш интеллектуальный помощник на каждый день и для особых случаев:</p>
<ul class="list-unstyled fs-6 mb-4">
<li class="mb-3 d-flex align-items-start">
<i class="bi bi-magic text-primary me-3 mt-1"></i>
<span><strong>Рецепты по фото:</strong> Просто загрузите изображение блюда, и ИИ создаст точный рецепт, чтобы результат был как на картинке.</span>
</li>
<li class="mb-3 d-flex align-items-start">
<i class="bi bi-cart-check text-primary me-3 mt-1"></i>
<span><strong>Умные покупки:</strong> Составляйте списки продуктов, сравнивайте цены в магазинах и находите самые выгодные предложения.</span>
</li>
<li class="mb-3 d-flex align-items-start">
<i class="bi bi-people text-primary me-3 mt-1"></i>
<span><span><strong>Совместный доступ:</strong> Распределяйте списки продуктов между друзьями и близкими для организации праздников.</span>
</li>
<li class="mb-3 d-flex align-items-start">
<i class="bi bi-receipt text-primary me-3 mt-1"></i>
<span><strong>Разделение чека:</strong> Сфотографируйте чек после покупок, и приложение само разделит сумму между всеми участниками.</span>
</li>
<li class="mb-3 d-flex align-items-start">
<i class="bi bi-browser-chrome text-primary me-3 mt-1"></i>
<span><strong>Импорт отовсюду:</strong> Сохраняйте любимые идеи из Pinterest, Instagram и других соцсетей в один клик.</span>
</li>
</ul>
<div class="auth-branding-content text-center">
<i class="bi bi-book-half display-1 mb-4" style="color: #FF7F50; filter: drop-shadow(0 0 10px rgba(255, 127, 80, 0.3));"></i>
<h1 class="display-3 fw-bold mb-4">SmartRecipe</h1>
<p class="lead fs-4">Manage your recipes and generate smart shopping lists. Identify dishes with AI and calculate ingredients effortlessly.</p>
</div>
</div>
</div>
@ -96,48 +72,48 @@
<!-- Login Form -->
<div id="login-container">
<div class="mb-5">
<h2 class="display-5 mb-2">С возвращением</h2>
<p class="text-muted">Введите свои данные для доступа к рецептам.</p>
<h2 class="display-5 mb-2">Welcome back</h2>
<p class="text-muted">Enter your credentials to access your recipes.</p>
</div>
<form id="login-form-landing">
<div class="mb-4">
<label class="form-label">Электронная почта</label>
<label class="form-label">Email Address</label>
<input type="email" class="form-control form-control-lg" name="email" placeholder="name@example.com" required>
</div>
<div class="mb-4">
<label class="form-label">Пароль</label>
<label class="form-label">Password</label>
<input type="password" class="form-control form-control-lg" name="password" placeholder="••••••••" required>
</div>
<div class="d-grid gap-2 mb-4">
<button type="submit" class="btn btn-primary btn-lg">Войти</button>
<button type="submit" class="btn btn-primary btn-lg">Sign In</button>
</div>
</form>
<p class="text-center text-muted">
Нет аккаунта? <a href="#" id="show-register" class="text-primary fw-bold text-decoration-none">Создать аккаунт</a>
Don't have an account? <a href="#" id="show-register" class="text-primary fw-bold text-decoration-none">Create account</a>
</p>
</div>
<!-- Register Form -->
<div id="register-container" class="d-none">
<div class="mb-5">
<h2 class="display-5 mb-2">Регистрация</h2>
<p class="text-muted">Начните свой путь к умной кулинарии сегодня.</p>
<h2 class="display-5 mb-2">Create Account</h2>
<p class="text-muted">Start your smart cooking journey today.</p>
</div>
<form id="register-form-landing">
<div class="mb-4">
<label class="form-label">Электронная почта</label>
<label class="form-label">Email Address</label>
<input type="email" class="form-control form-control-lg" name="email" placeholder="name@example.com" required>
</div>
<div class="mb-4">
<label class="form-label">Пароль</label>
<label class="form-label">Password</label>
<input type="password" class="form-control form-control-lg" name="password" placeholder="••••••••" required>
</div>
<div class="d-grid gap-2 mb-4">
<button type="submit" class="btn btn-primary btn-lg">Зарегистрироваться</button>
<button type="submit" class="btn btn-primary btn-lg">Register</button>
</div>
</form>
<p class="text-center text-muted">
Уже есть аккаунт? <a href="#" id="show-login" class="text-primary fw-bold text-decoration-none">Войти здесь</a>
Already have an account? <a href="#" id="show-login" class="text-primary fw-bold text-decoration-none">Login here</a>
</p>
</div>
@ -150,34 +126,34 @@
<div id="app-view" class="d-none">
<main class="container my-5">
<div class="text-center mb-5" style="padding-top: 20px;">
<h1 class="display-4 mt-4">Моя кулинарная книга</h1>
<p class="lead">Планируйте меню и управляйте списком покупок легко.</p>
<h1 class="display-4 mt-4">My Recipe Book</h1>
<p class="lead">Plan your meals and get your shopping lists sorted.</p>
</div>
<div class="row g-4">
<!-- Left Column: All Recipes -->
<div class="col-md-6">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2 class="text-center mb-0">Все рецепты</h2>
<h2 class="text-center mb-0">All Recipes</h2>
<button class="btn btn-primary" type="button" data-bs-toggle="modal" data-bs-target="#recipe-form-modal">
Добавить рецепт
Add Recipe
</button>
</div>
<div class="mb-3 search-container">
<i class="bi bi-search"></i>
<input type="text" id="recipe-search" class="form-control" placeholder="Поиск рецептов...">
<input type="text" id="recipe-search" class="form-control" placeholder="Search recipes...">
</div>
<div class="mb-3 d-flex flex-wrap gap-2" id="category-filters">
<button class="btn btn-secondary active" data-category="all">Все</button>
<button class="btn btn-outline-secondary" data-category="Drinks">Напитки</button>
<button class="btn btn-outline-secondary" data-category="Breakfast">Завтрак</button>
<button class="btn btn-outline-secondary" data-category="Dinner">Обед/Ужин</button>
<button class="btn btn-outline-secondary" data-category="Appetizers">Закуски</button>
<button class="btn btn-outline-secondary" data-category="No category">Без категории</button>
<button class="btn btn-secondary active" data-category="all">All</button>
<button class="btn btn-outline-secondary" data-category="Drinks">Drinks</button>
<button class="btn btn-outline-secondary" data-category="Breakfast">Breakfast</button>
<button class="btn btn-outline-secondary" data-category="Dinner">Dinner</button>
<button class="btn btn-outline-secondary" data-category="Appetizers">Appetizers</button>
<button class="btn btn-outline-secondary" data-category="No category">No category</button>
</div>
<div id="recipe-cards-container" class="row">
<div class="col-12">
<p class="text-center text-muted">Ваши сохраненные рецепты появятся здесь.</p>
<p class="text-center text-muted">Your saved recipes will appear here.</p>
</div>
</div>
</div>
@ -185,16 +161,16 @@
<!-- Right Column: Shopping List / Products -->
<div class="col-md-6">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2 class="text-center mb-0">Список покупок</h2>
<h2 class="text-center mb-0">Shopping List</h2>
<div>
<button id="add-product-btn" class="btn btn-primary me-2" data-bs-toggle="modal" data-bs-target="#add-product-modal">Добавить продукт</button>
<button id="print-shopping-list-btn" class="btn btn-outline-secondary"><i class="bi bi-printer"></i> Печать</button>
<button id="add-product-btn" class="btn btn-primary me-2" data-bs-toggle="modal" data-bs-target="#add-product-modal">Add Product</button>
<button id="print-shopping-list-btn" class="btn btn-outline-secondary"><i class="bi bi-printer"></i> Print</button>
</div>
</div>
<div class="card shadow">
<div class="card-body" id="shopping-list-container">
<div class="text-center text-muted p-5">
<p>Ваш список покупок появится здесь после выбора рецептов.</p>
<p>Your calculated list will appear here.</p>
</div>
</div>
</div>
@ -208,7 +184,7 @@
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="recipe-form-modal-label">Добавить рецепт</h5>
<h5 class="modal-title" id="recipe-form-modal-label">Add a Recipe</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
@ -216,61 +192,61 @@
<form id="recipe-form">
<input type="hidden" id="recipeId">
<div class="mb-3">
<label for="recipeName" class="form-label">Название рецепта</label>
<input type="text" class="form-control" id="recipeName" placeholder="например, Авокадо тост">
<label for="recipeName" class="form-label">Recipe Name</label>
<input type="text" class="form-control" id="recipeName" placeholder="e.g., Avocado Toast">
</div>
<div class="mb-3">
<label for="recipeCategory" class="form-label">Категория</label>
<label for="recipeCategory" class="form-label">Category</label>
<select class="form-control" id="recipeCategory">
<option value="" selected disabled>Выберите...</option>
<option value="Drinks">Напитки</option>
<option value="Breakfast">Завтрак</option>
<option value="Dinner">Обед/Ужин</option>
<option value="Appetizers">Закуски</option>
<option value="" selected disabled>Choose...</option>
<option value="Drinks">Drinks</option>
<option value="Breakfast">Breakfast</option>
<option value="Dinner">Dinner</option>
<option value="Appetizers">Appetizers</option>
</select>
</div>
<div class="mb-3">
<label for="recipeImage" class="form-label d-flex justify-content-between">
Фото рецепта
Recipe Image
<button type="button" id="ai-scan-btn" class="btn btn-outline-primary btn-sm">
<i class="bi bi-magic"></i> AI Сканер
<i class="bi bi-magic"></i> AI Scan
</button>
</label>
<input type="file" class="form-control" id="recipeImage">
<div id="ai-scan-loading" class="text-primary mt-2 d-none">
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
ИИ определяет блюдо и создает рецепт...
AI is identifying the dish and recipe...
</div>
</div>
<hr class="my-4 border-secondary">
<h3 class="h5 mb-3">Ингредиенты (на 1 человека)</h3>
<h3 class="h5 mb-3">Ingredients (for 1 person)</h3>
<div id="ingredients-container">
<!-- Ingredient rows will be injected here by JS -->
</div>
<button type="button" id="add-ingredient" class="btn btn-secondary btn-sm mt-2">+ Добавить ингредиент</button>
<button type="button" id="add-ingredient" class="btn btn-secondary btn-sm mt-2">+ Add Ingredient</button>
<hr class="my-4 border-secondary">
<div class="row">
<div class="col">
<div class="mb-3">
<label for="guestCount" class="form-label">Сколько гостей?</label>
<input type="number" class="form-control" id="guestCount" placeholder="например, 8" min="1" value="1">
<label for="guestCount" class="form-label">How many guests?</label>
<input type="number" class="form-control" id="guestCount" placeholder="e.g., 8" min="1" value="1">
</div>
</div>
<div class="col">
<div class="mb-3">
<label for="portionsPerGuest" class="form-label">Порций на гостя</label>
<input type="number" class="form-control" id="portionsPerGuest" placeholder="например, 2" min="1" value="1">
<label for="portionsPerGuest" class="form-label">Portions/guest</label>
<input type="number" class="form-control" id="portionsPerGuest" placeholder="e.g., 2" min="1" value="1">
</div>
</div>
</div>
<div class="d-grid gap-2 mt-4">
<button type="button" id="new-recipe-btn" class="btn btn-primary">Сохранить рецепт</button>
<button type="button" id="cancel-edit-btn" class="btn btn-outline-secondary" data-bs-dismiss="modal">Отмена</button>
<button type="button" id="new-recipe-btn" class="btn btn-primary">Save Recipe</button>
<button type="button" id="cancel-edit-btn" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
</div>
</form>
</div>
@ -284,48 +260,48 @@
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="add-product-modal-label">Добавить продукт</h5>
<h5 class="modal-title" id="add-product-modal-label">Add a Product</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form id="add-product-form">
<div class="mb-3">
<label for="productName" class="form-label">Название продукта</label>
<input type="text" class="form-control" id="productName" placeholder="например, Молоко">
<label for="productName" class="form-label">Product Name</label>
<input type="text" class="form-control" id="productName" placeholder="e.g., Milk">
</div>
<div class="row">
<div class="col">
<div class="mb-3">
<label for="productQuantity" class="form-label">Количество</label>
<input type="number" class="form-control" id="productQuantity" placeholder="например, 1" min="1" value="1">
<label for="productQuantity" class="form-label">Quantity</label>
<input type="number" class="form-control" id="productQuantity" placeholder="e.g., 1" min="1" value="1">
</div>
</div>
<div class="col">
<div class="mb-3">
<label class="form-label">Единица</label>
<label class="form-label">Unit</label>
<div class="btn-group unit-selector" role="group" aria-label="Unit selector">
<button type="button" class="btn btn-secondary unit-btn">г</button>
<button type="button" class="btn btn-outline-secondary unit-btn">кг</button>
<button type="button" class="btn btn-outline-secondary unit-btn">мл</button>
<button type="button" class="btn btn-outline-secondary unit-btn">л</button>
<button type="button" class="btn btn-outline-secondary unit-btn">шт</button>
<button type="button" class="btn btn-outline-secondary unit-btn">уп</button>
<button type="button" class="btn btn-secondary unit-btn">g</button>
<button type="button" class="btn btn-outline-secondary unit-btn">kg</button>
<button type="button" class="btn btn-outline-secondary unit-btn">ml</button>
<button type="button" class="btn btn-outline-secondary unit-btn">l</button>
<button type="button" class="btn btn-outline-secondary unit-btn">piece</button>
<button type="button" class="btn btn-outline-secondary unit-btn">pack</button>
</div>
</div>
</div>
</div>
<div class="mb-3" id="product-category-wrapper">
<label for="productCategory" class="form-label">Категория</label>
<label for="productCategory" class="form-label">Category</label>
<select class="form-select" id="productCategory">
<option value="Food" selected>Еда</option>
<option value="Drinks">Напитки</option>
<option value="Cooking and serving">Приготовление и сервировка</option>
<option value="Tableware and consumables">Посуда и расходники</option>
<option value="Food" selected>Food</option>
<option value="Drinks">Drinks</option>
<option value="Cooking and serving">Cooking and serving</option>
<option value="Tableware and consumables">Tableware and consumables</option>
</select>
</div>
<div class="d-grid gap-2 mt-4">
<button type="submit" class="btn btn-primary">Добавить продукт</button>
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Отмена</button>
<button type="submit" class="btn btn-primary">Add Product</button>
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
</div>
</form>
</div>
@ -338,27 +314,27 @@
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="view-recipe-modal-label">Просмотр рецепта</h5>
<h5 class="modal-title" id="view-recipe-modal-label">View Recipe</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<h2 id="view-recipe-name"></h2>
<p><strong>Категория:</strong> <span id="view-recipe-category"></span></p>
<p><strong>Порций:</strong> <span id="view-recipe-guests"></span></p>
<p><strong>Category:</strong> <span id="view-recipe-category"></span></p>
<p><strong>Serves:</strong> <span id="view-recipe-guests"></span></p>
<hr>
<h3>Ингредиенты</h3>
<h3>Ingredients</h3>
<ul id="view-recipe-ingredients" class="list-group">
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<footer class="text-center py-4 mt-5">
<p class="mb-0">&copy; <?php echo date("Y"); ?> СмартРецепт — Умный помощник по рецептам и покупкам.</p>
<p class="mb-0">&copy; <?php echo date("Y"); ?> Smart Recipe & Shopping List.</p>
</footer>
<!-- Scripts -->
@ -370,17 +346,17 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="confirmRemoveModalLabel">Подтверждение удаления</h5>
<h5 class="modal-title" id="confirmRemoveModalLabel">Confirm Removal</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Вы собираетесь удалить ингредиент из рецепта. Это изменит сам рецепт. Вы уверены, что хотите продолжить?</p>
<p><strong>Рецепт:</strong> <span id="modal-recipe-name"></span></p>
<p><strong>Ингредиент:</strong> <span id="modal-ingredient-name"></span></p>
<p>You are about to remove an ingredient from a recipe. This will affect the recipe itself. Are you sure you want to continue?</p>
<p><strong>Recipe:</strong> <span id="modal-recipe-name"></span></p>
<p><strong>Ingredient:</strong> <span id="modal-ingredient-name"></span></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
<button type="button" class="btn btn-danger" id="confirm-remove-btn">Удалить</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-danger" id="confirm-remove-btn">Remove</button>
</div>
</div>
</div>