diff --git a/html/data_treatment/AJAX/modifier_panier.php b/html/data_treatment/AJAX/modifier_panier.php
index fa188d16f60a698e3405de86591b230849e7ea95..1a2a86e99ed277e2f5a5267cba2c82a8683b0bd5 100644
--- a/html/data_treatment/AJAX/modifier_panier.php
+++ b/html/data_treatment/AJAX/modifier_panier.php
@@ -14,7 +14,7 @@ $itemQuantity = $_POST['itemQuantity'];
// Vérifier si l'article est déjà dans le panier
if (array_key_exists($itemName, $_SESSION['panier'])) {
// L'article est déjà dans le panier, mettez à jour la quantité
- $_SESSION['panier'][$itemId]['quantity'] += $itemQuantity;
+ $_SESSION['panier'][$itemName]['quantity'] += $itemQuantity;
} else {
// L'article n'est pas encore dans le panier, ajoutez-le au panier et à la base de données
$_SESSION['panier'][$itemName] = array(
diff --git a/html/data_treatment/AJAX/retirer_panier.php b/html/data_treatment/AJAX/retirer_panier.php
new file mode 100644
index 0000000000000000000000000000000000000000..16990f2e7fad7469899ffa43b2d5fc8620d9171f
--- /dev/null
+++ b/html/data_treatment/AJAX/retirer_panier.php
@@ -0,0 +1,15 @@
+<?php
+session_start();
+include("../connect_database.php");
+
+$itemName = $_POST['itemName'];
+
+// Vérifier si l'article est déjà dans le panier
+if (array_key_exists($itemName, $_SESSION['panier'])) {
+ // L'article est déjà dans le panier, mettez à jour la quantité
+ unset($_SESSION['panier'][$itemName]);
+}
+
+$response = array('success' => true, 'message' => 'Article retiré au panier avec succès');
+echo json_encode($response);
+?>
diff --git a/html/data_treatment/AJAX/updade_quantity.php b/html/data_treatment/AJAX/updade_quantity.php
new file mode 100644
index 0000000000000000000000000000000000000000..9da01efe0243fc7a9e32750e3a3312c769296426
--- /dev/null
+++ b/html/data_treatment/AJAX/updade_quantity.php
@@ -0,0 +1,21 @@
+<?php
+session_start();
+// Inclure la connexion à la base de données et d'autres configurations nécessaires
+
+if (isset($_POST['itemName']) && isset($_POST['newQuantity'])) {
+ $itemName = $_POST['itemName'];
+ $newQuantity = intval($_POST['newQuantity']);
+
+ // Mettre à jour la quantité dans la session panier
+ $_SESSION['panier'][$itemName]['quantity'] = $newQuantity;
+
+ if($_SESSION['panier'][$itemName]['quantity']==0){
+ unset($_SESSION['panier'][$itemName]);
+ }
+
+ echo 'Mise à jour de la quantité réussie';
+} else {
+ // Gérer les erreurs si les paramètres ne sont pas corrects
+ echo 'Erreur lors de la mise à jour de la quantité';
+}
+?>
diff --git a/startbootstrap-agency-gh-pages/checkout.php b/startbootstrap-agency-gh-pages/checkout.php
new file mode 100644
index 0000000000000000000000000000000000000000..b57734867e2770f164124021720ad4821565c5e0
--- /dev/null
+++ b/startbootstrap-agency-gh-pages/checkout.php
@@ -0,0 +1,18 @@
+<?php
+session_start();
+?>
+you have ordered:<br>
+<?php
+$text="";
+foreach($_SESSION["panier"] as $item){
+ $text .="- ".$item['quantity']." ".$item["itemName"]." which costs ";
+ if($item['quantity']>=16){
+ $text .= $item["price"]*$item["quantity"]*(1-0.16)." € (you have received a 16% discount !)<br>";
+ } else if($item['quantity']>=8){
+ $text .= $item["price"]*$item["quantity"]*(1-0.08)." € (you have received a 8% discount !)<br>";
+ } else {
+ $text .= $item["price"]*$item["quantity"]*(1)." €<br>";
+ }
+}
+echo $text;
+?>
diff --git a/startbootstrap-agency-gh-pages/index.php b/startbootstrap-agency-gh-pages/index.php
index 189704bdc45ba5b1b1f06c77e4c9227df731a930..812e0c06bfaa30bd286ab6f0a6def13382042c87 100644
--- a/startbootstrap-agency-gh-pages/index.php
+++ b/startbootstrap-agency-gh-pages/index.php
@@ -42,6 +42,7 @@ switch ($j) {
break;
}
include("../html/data_treatment/connect_database.php");
+var_dump($_SESSION["panier"]);
?>
<html lang="en">
<head>
@@ -62,6 +63,50 @@ include("../html/data_treatment/connect_database.php");
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700" rel="stylesheet" type="text/css" />
<!-- Core theme CSS (includes Bootstrap)-->
<link href="css/styles.css" rel="stylesheet" />
+ <script>
+
+
+function updateOnlineUsers() {
+$.ajax({
+ url: '../html/data_treatment/AJAX/online_Users.php',
+ success: function (data) {
+ $('#onlineUsers').text('Online Users: ' + data);
+ }
+});
+}
+
+// Update online user count every 30 seconds
+setInterval(updateOnlineUsers, 30000);
+
+// Initial update
+updateOnlineUsers();
+function addToCart(button) {
+var itemId = button.getAttribute("data-item-id");
+var itemName = button.getAttribute("data-item-name");
+var itemPrice = button.getAttribute("data-item-price");
+var itemQuantity = document.getElementById("quantity" + itemId).value;
+// Faire une requête Ajax pour ajouter l'article au panier
+$.ajax({
+url: '../html/data_treatment/AJAX/modifier_panier.php', // Correction du chemin du fichier
+method: 'POST',
+data: {
+ itemName: itemName,
+ itemPrice: itemPrice,
+ itemQuantity: itemQuantity
+},
+dataType: 'json',
+success: function (response) {
+ alert(response.message); // Vous pouvez personnaliser cela en fonction de votre logique
+ $('#example').text(parseInt($('#numberbox').text(), 10)+itemQuantity);
+},
+error: function (error) {
+ console.error(error);
+}
+});
+}
+
+</script>
+
</head>
<body id="page-top">
<!-- Navigation-->
@@ -74,7 +119,14 @@ include("../html/data_treatment/connect_database.php");
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<a href="shoppingPage.php"><i class="fa-solid fa-cart-shopping"></i></a>
- <div class="number-box">0</div>
+ <div class="number-box" id="numberbox">
+ <?php
+ $count = 0;
+ foreach($_SESSION["panier"] as $item){
+ $count +=intval($item["quantity"]);
+ }
+ echo $count;?>
+ </div>
<style>
.number-box {
width: 30px;
@@ -339,7 +391,7 @@ include("../html/data_treatment/connect_database.php");
<p><?php echo "Price: ".$articles[$i]["price"]." € <br>Quantity available: ".$articles[$i]["quantity"];?></p>
<div class="quantity">
<button onclick="decrementQuantity(this)">-</button>
- <input type="text" value="1" <?php echo 'id="quantity"'.$i; ?>>
+ <input type="text" value="1" <?php echo 'id="quantity'.$i.'"'; ?>>
<button onclick="incrementQuantity(this)">+</button>
</div>
<button class="btn btn-primary btn-xl text-uppercase" type="button"
@@ -350,60 +402,61 @@ include("../html/data_treatment/connect_database.php");
Add to shopping cart
</button>
- <script>
- function incrementQuantity(button) {
- var input = button.parentNode.querySelector('input');
- var value = parseInt(input.value, 10);
- input.value = value + 1;
- }
+ <script>
+ function incrementQuantity(button) {
+ var input = button.parentNode.querySelector('input');
+ var value = parseInt(input.value, 10);
+ input.value = value + 1;
+ }
- function decrementQuantity(button) {
- var input = button.parentNode.querySelector('input');
- var value = parseInt(input.value, 10);
- if (value > 0) {
- input.value = value - 1;
+ function decrementQuantity(button) {
+ var input = button.parentNode.querySelector('input');
+ var value = parseInt(input.value, 10);
+ if (value > 0) {
+ input.value = value - 1;
+ }
}
+ function removeProduct(button) {
+ var product = button.parentNode.parentNode;
+ product.parentNode.removeChild(product);
+ }
+ </script>
+ <style>
+ .button-container {
+ text-align: center;
+ }
+ .product {
+ border: 1px solid #ddd;
+ margin: 1em;
+ padding: 1em;
+ text-align: center;
+ }
+ .page-section h3.section-subheading, .page-section .section-subheading.h3 {
+ margin-bottom: 0;
+ }
+ .remove-button {
+ background-color: #ff6961; /* Light red color */
+ color: #fff;
+ border: none;
+ padding: 0.5em;
+ cursor: pointer;
+ }
+ .quantity button {
+ background-color: #333;
+ color: #fff;
+ border: none;
+ padding: 0.5em;
+ cursor: pointer;
}
- function removeProduct(button) {
- var product = button.parentNode.parentNode;
- product.parentNode.removeChild(product);
- }
- </script>
- <style>
- .button-container {
- text-align: center;
- }
- .product {
- border: 1px solid #ddd;
- margin: 1em;
- padding: 1em;
- text-align: center;
- }
- .page-section h3.section-subheading, .page-section .section-subheading.h3 {
- margin-bottom: 0;
- }
- .remove-button {
- background-color: #ff6961; /* Light red color */
- color: #fff;
- border: none;
- padding: 0.5em;
- cursor: pointer;
- }
- .quantity button {
- background-color: #333;
- color: #fff;
- border: none;
- padding: 0.5em;
- cursor: pointer;
- }
- .quantity input {
- width: 2em;
- text-align: center;
- margin: 0 0.5em;
- }
-
- </style>
+ .quantity input {
+ width: 2em;
+ text-align: center;
+ margin: 0 0.5em;
+ }
+
+ </style>
+ </div>
</div>
</div>
</div>
@@ -421,47 +474,5 @@ include("../html/data_treatment/connect_database.php");
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *-->
<script src="https://cdn.startbootstrap.com/sb-forms-latest.js"></script>
<script src="js/slideBox.js"></script>
- <script>
- function updateOnlineUsers() {
- $.ajax({
- url: '../html/data_treatment/AJAX/online_Users.php',
- success: function (data) {
- $('#onlineUsers').text('Online Users: ' + data);
- }
- });
- }
-
- // Update online user count every 30 seconds
- setInterval(updateOnlineUsers, 30000);
-
- // Initial update
- updateOnlineUsers();
-
- function addToCart(button) {
- var itemId = button.getAttribute("data-item-id");
- var itemName = button.getAttribute("data-item-name");
- var itemPrice = button.getAttribute("data-item-price");
- var itemQuantity = document.getElementById("quantity" + itemId).value;
-
- // Faire une requête Ajax pour ajouter l'article au panier
- $.ajax({
- url: '../html/data_treatment/AJAX/modifier_panier.php',
- method: 'POST',
- data: {
- itemName: itemName,
- itemPrice: itemPrice,
- itemQuantity: itemQuantity
- },
- dataType: 'json',
- success: function (response) {
- alert(response.message); // Vous pouvez personnaliser cela en fonction de votre logique
- },
- error: function (error) {
- console.error(error);
- }
- });
- }
-
- </script>
</body>
</html>
diff --git a/startbootstrap-agency-gh-pages/shoppingPage.php b/startbootstrap-agency-gh-pages/shoppingPage.php
index 17045cf9ab3c3f08d8273d533c33258ecb653ba9..1eda7872f2ae086606ce4307b8384604449cff7e 100644
--- a/startbootstrap-agency-gh-pages/shoppingPage.php
+++ b/startbootstrap-agency-gh-pages/shoppingPage.php
@@ -5,6 +5,28 @@ if(!isset($_SESSION["username"])){
header("location: ../html/login.php");
exit;
}
+// Récupérez les noms d'articles depuis le panier
+$itemNames = array_keys($_SESSION["panier"]);
+
+// Construisez une chaîne de noms d'articles formatée pour la requête SQL
+$itemListCsv = "'" . implode("','", $itemNames) . "'";
+
+// Exécutez la requête SQL pour récupérer les informations sur les articles du panier
+$sql = "SELECT * FROM articles WHERE itemName IN ($itemListCsv)";
+$result = $conn->query($sql);
+
+// Traitement des résultats ici...
+while ($row = $result->fetch_assoc()) {
+ // Accédez aux données de chaque article
+ $_SESSION["panier"][$row["itemName"]]["imagename"] = $row["imagename"];
+ $_SESSION["panier"][$row["itemName"]]["itemName"] = $row["itemName"];
+ ;
+
+
+ // Faites ce que vous avez besoin de faire avec ces informations
+ // Par exemple, affichez-les ou les utilisez d'une autre manière
+}
+var_dump($_SESSION["panier"]);
?>
<!DOCTYPE html>
@@ -20,6 +42,8 @@ if(!isset($_SESSION["username"])){
<!-- Font Awesome icons (free version)-->
<script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/883fc94f2e.js" crossorigin="anonymous"></script>
+ <!-- JQuery -->
+ <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- Google fonts-->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700" rel="stylesheet" type="text/css" />
@@ -60,47 +84,90 @@ if(!isset($_SESSION["username"])){
</div>
</div>
</section>
-
- <div class="product">
- <img src="assets/img/laptops/2.jpg" style="width:10%">
- <h2>HP Omen 17</h2>
- <p>Price: $19.99</p>
- <div class="quantity">
- <button class="remove-button" onclick="removeProduct(this)">X</button>
- <button onclick="decrementQuantity(this)">-</button>
- <input type="text" value="1" id="quantity1" readonly>
- <button onclick="incrementQuantity(this)">+</button>
+ <?php foreach($_SESSION["panier"] as $item){ ?>
+ <div class="product">
+ <img <?php echo 'src="../image/laptops/'.$item['imagename'].'"'?> style="width:10%">
+ <h2><?php echo $item["itemName"];?></h2>
+ <input type="hidden" value="<?php echo $item["price"];?>" id=unitprice-<?php echo $item["itemName"];?>>
+ <p id="price-<?php echo $item["itemName"]; ?>" data-price="<?php echo $item["price"]; ?>">
+ <?php if($item['quantity']>=16){
+ echo "Price: ".$item["price"]*$item["quantity"]*(1-0.16)." € (16% discount)";
+ } else if($item['quantity']>=8){
+ echo "Price: ".$item["price"]*$item["quantity"]*(1-0.08)." € (8% discount)";
+ } else {
+ echo "Price: ".$item["price"]*$item["quantity"]." €";
+ }?></p>
+ <div class="quantity">
+ <button class="remove-button" onclick="removeProduct(this, '<?php echo $item["itemName"]; ?>')">X</button>
+ <button onclick="decrementQuantity(this, '<?php echo $item["itemName"]; ?>')">-</button>
+ <input type="text" value=<?php echo '"'.$item["quantity"].'" id="quantity-'.$item["itemName"].'"';?> readonly>
+ <button onclick="incrementQuantity(this, '<?php echo $item["itemName"]; ?>')">+</button>
+ </div>
</div>
- </div>
+ <?php }?>
- <div class="product">
- <h2>Product 2</h2>
- <p>Price: $29.99</p>
- <button>Add to Cart</button>
- </div>
<div class="button-container">
- <a class="btn btn-primary btn-xl text-uppercase" href="#services" style="background-color: #ff6961; color: #fff; border: none; padding: 10px 20px; text-decoration: none; text-align: center; display: inline-block; font-size: 16px;">Checkout</a>
+ <a class="btn btn-primary btn-xl text-uppercase" href="checkout.php" style="background-color: #ff6961; color: #fff; border: none; padding: 10px 20px; text-decoration: none; text-align: center; display: inline-block; font-size: 16px;">Checkout</a>
</div>
<script>
- function incrementQuantity(button) {
+ function updateQuantity(itemName, newQuantity) {
+ $.ajax({
+ type: 'POST',
+ url: '../html/data_treatment/AJAX/updade_quantity.php', // Crée un fichier PHP pour traiter la mise à jour de la quantité
+ data: { itemName: itemName, newQuantity: newQuantity },
+ success: function(response) {
+ },
+ error: function(error) {
+ console.error('Erreur lors de la mise à jour de la quantité:', error);
+ }
+ });
+ }
+
+ function incrementQuantity(button, itemName) {
var input = button.parentNode.querySelector('input');
var value = parseInt(input.value, 10);
input.value = value + 1;
+ updateQuantity(itemName, input.value);
+ var price = button.parentNode.parentNode.querySelector('p');
+ var unitprice = button.parentNode.parentNode.querySelector('input[type="hidden"]');
+ if(input.value>=16){
+ price.innerText = "Price: "+parseInt(unitprice.value,10)*input.value*(1-0.16)+" € (16% discount)";
+ } else if(input.value>=8){
+ price.innerText = "Price: "+parseInt(unitprice.value,10)*input.value*(1-0.08)+" € (8% discount)";
+ } else {
+ price.innerText = "Price: "+parseInt(unitprice.value,10)*input.value+" €";
+ }
}
- function decrementQuantity(button) {
+ function decrementQuantity(button, itemName) {
var input = button.parentNode.querySelector('input');
var value = parseInt(input.value, 10);
if (value > 0) {
input.value = value - 1;
+ var price = button.parentNode.parentNode.querySelector('p');
+ var unitprice = button.parentNode.parentNode.querySelector('input[type="hidden"]');
+ if(input.value>=16){
+ price.innerText = "Price: "+parseInt(unitprice.value,10)*input.value*(1-0.16)+" € (16% discount)";
+ } else if(input.value>=8){
+ price.innerText = "Price: "+parseInt(unitprice.value,10)*input.value*(1-0.08)+" € (8% discount)";
+ } else {
+ price.innerText = "Price: "+parseInt(unitprice.value,10)*input.value+" €";
+ }
+ updateQuantity(itemName, input.value);
+ if(input.value == 0){
+ var product = button.parentNode.parentNode;
+ product.parentNode.removeChild(product);
+ }
}
}
- function removeProduct(button) {
+
+ function removeProduct(button, itemName) {
var product = button.parentNode.parentNode;
product.parentNode.removeChild(product);
- }
+ updateQuantity(itemName, 0); // 0 signifie retirer complètement l'article
+ }
</script>
<style>
.button-container {