Current directory: /home/klas4s23/domains/585455.klas4s23.mid-ica.nl/public_html/Gastenboek/uploads
<?php include $_SERVER['DOCUMENT_ROOT'] . '/inc/data.php'; ?>
<!DOCTYPE html>
<html lang="nl">
<?php include $_SERVER['DOCUMENT_ROOT'] . "/inc/site/head.php"; ?>
<body>
<?php include $_SERVER['DOCUMENT_ROOT'] . "/inc/site/header.php"; ?>
<main style="flex-direction:column;">
<div class="categories">
<?php
foreach ($category->getAllCategories() as $cat) {
echo "<a href='#$cat->name'>$cat->name</a>";
}
?>
<search>
<input type="text" placeholder="Zoeken...">
<button>Zoeken</button>
</search>
</div>
<?php
try {
foreach ($category->getAllCategories() as $cat) {
echo "<section class='category'>";
echo "<h2>" . $cat->name . "</h2>";
echo "<div class='products'>";
foreach ($products->getProductsByCategory($cat->id) as $product) {
echo "<div class='product'>";
echo "<img src='/assets/images/products/$product->image' alt='$product->name'>";
echo "<div>";
echo "<h3>" . $product->name . "</h3>";
echo "<p>" . $product->desc . "</p>";
echo "<div>";
echo "<p>€" . number_format($product->price, 2, ',', '.') . "</p>";
echo "<a class='button' onclick='openModal($product->id)'>Toevoegen aan bestelling</a>";
echo "</div>";
echo "</div>";
echo "</div>";
// Modal
echo "<div id='modal$product->id' class='modal'>";
echo "<div class='modal-content'>";
echo "<span class='close' onclick='closeModal($product->id)'>×</span>";
echo "<h3>" . $product->name . "</h3>";
echo "<p>" . $product->desc . "</p>";
echo "<p>€" . number_format($product->price, 2, ',', '.') . "</p>";
if ($products->getProductOptions($product->id)) {
echo "<div class='option'>";
echo "<label for='option_$product->id'>Selecteer een keuze</label>";
echo "<select id='option_$product->id'>";
foreach ($products->getProductOptions($product->id) as $option) {
echo "<option value='$option->id' data-name='$option->option_name' data-price='$option->price'>$option->option_name € $option->price</option>";
}
echo "</select>";
echo "</div>";
}
if ($extras->getExtrasByProductId($product->id)) {
echo "<div class='option'>";
echo "<label for='extra_$product->id'>Selecteer extra's</label>";
foreach ($extras->getExtrasByProductId($product->id) as $extra) {
$extraDetails = $extras->getExtraById($extra->extra_id);
echo "<div>";
echo "<input type='checkbox' id='extra_$extraDetails->id' name='extras[]' value='$extraDetails->id' data-name='$extraDetails->name' data-price='$extraDetails->price'>";
echo "<label for='extra_$extraDetails->id'>$extraDetails->name (€" . number_format($extraDetails->price, 2, ',', '.') . ")</label>";
echo "</div>";
}
echo "</div>";
}
echo "<form method='post' action='cart.php'>";
echo "<input type='hidden' name='product_id' value='$product->id'>";
echo "<input type='hidden' name='product_name' value='$product->name'>";
echo "<input type='hidden' name='product_price' value='$product->price'>";
echo "<input type='hidden' id='optionInput_$product->id' name='option_id' value=''>";
echo "<input type='hidden' id='optionNameInput_$product->id' name='option_name' value=''>";
echo "<input type='hidden' id='optionPriceInput_$product->id' name='option_price' value=''>";
echo "<div id='extraInputs_$product->id'></div>"; // extras worden toegevoegd
echo "<button type='submit' onclick='addExtras($product->id)'>Toevoegen aan bestelling</button>";
echo "</form>";
echo "</div>";
echo "</div>";
}
echo "</div>";
echo "</section>";
}
} catch (Exception $e) {
echo "<p>Er is een fout opgetreden bij het ophalen van de gegevens. Probeer het later opnieuw.</p>";
}
?>
</main>
<script>
function openModal(id) {
var modal = document.getElementById('modal' + id);
modal.style.display = 'block';
}
function closeModal(id) {
var modal = document.getElementById('modal' + id);
modal.style.display = 'none';
}
function addExtras(productId) {
var extraInputsDiv = document.getElementById('extraInputs_' + productId);
extraInputsDiv.innerHTML = ''; // Clear existing inputs
// Handle options
var optionSelect = document.getElementById('option_' + productId);
if (optionSelect) {
var selectedOption = optionSelect.options[optionSelect.selectedIndex];
document.getElementById('optionInput_' + productId).value = selectedOption.value;
document.getElementById('optionNameInput_' + productId).value = selectedOption.getAttribute('data-name');
document.getElementById('optionPriceInput_' + productId).value = selectedOption.getAttribute('data-price');
}
// Handle extras
var checkboxes = document.querySelectorAll('#modal' + productId + ' input[type="checkbox"]:checked');
checkboxes.forEach(function(checkbox) {
var inputId = document.createElement('input');
inputId.type = 'hidden';
inputId.name = 'extra_ids[]';
inputId.value = checkbox.value;
extraInputsDiv.appendChild(inputId);
var inputName = document.createElement('input');
inputName.type = 'hidden';
inputName.name = 'extra_names[]';
inputName.value = checkbox.getAttribute('data-name');
extraInputsDiv.appendChild(inputName);
var inputPrice = document.createElement('input');
inputPrice.type = 'hidden';
inputPrice.name = 'extra_prices[]';
inputPrice.value = checkbox.getAttribute('data-price');
extraInputsDiv.appendChild(inputPrice);
});
}
</script>
<?php include $_SERVER['DOCUMENT_ROOT'] . "/inc/site/footer.php"; ?>
</body>
</html>