alvin/Schoolkantine
1
0
Fork 0
mirror of https://github.com/Alvin-Zilverstand/Schoolkantine.git synced 2026-03-06 21:36:27 +01:00
Code Issues Packages Projects Releases Wiki Activity

Refactor shopping cart functionality and styles; add new cart.js and cart.css files

Browse Source
This commit is contained in:
vista-man
2025-02-12 13:38:13 +01:00
parent 9752c92d1c
commit e0077b4e1c
7 changed files with 100 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
website/script.js
View File

@@ -1,6 +1,3 @@
// Array to hold items added to the shopping cart
const cart = [];
// Functie om de details van een geselecteerd item weer te geven
function showItemDetails(item) {
var title = "";
@@ -16,7 +13,7 @@ function showItemDetails(item) {
price = 3.50;
} else if (item === 'drinks') {
title = "Spa Water";
imageSrc = "media/spa.jpg";
imageSrc = "media/spa.webp";
description = "Koude verfrissende water.";
price = 1.00;
} else if (item === 'Snacks') {
@@ -64,46 +61,6 @@ function showItemDetails(item) {
document.getElementById("modal").style.display = "block";
}
// Functie om een item aan het winkelwagentje toe te voegen
function addToCart(item) {
cart.unshift(item); // Add item to the beginning of the cart array
updateCart();
closeModal();
}
// Functie om het winkelwagentje bij te werken
function updateCart() {
const cartItemsContainer = document.getElementById("cart-items");
cartItemsContainer.innerHTML = '';
let totalPrice = 0;
cart.forEach((item, index) => {
const cartItemElement = document.createElement('li');
cartItemElement.className = 'cart-item';
cartItemElement.innerHTML = `
<span>${item.title}</span>
<span>€${item.price.toFixed(2)}</span>
<button onclick="removeFromCart(${index})">Verwijderen</button>
`;
cartItemsContainer.appendChild(cartItemElement);
totalPrice += item.price;
});
document.getElementById('total-price').innerText = totalPrice.toFixed(2);
// Show or hide the "Bestellen" button based on the cart's content
const orderButton = document.getElementById('order-button');
if (cart.length > 0) {
orderButton.style.display = 'block';
} else {
orderButton.style.display = 'none';
}
}
// Functie om een item uit het winkelwagentje te verwijderen
function removeFromCart(index) {
cart.splice(index, 1);
updateCart();
}
// Functie om het modaal venster te sluiten
function closeModal() {
document.getElementById("modal").style.display = "none";
@@ -115,6 +72,3 @@ window.onclick = function(event) {
closeModal();
}
}
// Initial call to updateCart to ensure the button is hidden on page load
updateCart();