diff --git a/projects/challange 7/Schoolkantine/README.md b/projects/challange 7/Schoolkantine/README.md new file mode 100644 index 0000000..7482d6a --- /dev/null +++ b/projects/challange 7/Schoolkantine/README.md @@ -0,0 +1 @@ +# Schoolkantine \ No newline at end of file diff --git a/projects/challange 7/Schoolkantine/website/betaal.css b/projects/challange 7/Schoolkantine/website/betaal.css new file mode 100644 index 0000000..e448546 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/betaal.css @@ -0,0 +1,49 @@ +body { + font-family: Arial, sans-serif; + text-align: center; + padding: 50px; + background-color: #f9f9f9; +} + +h1 { + color: #F56E28; +} + +p { + font-size: 1.2em; + margin-top: 20px; +} + +button { + margin-top: 30px; + padding: 10px 20px; + background-color: #F56E28; + color: white; + border: none; + cursor: pointer; + font-size: 1.1em; +} + +button:hover { + background-color: #F56E28; +} + +/* Responsive design */ +@media (max-width: 768px) { + body { + padding: 20px; + } + + h1 { + font-size: 1.5em; + } + + p { + font-size: 1em; + } + + button { + font-size: 1em; + padding: 10px 15px; + } +} \ No newline at end of file diff --git a/projects/challange 7/Schoolkantine/website/betalen.html b/projects/challange 7/Schoolkantine/website/betalen.html new file mode 100644 index 0000000..2a53d3a --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/betalen.html @@ -0,0 +1,31 @@ + + + + + + + Betaalpagina Mees + + + + + + + +

Bedankt voor uw bestelling!

+

Uw bestelling is succesvol geplaatst. U kunt dit tabblad nu sluiten.

+ +

Uw Bestellings nummer =

+ + + diff --git a/projects/challange 7/Schoolkantine/website/complete_order.php b/projects/challange 7/Schoolkantine/website/complete_order.php new file mode 100644 index 0000000..373af2c --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/complete_order.php @@ -0,0 +1,35 @@ + false, 'message' => 'Order number is required']); + exit; +} + +// Delete the order from the database +$sql = "DELETE FROM orders WHERE order_number = ?"; +$stmt = $conn->prepare($sql); +if ($stmt === false) { + error_log("Failed to prepare statement: " . $conn->error); + echo json_encode(['success' => false, 'message' => 'Failed to prepare statement']); + exit; +} + +$stmt->bind_param("s", $order_number); +if ($stmt->execute()) { + echo json_encode(['success' => true]); +} else { + error_log("Failed to execute statement: " . $stmt->error); + echo json_encode(['success' => false, 'message' => 'Failed to execute statement']); +} + +$stmt->close(); +$conn->close(); +?> diff --git a/projects/challange 7/Schoolkantine/website/config.php b/projects/challange 7/Schoolkantine/website/config.php new file mode 100644 index 0000000..f2d5889 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/config.php @@ -0,0 +1,14 @@ +connect_error) { + die("Connection failed: " . $conn->connect_error); +} +?> diff --git a/projects/challange 7/Schoolkantine/website/get_items.php b/projects/challange 7/Schoolkantine/website/get_items.php new file mode 100644 index 0000000..6d2c708 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/get_items.php @@ -0,0 +1,54 @@ + 'Category is required']); + exit; +} + +$sql = "SELECT * FROM items WHERE category = ?"; +$stmt = $conn->prepare($sql); +if ($stmt === false) { + error_log("Failed to prepare statement: " . $conn->error); + echo json_encode(['error' => 'Failed to prepare statement']); + exit; +} + +$stmt->bind_param("s", $category); +$stmt->execute(); +$result = $stmt->get_result(); + +$items = []; +while ($row = $result->fetch_assoc()) { + $items[] = [ + 'title' => $row['title'], + 'imageSrc' => $row['imageSrc'], + 'price' => (float)$row['price'], // Ensure price is a number + 'description' => $row['description'] // Include description + ]; +} + +if (empty($items)) { + error_log("No items found for category: " . $category); +} + +// Clean any buffered output (whitespace, etc.) +ob_clean(); +echo json_encode($items); + +$stmt->close(); +$conn->close(); +ob_end_flush(); +?> diff --git a/projects/challange 7/Schoolkantine/website/get_orders.php b/projects/challange 7/Schoolkantine/website/get_orders.php new file mode 100644 index 0000000..60a8526 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/get_orders.php @@ -0,0 +1,27 @@ +query($sql); + +if ($result === false) { + error_log("Failed to fetch orders: " . $conn->error); + echo json_encode(['error' => 'Failed to fetch orders']); + exit; +} + +$orders = []; +while ($row = $result->fetch_assoc()) { + $row['items'] = json_decode($row['items'], true); // Decode the JSON items + $row['total_price'] = (float)$row['total_price']; // Ensure total_price is a number + $orders[] = $row; +} + +echo json_encode($orders); + +$conn->close(); +?> diff --git a/projects/challange 7/Schoolkantine/website/index.html b/projects/challange 7/Schoolkantine/website/index.html new file mode 100644 index 0000000..60093b7 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/index.html @@ -0,0 +1,78 @@ + + + + + + + Het hoofdmenu van de Mees + + + + + + + + + + + + +
+
Broodjes
+
Koude Dranken
+
Warme Dranken
+
Snacks
+
Desserts
+
Deals
+
Soepen
+
Salades
+
Sausjes
+
Yoghurt
+
Snoep
+
Overige
+
+ + +
+ +
+ + + + + +
+

Winkelmandje

+ +

Totaal: €0.00

+ + + + +
+ + +
+ + 0 +
+ + +
EN
+ + + + + + \ No newline at end of file diff --git a/projects/challange 7/Schoolkantine/website/kleurengebruik/kleur layout b/projects/challange 7/Schoolkantine/website/kleurengebruik/kleur layout new file mode 100644 index 0000000..bd1e420 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/kleurengebruik/kleur layout @@ -0,0 +1,3 @@ +#676767 +#ffffff +#F56E28 \ No newline at end of file diff --git a/projects/challange 7/Schoolkantine/website/media/Bananas.png b/projects/challange 7/Schoolkantine/website/media/Bananas.png new file mode 100644 index 0000000..20d3f0e Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Bananas.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Friet.png b/projects/challange 7/Schoolkantine/website/media/Friet.png new file mode 100644 index 0000000..eabf51d Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Friet.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/GehaktJoppie.png b/projects/challange 7/Schoolkantine/website/media/GehaktJoppie.png new file mode 100644 index 0000000..72e3c97 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/GehaktJoppie.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Goudberen.png b/projects/challange 7/Schoolkantine/website/media/Goudberen.png new file mode 100644 index 0000000..7330aea Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Goudberen.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Happycola.png b/projects/challange 7/Schoolkantine/website/media/Happycola.png new file mode 100644 index 0000000..bb43f3a Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Happycola.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Kaassoufle.png b/projects/challange 7/Schoolkantine/website/media/Kaassoufle.png new file mode 100644 index 0000000..568ba62 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Kaassoufle.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Kersen.png b/projects/challange 7/Schoolkantine/website/media/Kersen.png new file mode 100644 index 0000000..390bf12 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Kersen.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Kikkertjes.png b/projects/challange 7/Schoolkantine/website/media/Kikkertjes.png new file mode 100644 index 0000000..bf97c7d Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Kikkertjes.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Kipcorn.png b/projects/challange 7/Schoolkantine/website/media/Kipcorn.png new file mode 100644 index 0000000..0de8933 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Kipcorn.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Kipnuggets.png b/projects/challange 7/Schoolkantine/website/media/Kipnuggets.png new file mode 100644 index 0000000..336112f Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Kipnuggets.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Kroket.png b/projects/challange 7/Schoolkantine/website/media/Kroket.png new file mode 100644 index 0000000..47d547b Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Kroket.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Mexicano.png b/projects/challange 7/Schoolkantine/website/media/Mexicano.png new file mode 100644 index 0000000..4b77e01 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Mexicano.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Perzikken.png b/projects/challange 7/Schoolkantine/website/media/Perzikken.png new file mode 100644 index 0000000..759ec11 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Perzikken.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Redbull.png b/projects/challange 7/Schoolkantine/website/media/Redbull.png new file mode 100644 index 0000000..a7778fc Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Redbull.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Rolletje.png b/projects/challange 7/Schoolkantine/website/media/Rolletje.png new file mode 100644 index 0000000..fe07793 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Rolletje.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Saucijz.png b/projects/challange 7/Schoolkantine/website/media/Saucijz.png new file mode 100644 index 0000000..bd57062 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Saucijz.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Spring.png b/projects/challange 7/Schoolkantine/website/media/Spring.png new file mode 100644 index 0000000..6ee5d77 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Spring.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Starmix.png b/projects/challange 7/Schoolkantine/website/media/Starmix.png new file mode 100644 index 0000000..e09b291 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Starmix.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Tangfastics.png b/projects/challange 7/Schoolkantine/website/media/Tangfastics.png new file mode 100644 index 0000000..89d09fe Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Tangfastics.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/Tropifrutti.png b/projects/challange 7/Schoolkantine/website/media/Tropifrutti.png new file mode 100644 index 0000000..930de62 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/Tropifrutti.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/aardappel.jpg b/projects/challange 7/Schoolkantine/website/media/aardappel.jpg new file mode 100644 index 0000000..42ab6d2 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/aardappel.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/aardbij-yoghurt.png b/projects/challange 7/Schoolkantine/website/media/aardbij-yoghurt.png new file mode 100644 index 0000000..421121d Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/aardbij-yoghurt.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/bagel.jpeg b/projects/challange 7/Schoolkantine/website/media/bagel.jpeg new file mode 100644 index 0000000..d76f206 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/bagel.jpeg differ diff --git a/projects/challange 7/Schoolkantine/website/media/barbecue.png b/projects/challange 7/Schoolkantine/website/media/barbecue.png new file mode 100644 index 0000000..6ac0171 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/barbecue.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/beker.jpeg b/projects/challange 7/Schoolkantine/website/media/beker.jpeg new file mode 100644 index 0000000..8ab8fb3 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/beker.jpeg differ diff --git a/projects/challange 7/Schoolkantine/website/media/bestek.jpg b/projects/challange 7/Schoolkantine/website/media/bestek.jpg new file mode 100644 index 0000000..d9499d6 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/bestek.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/bitterbal.jpg b/projects/challange 7/Schoolkantine/website/media/bitterbal.jpg new file mode 100644 index 0000000..d218b0a Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/bitterbal.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/breaker.jpg b/projects/challange 7/Schoolkantine/website/media/breaker.jpg new file mode 100644 index 0000000..5840829 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/breaker.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/broodje-gehakt.jpg b/projects/challange 7/Schoolkantine/website/media/broodje-gehakt.jpg new file mode 100644 index 0000000..30754bd Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/broodje-gehakt.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/broodje-gezond.jpg b/projects/challange 7/Schoolkantine/website/media/broodje-gezond.jpg new file mode 100644 index 0000000..804ac56 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/broodje-gezond.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/choco-gs.jpg b/projects/challange 7/Schoolkantine/website/media/choco-gs.jpg new file mode 100644 index 0000000..e65ea19 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/choco-gs.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/chocomel.jpg b/projects/challange 7/Schoolkantine/website/media/chocomel.jpg new file mode 100644 index 0000000..6a350cf Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/chocomel.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/cola-cherry.jpg b/projects/challange 7/Schoolkantine/website/media/cola-cherry.jpg new file mode 100644 index 0000000..e394ac5 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/cola-cherry.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/cola-vanilla.jpg b/projects/challange 7/Schoolkantine/website/media/cola-vanilla.jpg new file mode 100644 index 0000000..def59fd Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/cola-vanilla.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/cola-zero.jpg b/projects/challange 7/Schoolkantine/website/media/cola-zero.jpg new file mode 100644 index 0000000..9f00b8c Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/cola-zero.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/cola.jpg b/projects/challange 7/Schoolkantine/website/media/cola.jpg new file mode 100644 index 0000000..9aa5f3e Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/cola.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/curry.png b/projects/challange 7/Schoolkantine/website/media/curry.png new file mode 100644 index 0000000..dfd0ab0 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/curry.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/deals.jpg b/projects/challange 7/Schoolkantine/website/media/deals.jpg new file mode 100644 index 0000000..322898a Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/deals.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/drpepper.png b/projects/challange 7/Schoolkantine/website/media/drpepper.png new file mode 100644 index 0000000..49fcce5 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/drpepper.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/erwtensoep.webp b/projects/challange 7/Schoolkantine/website/media/erwtensoep.webp new file mode 100644 index 0000000..1c1ea9e Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/erwtensoep.webp differ diff --git a/projects/challange 7/Schoolkantine/website/media/fanta-cassis.jpg b/projects/challange 7/Schoolkantine/website/media/fanta-cassis.jpg new file mode 100644 index 0000000..3f90b9f Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/fanta-cassis.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/fanta-exotic-zero.jpg b/projects/challange 7/Schoolkantine/website/media/fanta-exotic-zero.jpg new file mode 100644 index 0000000..33e557d Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/fanta-exotic-zero.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/fanta-lemon-zero.jpg b/projects/challange 7/Schoolkantine/website/media/fanta-lemon-zero.jpg new file mode 100644 index 0000000..226cedd Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/fanta-lemon-zero.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/fanta-zero.jpg b/projects/challange 7/Schoolkantine/website/media/fanta-zero.jpg new file mode 100644 index 0000000..0e036f0 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/fanta-zero.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/fanta.jpg b/projects/challange 7/Schoolkantine/website/media/fanta.jpg new file mode 100644 index 0000000..2d675e1 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/fanta.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/favicon.ico b/projects/challange 7/Schoolkantine/website/media/favicon.ico new file mode 100644 index 0000000..d0f51e2 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/favicon.ico differ diff --git a/projects/challange 7/Schoolkantine/website/media/frikandel.jpg b/projects/challange 7/Schoolkantine/website/media/frikandel.jpg new file mode 100644 index 0000000..68b8abf Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/frikandel.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/frikandelbroodje.png b/projects/challange 7/Schoolkantine/website/media/frikandelbroodje.png new file mode 100644 index 0000000..e66fd66 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/frikandelbroodje.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/fristi.png b/projects/challange 7/Schoolkantine/website/media/fristi.png new file mode 100644 index 0000000..98902d4 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/fristi.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/griekse.jpg b/projects/challange 7/Schoolkantine/website/media/griekse.jpg new file mode 100644 index 0000000..c3404b3 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/griekse.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/groentensoep.jpg b/projects/challange 7/Schoolkantine/website/media/groentensoep.jpg new file mode 100644 index 0000000..bf08e52 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/groentensoep.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/groentesoep.jpg b/projects/challange 7/Schoolkantine/website/media/groentesoep.jpg new file mode 100644 index 0000000..bf08e52 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/groentesoep.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/ijs.png b/projects/challange 7/Schoolkantine/website/media/ijs.png new file mode 100644 index 0000000..abd88ab Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/ijs.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/images.jpeg b/projects/challange 7/Schoolkantine/website/media/images.jpeg new file mode 100644 index 0000000..5d260a0 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/images.jpeg differ diff --git a/projects/challange 7/Schoolkantine/website/media/ketchup.jpg b/projects/challange 7/Schoolkantine/website/media/ketchup.jpg new file mode 100644 index 0000000..a55ee82 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/ketchup.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/kippensoep.jpg b/projects/challange 7/Schoolkantine/website/media/kippensoep.jpg new file mode 100644 index 0000000..92e6c79 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/kippensoep.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/koffie.jpg b/projects/challange 7/Schoolkantine/website/media/koffie.jpg new file mode 100644 index 0000000..31cd8cb Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/koffie.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/koude-chocomel.jpg b/projects/challange 7/Schoolkantine/website/media/koude-chocomel.jpg new file mode 100644 index 0000000..1dec790 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/koude-chocomel.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/krokante-kip.jpg b/projects/challange 7/Schoolkantine/website/media/krokante-kip.jpg new file mode 100644 index 0000000..c069208 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/krokante-kip.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/kroket.webp b/projects/challange 7/Schoolkantine/website/media/kroket.webp new file mode 100644 index 0000000..99e3291 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/kroket.webp differ diff --git a/projects/challange 7/Schoolkantine/website/media/kwark.png b/projects/challange 7/Schoolkantine/website/media/kwark.png new file mode 100644 index 0000000..53ba8d6 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/kwark.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/logo-mees-catering-black.svg b/projects/challange 7/Schoolkantine/website/media/logo-mees-catering-black.svg new file mode 100644 index 0000000..002f52a --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/media/logo-mees-catering-black.svg @@ -0,0 +1,42 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/projects/challange 7/Schoolkantine/website/media/logo.png b/projects/challange 7/Schoolkantine/website/media/logo.png new file mode 100644 index 0000000..fe61b23 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/logo.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/mayo.jpeg b/projects/challange 7/Schoolkantine/website/media/mayo.jpeg new file mode 100644 index 0000000..c9b2d9e Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/mayo.jpeg differ diff --git a/projects/challange 7/Schoolkantine/website/media/melk.jpeg b/projects/challange 7/Schoolkantine/website/media/melk.jpeg new file mode 100644 index 0000000..c250992 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/melk.jpeg differ diff --git a/projects/challange 7/Schoolkantine/website/media/mosterd.jpg b/projects/challange 7/Schoolkantine/website/media/mosterd.jpg new file mode 100644 index 0000000..6d0019c Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/mosterd.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/optimel-groot.png b/projects/challange 7/Schoolkantine/website/media/optimel-groot.png new file mode 100644 index 0000000..5d2f781 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/optimel-groot.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/optimel-klein.jpg b/projects/challange 7/Schoolkantine/website/media/optimel-klein.jpg new file mode 100644 index 0000000..12d8bbc Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/optimel-klein.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/pinballs.png b/projects/challange 7/Schoolkantine/website/media/pinballs.png new file mode 100644 index 0000000..4440c44 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/pinballs.png differ diff --git a/projects/challange 7/Schoolkantine/website/media/rietjes.jpeg b/projects/challange 7/Schoolkantine/website/media/rietjes.jpeg new file mode 100644 index 0000000..fef72fa Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/rietjes.jpeg differ diff --git a/projects/challange 7/Schoolkantine/website/media/salade.jpg b/projects/challange 7/Schoolkantine/website/media/salade.jpg new file mode 100644 index 0000000..c909c1b Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/salade.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/soep.jpg b/projects/challange 7/Schoolkantine/website/media/soep.jpg new file mode 100644 index 0000000..b29db13 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/soep.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/softijs.jpg b/projects/challange 7/Schoolkantine/website/media/softijs.jpg new file mode 100644 index 0000000..aca53b5 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/softijs.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/sorbet.webp b/projects/challange 7/Schoolkantine/website/media/sorbet.webp new file mode 100644 index 0000000..1edf8fd Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/sorbet.webp differ diff --git a/projects/challange 7/Schoolkantine/website/media/spa-rood.jpg b/projects/challange 7/Schoolkantine/website/media/spa-rood.jpg new file mode 100644 index 0000000..d99aa13 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/spa-rood.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/spa.webp b/projects/challange 7/Schoolkantine/website/media/spa.webp new file mode 100644 index 0000000..e9edc2c Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/spa.webp differ diff --git a/projects/challange 7/Schoolkantine/website/media/sprite.jpg b/projects/challange 7/Schoolkantine/website/media/sprite.jpg new file mode 100644 index 0000000..62902f8 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/sprite.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/sundea.jpg b/projects/challange 7/Schoolkantine/website/media/sundea.jpg new file mode 100644 index 0000000..ee96cee Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/sundea.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/thee.jpg b/projects/challange 7/Schoolkantine/website/media/thee.jpg new file mode 100644 index 0000000..a5c61c3 Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/thee.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/media/zoetzuur.jpg b/projects/challange 7/Schoolkantine/website/media/zoetzuur.jpg new file mode 100644 index 0000000..bae60dc Binary files /dev/null and b/projects/challange 7/Schoolkantine/website/media/zoetzuur.jpg differ diff --git a/projects/challange 7/Schoolkantine/website/orders.css b/projects/challange 7/Schoolkantine/website/orders.css new file mode 100644 index 0000000..d1391f6 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/orders.css @@ -0,0 +1,52 @@ +body { + font-family: Arial, sans-serif; + background-color: #f9f9f9; + padding: 20px; + text-align: center; +} + +h1 { + color: #F56E28; +} + +.orders-container { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 20px; +} + +.order { + background-color: white; + border: 2px solid #F56E28; + border-radius: 10px; + padding: 20px; + width: 300px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + text-align: left; +} + +.order h2 { + margin-top: 0; + color: #F56E28; +} + +.order p { + margin: 5px 0; +} + +.order ul { + list-style-type: none; + padding: 0; +} + +.order li { + margin: 5px 0; +} + +/* Responsive design */ +@media (max-width: 768px) { + .order { + width: 100%; /* Full width for smaller screens */ + } +} diff --git a/projects/challange 7/Schoolkantine/website/orders.html b/projects/challange 7/Schoolkantine/website/orders.html new file mode 100644 index 0000000..d204c52 --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/orders.html @@ -0,0 +1,90 @@ + + + + + + + Bestellingen Overzicht + + + + +

Bestellingen Overzicht

+
+ +
+ + + + + diff --git a/projects/challange 7/Schoolkantine/website/place_order.php b/projects/challange 7/Schoolkantine/website/place_order.php new file mode 100644 index 0000000..0490b5f --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/place_order.php @@ -0,0 +1,48 @@ + false, 'message' => 'Invalid order data']); + exit; +} + +// Fetch the last order number +$sql = "SELECT order_number FROM orders ORDER BY id DESC LIMIT 1"; +$result = $conn->query($sql); +if ($result === false) { + error_log("Failed to fetch last order number: " . $conn->error); + echo json_encode(['success' => false, 'message' => 'Failed to fetch last order number']); + exit; +} + +$last_order_number = $result->fetch_assoc()['order_number'] ?? '#000'; +$new_order_number = '#' . str_pad((int)substr($last_order_number, 1) + 1, 3, '0', STR_PAD_LEFT); + +$sql = "INSERT INTO orders (order_number, items, total_price) VALUES (?, ?, ?)"; +$stmt = $conn->prepare($sql); +if ($stmt === false) { + error_log("Failed to prepare statement: " . $conn->error); + echo json_encode(['success' => false, 'message' => 'Failed to prepare statement']); + exit; +} + +$stmt->bind_param("ssd", $new_order_number, $items, $total_price); +if ($stmt->execute()) { + echo json_encode(['success' => true, 'order_number' => $new_order_number]); +} else { + error_log("Failed to execute statement: " . $stmt->error); + echo json_encode(['success' => false, 'message' => 'Failed to execute statement']); +} + +$stmt->close(); +$conn->close(); +?> diff --git a/projects/challange 7/Schoolkantine/website/script.js b/projects/challange 7/Schoolkantine/website/script.js new file mode 100644 index 0000000..eb0013c --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/script.js @@ -0,0 +1,449 @@ +// Function to show products for a selected category +function showCategory(category) { + console.log(`Fetching items for category: ${category}`); // Debugging: log category + const productDisplay = document.getElementById('product-display'); + productDisplay.innerHTML = ''; // Clear display before adding new items + + fetch(`get_items.php?category=${category}`) + .then(response => { + if (!response.ok) { + console.error('Network response was not ok', response.statusText); + throw new Error('Network response was not ok'); + } + return response.json(); + }) + .then(items => { + if (items.error) { + console.error('Error fetching items:', items.error); + return; + } + if (items.length === 0) { + console.warn(`No items found for category: ${category}`); // Debugging: log no items found + } + console.log('Fetched items:', items); // Debugging: log fetched items + items.forEach(item => { + const productBox = document.createElement('div'); + productBox.classList.add('product-box'); + productBox.onclick = () => showItemDetails(item); + productBox.innerHTML = ` + ${item.title} +

${item.title}

+

€${item.price.toFixed(2)}

+ `; + productDisplay.appendChild(productBox); + }); + document.querySelector('.menu-bar').classList.add('top'); // Bring menu to top + document.getElementById('cart').classList.add('visible'); + document.querySelector('.cart-icon').classList.add('visible'); + + // Remove logo if present + const logo = document.querySelector('.logo'); + if (logo) { logo.remove(); } + }) + .catch(error => console.error('Error fetching items:', error)); +} + +// Functie om de details van een item weer te geven in het modaal +function showItemDetails(item) { + const title = item.title; + const imageSrc = item.imageSrc; + const description = item.description; // Use description from item data + const price = item.price; + + // Update de inhoud van het modaal venster + document.getElementById("modal-title").innerText = title; + document.getElementById("modal-image").src = imageSrc; + document.getElementById("modal-description").innerText = description; + document.getElementById("modal-price").innerText = `Prijs: €${price.toFixed(2)}`; + document.getElementById("add-to-cart").onclick = function() { + addToCart({ title, price }); + }; + + document.getElementById('modal').style.display = 'block'; +} + +// Functie om de beschrijving op te halen afhankelijk van de titel +function getDescription(title) { + + // Broodjes beschrijvingen + if (title === "Broodje Gezond") { + return "Op dit broodje zit kaas, veldsla, komkommer, tomaat, ei, ham en/of kip en bufkes saus."; + } else if (title === "Bagel") { + return "Doughnut brood met spek, ei en kaas"; + } else if (title === "Broodje Gehakt met Joppiesaus") { + return "Een wit of bruin broodje met Gehakt, Ei, Sla en Joppiesaus ."; + } else if (title === "Saucijzenbroodje") { + return "Een knapperig korstje met een warme, kruidige vleesvulling"; + } else if (title === "Frikandelbroodje") { + return "Een knapperige korstje met een warme frikandel en curry saus erin"; + } else if (title === "Croissant") { + return "Verschilende diverse croisantje beschikbaar bij de counter"; + } else if (title === "Chocolade broodje") { + return "Een krokrantig korstje met chocolade erin"; + } else if (title === "Broodje kip") { + return "Op het broodje kip zit komkommer, salade, kip en bufkes saus"; + } else if (title === "Panini broodje") { + return "Verschillende diverse panini's zijn te vinden op de counter!"; + + // Koude dranken beschrijving + } else if (title === "Spa Water") { + return "Koude verfrissende water."; + } else if (title === "Milkshake") { + return "Verschillende diverse milkshake (keuze bij de counter maken)"; + } else if (title === "Lente Redbull") { + return "De Red Bull Spring Edition Walstro & Pink Grapefruit"; + } else if (title === "Redbull") { + return "De orginele Redbull"; + + + // Warme dranken beschrijving + } else if (title === "Chocomel") { + return "Een lekker warme chocolade melk"; + } else if (title === "Chocomel met slagroom") { + return "Een lekkere warme chocolade melk met slagroom"; + } else if (title === "Koffie") { + return "Een lekker warme koffie"; + } else if (title === "Thee") { + return "heerlijke warme thee (keuze bij de kassa)"; + + // Snacks beschrijving + } else if (title === "Frikandel") { + return "Gemalen gehakt in een staafje"; + } else if (title === "Friet") { + return "Een bakje friet"; + } else if (title === "Kipcorn") { + return "Een lekkere krokante Kipcorn."; + } else if (title === "Kipnuggets") { + return "Een bakje met 9 kipnuggets."; + } else if (title === "Mexicano") { + return "Een pittige mexicano."; + } else if (title === "Bitterballen") { + return "Een bakje met 9 Bitterballen ."; + } else if (title === "Koekjes") { + return "Lekkere knapperige chocolade koekjes!"; + } else if (title === "Kroket") { + return "Een lekkere krokante kroket!"; + } else if (title === "Kaassoufle") { + return "Een lekkere krokante kaassoufle!"; + + + + // Ijsjes beschrijving + } else if (title === "Ijsjes") { + return "Een lekker ijsje met vele smaken, zoals aardbei, vanille, chocolade, mint, bosbes en nog veel meer (alleen in de zomer!)."; + } else if (title === "Sorbet") { + return "Lekkeresorbet met saus naar keuze"; + } else if (title === "Softijs") { + return "Een melk ijsje"; + } else if (title === "Sundea ijs") { + return "Een softijs ijsje in een bakje met een sas naar keuze!"; + } else if (title === "Appelflap") { + return "Een lekker korstje met fijn gesneden appels, rozijnen en kaneel erin"; + + // Deals beschrijing + } else if (title === "Lunch Deal") { + return "Bij deze deal krijg je 1 snack naar keuze, wat frietjes en drinken naar keuze erbij!"; + } else if (title === "Gezonde Deal") { + return "Bij deze deal krijg je een keuze naar een broodje en een keuze naar een koude drank!!"; + + + // Soepen beschrijving + } if (title === "Tomatensoep") { + return "Tomatensoep met gehakt balletje"; + } if (title === "Kippensoep") { + return "Kippensoep met kip en groenten"; + } if (title === "Erwtensoep") { + return "Gemalen erwten met stukjes worst erin"; + } if (title === "Groentesoep (met gehaktballetjes)") { + return "Een soep met veel groente erin en gehaktballetjes"; + + // Salades beschrijving + } if (title === "Caesar Salade") { + return "In een klassieke Ceesar salade zit sla romaine, ui, kipfilet, citroen, mayonaise en olijfolie"; + } if (title === "Griekse Salade") { + return "In een Griekse salade zit komkommer, snoeptomatjes, klein beetje rode ui, olijven, feta kaas en croutons"; + } if (title === "Krokante Kip Salade") { + return "In de krokante Kip Salade zit kip, sla, klein beetje rode ui, snoeptomaatjes, olijfolie en komkommer"; + } if (title === "Aardappel Salade") { + return "In de aardappel salade zit aardappelen, prei, erwten, peper en zout"; + + // Sauzen beschrijving + } if (title === "Ketchup") { + return "Ketchup"; + } if (title === "Mayonaise") { + return "Mayonaise"; + } if (title === "Mosterd") { + return "Mosterd"; + } if (title === "Sweet Chili") { + return "Sweet Chili"; + } if (title === "Curry saus") { + return "Curry saus"; + } + // Yoghurt beschrijving + if (title === "Aardbij yoghurt") { + return "Yoghurt met aardbei"; + } if (title === "Optimel klein 250ml") { + return "Een klein pakje drink yoghurt"; + } if (title === "Optimel groot") { + return "Een groot pakje drink yoghurt"; + } if (title === "Melk") { + return "Halfvolle melk in een klein pakje"; + } if (title === "Fristi") { + return "Melkdrank met vruchtensmaak"; + } if (title === "Koude chocomelk") { + return "Koude chocomelk in een flesje"; + } if (title === "Breaker") { + return "Verschillende diverse smaken bij de counter"; + } if (title === "Yoghurt beker") { + return "Een klein bakje met yoghurt en musli erbij"; + } if (title === "Kwark 150 gram") { + return "Een klein bakje kwark"; + + } + { + // snoep beschrijing + } if (title === "Haribo starmix") { + return "Een mixzakje met 75g snoepjes. "; + } if (title === "Haribo Kikkers") { + return "Een zakje met 75g kikkertjes."; + } if (title === "Haribo Goudberen") { + return "Een zakje met 75g beertjes"; + } if (title === "Haribo Bananen") { + return "Een zakje met 75g banaantjes."; + } if (title === "Haribo Perzikken") { + return "Een zakje met 75g Perzikken."; + } if (title === "Haribo Tropifrutti") { + return "Een mix zakje met 75g Snoepjes."; + } if (title === "Haribo Tangfastics") { + return "Een mixzakje met 75g zure snoepjes."; + } if (title === "Haribo Kersen") { + return "Een zakje met 75g kersjes."; + } if (title === "Haribo Rolletje") { + return "Een rolletje met snoepjes."; + } if (title === "Haribo Pinballs") { + return "Een zakje met 75g balletjes."; + } if (title === "Haribo Happy Cola") { + return "Een zakje met 75g cola snoepjes."; +} +} +{ + // overige beschrijing + if (title === "Bestek") { + return "Plastice vorken, messen en lepels "; +} if (title === "Hervul baar bekers") { + return "Bekers die je kunt hervullen en daarna weg kan gooien"; +} if (title === "Rietjes") { + return "Plastice rietjes"; +} +} +// Functie om een item aan het winkelwagentje toe te voegen +function addToCart(item) { + const cart = JSON.parse(localStorage.getItem('cart')) || []; + cart.push(item); // Add item to the cart array + localStorage.setItem('cart', JSON.stringify(cart)); + updateCart(); +} + +// Functie om het winkelwagentje bij te werken +function updateCart() { + const cart = JSON.parse(localStorage.getItem('cart')) || []; + 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 = ` + ${item.title} + €${item.price.toFixed(2)} + + `; + 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'; + } + + // Update the cart count in the cart icon + document.getElementById('cart-count').innerText = cart.length; +} + +// Functie om een item uit het winkelwagentje te verwijderen +function removeFromCart(index) { + const cart = JSON.parse(localStorage.getItem('cart')) || []; + cart.splice(index, 1); + localStorage.setItem('cart', JSON.stringify(cart)); + updateCart(); +} + +// Functie om het modaal venster te sluiten +function closeModal() { + document.getElementById('modal').style.display = 'none'; + document.querySelector('.menu-bar').classList.remove('dark'); // Remove dark class from menu-bar +} + +// Zorg ervoor dat het modaal venster sluit wanneer er buiten het venster wordt geklikt +window.onclick = function(event) { + if (event.target == document.getElementById('modal')) { + closeModal(); + } +} + +// Initial call to updateCart to ensure the button is hidden on page load +updateCart(); + +// Functie om een bestelling te plaatsen +function placeOrder() { + const cart = JSON.parse(localStorage.getItem('cart')) || []; + if (cart.length === 0) { + alert('Uw winkelmandje is leeg.'); + return; + } + + const totalPrice = cart.reduce((total, item) => total + item.price, 0).toFixed(2); + + fetch('place_order.php', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + items: cart, + total_price: totalPrice + }) + }) + .then(response => response.json()) + .then(data => { + if (data.success) { + localStorage.removeItem('cart'); // Clear the cart + updateCart(); // Update the cart display + window.open(`betalen.html?order_number=${encodeURIComponent(data.order_number)}`, '_blank'); // Open the payment page in a new tab with order number + } else { + alert('Er is een fout opgetreden bij het plaatsen van uw bestelling. Probeer het opnieuw.'); + } + }) + .catch(error => console.error('Error placing order:', error)); +} + +// Bind the placeOrder function to the order button +document.getElementById('order-button').addEventListener('click', placeOrder); + +// Vertalingen voor beide talen (nl en en) +const translations = { + en: { + "Broodjes": "Sandwiches", + "Koude Dranken": "Cold Drinks", + "Warme Dranken": "Hot Drinks", + "Snacks": "Snacks", + "deserts": "Ice Creams", + "Deals": "Deals", + "Soepen": "Soups", + "Salades": "Salads", + "Sausjes": "Sauces", + "Snoep": "Candy", + "Winkelmandje": "Shopping Cart", + "Prijs": "Price", + "Toevoegen aan winkelmandje": "Add to cart", + "Bestellen": "Order", + "Totaal": "Total", + "Overige": "Other", + "Op dit broodje zit kaas, veldsla, komkommer, tomaat, ei, ham en/of kip en bufkes saus.": "This sandwich contains cheese, lamb's lettuce, cucumber, tomato, egg, ham and/or chicken, and bufkes sauce.", + "Doughnut brood met spek, ei en kaas": "Doughnut bread with bacon, egg, and cheese", + "Een wit of bruin broodje met Gehakt, Ei, Sla en Joppiesaus": "A white or brown sandwich with minced meat, egg, lettuce, and Joppiesaus", + "Een knapperig korstje met een warme, kruidige vleesvulling": "A crispy crust with a warm, spicy meat filling", + "Een knapperige korstje met een warme frikandel en curry saus erin": "A crispy crust with a warm frikandel and curry sauce inside", + "Koude verfrissende water.": "Cold refreshing water.", + "Verschillende diverse milkshake (keuze bij de counter maken)": "Various milkshakes (choose at the counter)", + "Een lekker warme chocolade melk": "A delicious hot chocolate milk", + "Een lekkere warme chocolade melk met slagroom": "A delicious hot chocolate milk with whipped cream", + "Een lekker warme koffie": "A delicious hot coffee", + "heerlijke warme thee (keuze bij de kassa)": "Delicious hot tea (choose at the counter)", + "Een frikandel, dat wil je wel!": "A frikandel, you want that!", + "Een klein bakje met friet.": "A small box of fries.", + "Een lekkere krokante Kipcorn.": "A delicious crispy Kipcorn.", + "Een bakje met 9 kipnuggets.": "A box with 9 chicken nuggets.", + "Een pittige mexicano.": "A spicy mexicano.", + "Een bakje met 9 Bitterballen.": "A box with 9 Bitterballen.", + "Een lekker ijsje met vele smaken, zoals aardbei, vanille, chocolade, mint, bosbes en nog veel meer (alleen in de zomer!).": "A delicious ice cream with many flavors, such as strawberry, vanilla, chocolate, mint, blueberry, and many more (only in summer!).", + "Lekkeresorbet met saus naar keuze": "Delicious sorbet with sauce of your choice", + "Bij deze deal krijg je 1 snack naar keuze, wat frietjes en drinken naar keuze erbij!": "With this deal, you get 1 snack of your choice, some fries, and a drink of your choice!", + "Bij deze deal krijg je een keuze naar een broodje en een keuze naar een koude drank!!": "With this deal, you get a choice of a sandwich and a choice of a cold drink!!", + "Soep van de dag! (Allergieën? Meld het bij ons!)": "Soup of the day! (Allergies? Let us know!)", + "Een heerlijke salade met verse groenten en een dressing naar keuze.": "A delicious salad with fresh vegetables and a dressing of your choice.", + "Kies de saus naar je keuze!": "Choose the sauce of your choice!", + }, + nl: { + "Sandwiches": "Broodjes", + "Cold Drinks": "Koude Dranken", + "Hot Drinks": "Warme Dranken", + "Snacks": "Snacks", + "Ice Creams": "deserts", + "Deals": "Deals", + "Soups": "Soepen", + "Salads": "Salades", + "Sauces": "Sausjes", + "Candy": "Snoep", + "Shopping Cart": "Winkelmandje", + "Price": "Prijs", + "Add to cart": "Toevoegen aan winkelmandje", + "Order": "Bestellen", + "Total": "Totaal", + "Other": "Overige", + "This sandwich contains cheese, lamb's lettuce, cucumber, tomato, egg, ham and/or chicken, and bufkes sauce.": "Op dit broodje zit kaas, veldsla, komkommer, tomaat, ei, ham en/of kip en bufkes saus.", + "Doughnut bread with bacon, egg, and cheese": "Doughnut brood met spek, ei en kaas", + "A white or brown sandwich with minced meat, egg, lettuce, and Joppiesaus": "Een wit of bruin broodje met Gehakt, Ei, Sla en Joppiesaus", + "A crispy crust with a warm, spicy meat filling": "Een knapperig korstje met een warme, kruidige vleesvulling", + "A crispy crust with a warm frikandel and curry sauce inside": "Een knapperige korstje met een warme frikandel en curry saus erin", + "Cold refreshing water.": "Koude verfrissende water.", + "Various milkshakes (choose at the counter)": "Verschillende diverse milkshake (keuze bij de counter maken)", + "A delicious hot chocolate milk": "Een lekker warme chocolade melk", + "A delicious hot chocolate milk with whipped cream": "Een lekkere warme chocolade melk met slagroom", + "A delicious hot coffee": "Een lekker warme koffie", + "Delicious hot tea (choose at the counter)": "heerlijke warme thee (keuze bij de kassa)", + "A frikandel, you want that!": "Een frikandel, dat wil je wel!", + "A small box of fries.": "Een klein bakje met friet.", + "A delicious crispy Kipcorn.": "Een lekkere krokante Kipcorn.", + "A box with 9 chicken nuggets.": "Een bakje met 9 kipnuggets.", + "A spicy mexicano.": "Een pittige mexicano.", + "A box with 9 Bitterballen.": "Een bakje met 9 Bitterballen.", + "A delicious ice cream with many flavors, such as strawberry, vanilla, chocolate, mint, blueberry, and many more (only in summer!).": "Een lekker ijsje met vele smaken, zoals aardbei, vanille, chocolade, mint, bosbes en nog veel meer (alleen in de zomer!).", + "Delicious sorbet with sauce of your choice": "Lekkeresorbet met saus naar keuze", + "With this deal, you get 1 snack of your choice, some fries, and a drink of your choice!": "Bij deze deal krijg je 1 snack naar keuze, wat frietjes en drinken naar keuze erbij!", + "With this deal, you get a choice of a sandwich and a choice of a cold drink!!": "Bij deze deal krijg je een keuze naar een broodje en een keuze naar een koude drank!!", + "Soup of the day! (Allergies? Let us know!)": "Soep van de dag! (Allergieën? Meld het bij ons!)", + "A delicious salad with fresh vegetables and a dressing of your choice.": "Een heerlijke salade met verse groenten en een dressing naar keuze.", + "Choose the sauce of your choice!": "Kies de saus naar je keuze!", + } +}; + +// Functie om de taal te wisselen +function switchLanguage(lang) { + // Zoek alle elementen met een data-translate attribuut + document.querySelectorAll("[data-translate]").forEach(element => { + const key = element.getAttribute("data-translate"); // Verkrijg de sleutel uit het data-translate attribuut + element.textContent = translations[lang][key] || key; // Vertaal de tekst of behoud de sleutel als er geen vertaling is + }); +} + +// Functie om de taal te wisselen wanneer de knop wordt aangeklikt +document.getElementById("language-switcher").addEventListener("click", () => { + const currentLang = document.documentElement.lang; // Huidige taal ophalen + const newLang = currentLang === "nl" ? "en" : "nl"; // Nieuwe taal bepalen + document.documentElement.lang = newLang; // Wijzig de taal van de pagina + switchLanguage(newLang); // Pas de vertalingen toe voor de nieuwe taal + + // Verander de tekst op de taalwisselknop + const switcher = document.getElementById("language-switcher"); + switcher.textContent = newLang === "nl" ? "EN" : "NL"; // Zet de knop tekst naar de andere taal +}); + +// Stel de standaardtaal in +document.documentElement.lang = "nl"; // Begin met Nederlands +switchLanguage("nl"); // Pas de vertalingen toe voor Nederlands bij het laden van de pagina diff --git a/projects/challange 7/Schoolkantine/website/style.css b/projects/challange 7/Schoolkantine/website/style.css new file mode 100644 index 0000000..ccb1d8d --- /dev/null +++ b/projects/challange 7/Schoolkantine/website/style.css @@ -0,0 +1,376 @@ +/* Algemene body */ +body { + font-family: Arial, sans-serif; + margin: 0; + display: flex; + flex-direction: column; /* Change to column to accommodate the top bar */ + background-color: #ffffff; +} + +/* Top bar menu */ +.menu-bar { + width: 75%; /* Use 75% of the screen width on the first page */ + background-color: #ffffff; + padding: 10px 0; + + display: flex; + flex-wrap: wrap; /* Allow wrapping of menu items */ + justify-content: center; /* Center the menu items */ + align-items: center; + position: absolute; /* Initially position in the middle */ + top: 60%; + left: 50%; + transform: translate(-50%, -50%); + transition: all 0.3s ease; /* Add transition for position and background color */ + z-index: 1; +} + +.menu-bar.top { + width: 100%; /* Use 100% of the screen width when at the top */ + position: fixed; /* Fix the top bar to the top */ + top: 0; + left: 0; + transform: translate(0, 0); + justify-content: space-around; /* Spread the menu items */ + flex-wrap: nowrap; /* Ensure all items are in a single row */ + overflow-x: auto; /* Enable horizontal scrolling */ +} + +.menu-bar.dark { + background-color: #ff8c00; /* Darker background color when modal is open */ +} + +.menu-item { + background-color: #ff8c00; + padding: 10px 20px; + margin: 5px; + border-radius: 25px; + cursor: pointer; + font-size: 1.2em; + transition: all 0.3s ease; + flex: 1 1 calc(33.333% - 10px); /* Allow 3 items per row with margin */ + text-align: center; /* Center text inside the menu item */ +} + +.menu-bar.top .menu-item { + flex: none; /* Remove flex-grow to fit all items in a single row */ +} + +.menu-item:hover { + transform: scale(1.05); +} + +/* Productweergave in een grid */ +.product-display { + width: calc(100% - 20%); /* Adjust width to leave space for the cart */ + display: flex; + flex-wrap: wrap; + padding: 20px; + justify-content: space-around; + margin-top: 60px; /* Add margin to ensure it starts below the top bar */ +} + +.product-box { + width: 200px; /* Keep the width fixed */ + margin: 10px; + border-radius: 8px; + overflow: hidden; + text-align: center; + cursor: pointer; + transition: all 0.3s ease, box-shadow 0.3s ease; + border: 2px solid #ff8c00; /* 2px dikke zwarte rand */ + padding: 20px; /* Ruimte binnen de container */ + } + +.product-box:hover { + transform: scale(1.05); +} + +.product-box img { + width: 100%; + max-height: 150px; + object-fit: cover; +} + +/* Modaal venster */ +.modal { + display: none; + position: fixed; + z-index: 1; + left: 0; + top: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + overflow-y: auto; /* Allow scrolling for larger content */ +} + +.modal-content { + background-color: white; + margin: 7% auto; + padding: 20px; + border-radius: 8px; + width: 80%; + max-width: 600px; + text-align: center; + max-height: 90vh; + overflow-y: auto; +} + +.modal img { + width: 100%; + max-width: 300px; + height: auto; + margin: 20px 0; +} + +.close { + position: absolute; + top: 110px; + right: 455px; + font-size: 60px; + font-weight: bold; + cursor: pointer; + color: red; +} + +#add-to-cart { + background-color: #F56E28; + color: white; + border: none; + padding: 10px 20px; + cursor: pointer; + border-radius: 5px; + margin-top: 20px; +} + +#add-to-cart:hover { + background-color: #F56E28; +} + +/* Winkelwagen-icoon */ +.cart-icon { + display: none; /* Initially hide the cart icon */ + position: fixed; + top: 80px; /* Move the cart icon down */ + right: 10px; /* Adjust right position to make space for language switcher */ + background-color: #ff6600; + color: white; + padding: 10px 15px; + border-radius: 50%; + font-size: 20px; + cursor: pointer; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +.cart-icon.visible { + display: block; /* Show the cart icon when the 'visible' class is added */ +} + +.cart-icon:hover { + background-color: #e65c00; +} + +.cart-count { + position: absolute; + top: -5px; + right: -5px; + background: red; + color: white; + font-size: 12px; + font-weight: bold; + padding: 3px 6px; + border-radius: 50%; +} + +/* Productstijl */ +.products { + display: flex; + gap: 20px; + margin: 50px; +} + +.product { + border: 1px solid #ddd; + padding: 20px; + text-align: center; +} + +.product button { + background-color: #ff6600; + color: white; + border: none; + padding: 10px; + cursor: pointer; + margin-top: 10px; +} + +.product button:hover { + background-color: #e65c00; +} + +/* Responsive design */ +@media (max-width: 768px) { + .menu-bar { + flex-wrap: nowrap; /* Ensure all items are in a single row */ + width: 100%; /* Use full width for menu bar */ + top: 0; /* Fix the menu bar to the top */ + left: 0; + transform: translate(0, 0); + justify-content: flex-start; /* Align items to the start */ + overflow-x: auto; /* Enable horizontal scrolling */ + padding: 10px; /* Add padding for better spacing */ + } + + .menu-item { + flex: none; /* Remove flex-grow to fit all items in a single row */ + margin: 5px; /* Add margin between items */ + font-size: 1em; /* Adjust font size for better readability */ + } + + .product-display { + width: 100%; /* Use full width for product display */ + margin-top: 120px; /* Increase margin to accommodate wrapped menu bar */ + padding: 10px; /* Add padding for better spacing */ + } + + .product-box { + width: calc(50% - 20px); /* Two items per row */ + margin: 10px; /* Add margin between items */ + } + + .cart { + width: 100%; /* Use full width for cart */ + top: auto; /* Remove fixed position */ + bottom: 0; /* Position at the bottom */ + height: auto; /* Adjust height */ + max-height: 50vh; /* Set a maximum height for the cart */ + overflow-y: auto; /* Enable vertical scrolling if content exceeds max-height */ + } + + .cart-icon { + top: 20px; /* Adjust position */ + right: 20px; /* Adjust position */ + } + + .language-switcher { + bottom: 20px; /* Position at the bottom */ + left: 20px; /* Position at the left */ + } + + .logo { + width: 80%; /* Adjust width for smaller screens */ + max-width: 300px; /* Set a maximum width */ + padding: 20px; /* Adjust padding */ + margin: 10px auto; /* Adjust margin */ + } +} + +/* Winkelmandje sectie */ +.cart { + display: none; /* Initially hide the cart */ + width: 15%; /* Make the cart a bit smaller */ + padding: 20px; + background-color: #fff; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + margin-top: 80px; /* Increase margin to ensure it starts below the categories bar */ + position: fixed; /* Fix the cart to the right side */ + right: 0; /* Align the cart to the right */ + top: 60px; /* Ensure it starts below the categories bar */ + flex-direction: column; /* Ensure the content is arranged in a column */ + overflow-y: auto; /* Enable vertical scrolling if content exceeds max-height */ + max-height: 80vh; /* Set a maximum height for the cart */ +} + +.cart ul { + list-style-type: none; + padding: 0; + margin: 0; +} + +.cart li { + padding: 10px 0; /* Space out the items */ + border-bottom: 1px solid #ff8c00; /* Change this to the orange color */ +} + + +.cart li { + margin-bottom: 10px; +} + +.cart-item button { + background-color: #d32f2f; + color: white; + border: none; + padding: 5px 10px; + cursor: pointer; + border-radius: 5px; +} + + +.cart-item { + display: flex; + justify-content: space-between; + padding: 10px 0; + border-bottom: 2px solid #ff8c00; /* Change this to the orange color */ +} + + +.cart-item button:hover { + background-color: #b71c1c; +} + +#order-button { + background-color: #4CAF50; + color: white; + border: none; + padding: 10px 20px; + cursor: pointer; + border-radius: 5px; + width: 100%; + text-align: center; + margin-top: 20px; + display: none; /* Hide the button by default */ + align-self: flex-end; /* Ensure the button is at the bottom */ +} + +#order-button:hover { + background-color: #45a049; + transform: scale(1.05); +} + +.cart.visible { + display: flex; /* Show the cart when the 'visible' class is added */ +} + +.logo { + width: 100%; + padding: 60px; + max-width: 400px; + margin: 20px auto; + display: block; + transition: opacity 0.3s ease; /* Add transition for smooth hiding */ +} + +.logo.hidden { + opacity: 0; /* Hide the logo */ + visibility: hidden; /* Ensure the logo is not clickable */ +} + +.language-switcher { + position: fixed; + bottom: 20px; /* Position at the bottom */ + left: 20px; /* Position at the left */ + background-color: #ff8c00; + color: white; + padding: 10px 20px; + border-radius: 25px; + cursor: pointer; + font-size: 1em; + transition: all 0.3s ease; + z-index: 1100; /* Ensure it is above other elements */ +} + +.language-switcher:hover { + background-color: #e65c00; +} \ No newline at end of file