From d9b4fd90ff44c73f7b25318979e304ff264cb55c Mon Sep 17 00:00:00 2001
From: stomarfaa <8613-stomarfaa@users.noreply.code.fbi.h-da.de>
Date: Tue, 16 Jan 2024 19:44:13 +0100
Subject: [PATCH] implement praktikum 4 aufgabe 1
---
src/Praktikum/Prak4/Bestellung.php | 35 ++--------
src/Praktikum/Prak4/JS/BestellScript.js | 93 +++++++++++++++----------
2 files changed, 63 insertions(+), 65 deletions(-)
diff --git a/src/Praktikum/Prak4/Bestellung.php b/src/Praktikum/Prak4/Bestellung.php
index db5fe64..34d4745 100644
--- a/src/Praktikum/Prak4/Bestellung.php
+++ b/src/Praktikum/Prak4/Bestellung.php
@@ -102,7 +102,7 @@ class Bestellung extends Page
foreach ($data as $pizza) {
echo <<< HTML
<label>
- <img class="pizzaImage" alt="Image of Pizza {$pizza->getName()}" src="{$pizza->getPicture()}" data-articleID="{$pizza->getArticleId()}" data-name="{$pizza->getName()}" data-price="{$pizza->getPrice()}" onclick="addItem(this)">
+ <img class="pizzaImage" alt="Image of Pizza {$pizza->getName()}" src="{$pizza->getPicture()}" data-articleID="{$pizza->getArticleId()}" data-name="{$pizza->getName()}" data-price="{$pizza->getPrice()}" onclick="addItem(this);">
<br>
{$pizza->getName()}<br>
{$pizza->getPrice()}€
@@ -110,38 +110,25 @@ class Bestellung extends Page
<br>
HTML;
}
- //$selectSize = count($data);
+
echo <<< HTML
-
+ <script>getElements();</script>
</section>
- <script> getElements(); </script>
<hr>
<section id="warenkorbSection">
<h2>Warenkorb</h2>
<form accept-charset="UTF-8" action="#" method="post">
<label for="warenkorb"></label>
- <select id="warenkorb" multiple name="Pizza[]" disabled >
- HTML;
-
- /*
- foreach ($data as $pizza) {
- echo <<< HTML
-
- <option value="{$pizza->getArticleId()}">{$pizza->getName()}</option>
-
- HTML;
- }
- */
- echo <<< HTML
+ <select id="warenkorb" multiple name="Pizza[]">
</select>
<p id="sum"></p>
<label for="address"></label>
<input id="address" name="Adresse" placeholder="Ihre Adresse" type="text" required><br>
- <input type="reset" value="Alles Löschen">
- <input type="reset" value="Auswahl Löschen">
- <input type="submit" name="save" value="Bestellen">
+ <input type="button" value="Alles Löschen" onclick="removeAll();">
+ <input type="button" value="Auswahl Löschen" onclick="removeItem();">
+ <input id="submitButton" type="submit" name="save" value="Bestellen" onclick="selectOrder();">
</form>
</section>
</section>
@@ -170,7 +157,6 @@ class Bestellung extends Page
$this->_database->query($orderingQuery);
$orderingID = mysqli_insert_id($this->_database);
-
if(!isset($_SESSION["orders"])) {
$_SESSION["orders"] = array();
}
@@ -225,10 +211,3 @@ class Bestellung extends Page
// This call is starting the creation of the page.
// That is input is processed and output is created.
Bestellung::main();
-
-// Zend standard does not like closing php-tag!
-// PHP doesn't require the closing tag (it is assumed when the file ends).
-// Not specifying the closing ? > helps to prevent accidents
-// like additional whitespace which will cause session
-// initialization to fail ("headers already sent").
-//? >
diff --git a/src/Praktikum/Prak4/JS/BestellScript.js b/src/Praktikum/Prak4/JS/BestellScript.js
index 8f6136b..fb601bc 100644
--- a/src/Praktikum/Prak4/JS/BestellScript.js
+++ b/src/Praktikum/Prak4/JS/BestellScript.js
@@ -1,63 +1,82 @@
-pizzaMap = new Map();
+pizzaPriceMap = new Map();
function getElements() {
- console.log("run getElements()");
"use strict";
let pizzaImages = document.getElementsByClassName("pizzaImage")
for (let item of pizzaImages) {
- pizzaMap.set(item.getAttribute("data-articleID"), 0);
- console.log(item.getAttribute("data-articleID") + " " + item.dataset.name);
+ pizzaPriceMap.set(item.getAttribute("data-articleID"), item.getAttribute("data-price"));
}
- console.log(pizzaMap);
}
-
-shoppingCart = new Map();
function addItem(pizza) {
"use strict";
let articleID = pizza.getAttribute("data-articleID");
- let amount = pizzaMap.get(articleID);
- amount++;
- pizzaMap.set(articleID, amount);
-
- if (shoppingCart.has(articleID)) {
- shoppingCart.set(articleID, amount);
- let option = document.getElementById(articleID);
- option.text = pizza.getAttribute("data-name") + " x " + amount;
-
- } else {
- shoppingCart.set(articleID, amount);
- let newOption = document.createElement("option")
- newOption.id = articleID;
- newOption.text = pizza.getAttribute("data-name") + " x " + amount;
- newOption.value = articleID;
- document.getElementById("warenkorb").add(newOption);
- }
- console.log("ANZAHL: " + pizzaMap.get(articleID));
+ let name = pizza.getAttribute("data-name");
+ let select = document.getElementById("warenkorb");
+ let newOption = document.createElement("option");
+ newOption.text = name;
+ newOption.value = articleID;
+ select.add(newOption);
+ calculateSum();
+ checkInputs();
}
-// Bei jedem addItem() wird das jeweilige Option verworfen und neu erstellt (um anzahl zu aktualisieren)
-
-
-
-
+function calculateSum() {
+ "use strict";
+ let select = document.getElementById("warenkorb");
+ let price = 0;
+ for (let item of select.options) {
+ price += parseFloat(pizzaPriceMap.get(item.value));
+ }
+ document.getElementById("sum").innerText = price.toFixed(2) + " €";
+}
+function removeItem() {
+ "use strict";
+ let select = document.getElementById("warenkorb");
+ select.remove(select.selectedIndex);
+ calculateSum();
+ checkInputs();
+}
+function removeAll() {
+ "use strict";
+ let select = document.getElementById("warenkorb");
+ select.options.length = 0;
+ calculateSum();
+ checkInputs();
+}
+function selectOrder() {
+ "use strict";
+ let select = document.getElementById("warenkorb");
+ for (let option of select.options) {
+ option.selected = true;
+ }
+}
+function checkInputs() {
+ "use strict";
+ const selectInput = document.getElementById('warenkorb');
+ const address = document.getElementById('address');
+ const button = document.getElementById('submitButton');
+ // Check conditions
+ const selectHasOptions = selectInput.options.length > 0;
+ const addressHasValue = address.value.trim() !== '';
+ // Enable or disable the button
+ button.disabled = !(selectHasOptions && addressHasValue);
+}
+//--- LISTENERS
+window.onload = function init() {
+ document.getElementById('address').addEventListener('input', checkInputs);
+};
+document.addEventListener('DOMContentLoaded', checkInputs); // Check on page load
-/*
-const s = function addItem(pizza) {
- console.log("Bestellt " + pizza.dataset.name + " " + pizza.dataset.price );
- let tempPizza = pizza.dataset;
- orderMap.set(tempPizza, orderMap.get(tempPizza) + 1 );
-}
-*/
--
GitLab